Button colors

Game development with Board Game Arena Studio
Post Reply
User avatar
Peyo61
Posts: 8
Joined: 15 March 2014, 20:37

Button colors

Post by Peyo61 »

The addActionButton doc specifies only 3 color choices: blue, red, gray.

I would REALLY like to use another color, like white, in my interface (where it makes sense to associate button color to action). Is this too much to ask the site devs to consider this ?

I did try "gray", which would actually be acceptable, but it turns out transparent which makes the button kind-of disappear next to his bright-colored button-friends. Not nice at all. Anyway I think adding a few bright color choices would not hurt :-)

Hope this gets some support !

Cheers,
Pierre
User avatar
Victoria_La
Posts: 665
Joined: 28 December 2015, 20:55

Re: Button colors

Post by Victoria_La »

Just define you own addButton, call original one, find a button
using dojo function and change its style. The other option redefine the style in your stylesheet, for example blue button style is .bgabutton_blue, if you redefine it to be white all blue buttons will be white.
Dynamic way is
dojo.query('.action-button').removeClass('bgabutton_blue');
dojo.query('.action-button').addClass('bgabutton_white');
And you have to have .bgabutton_white defined in our stylesheet.
User avatar
Peyo61
Posts: 8
Joined: 15 March 2014, 20:37

Re: Button colors

Post by Peyo61 »

Thanks for the hints. However it seems that it's not that simple, or at least too complicated for me.

The styling of the bgabutton's, which I copied from the BGA main CSS and tried to mimic for a white button, is too sophisticated for me, and changing the class gives weird results. Plus not future-proof I guess.

I really wish the BGA devs would consider adding a few more bright colors to the button API... (which would be future-proof by definition)
User avatar
Victoria_La
Posts: 665
Joined: 28 December 2015, 20:55

Re: Button colors

Post by Victoria_La »

I just tried that it works as expected, I defined a new function

Code: Select all

        addWhiteActionButton : function(id, div, handler) {
            this.addActionButton(id, div, handler, '', false, 'gray');
            dojo.style(id, "background-color", "white");
            dojo.style(id, "border", "1px solid white");
        },
to call

Code: Select all

    this.addWhiteActionButton("button_" + die, htmlOrTextForMyDie, 'onDieSelect');
Post Reply

Return to “Developers”