Button hover & .btn-default styling

[quasipickle]

I suppose I could have posted in the BS3 thread, but at some point individual topics about BS3 need to have their own thread.

Buttons

• I don't think the hover colour change is drastic enough. On all but the green button, I can barely discern any colour change. I think the change should be more obvious - especially because most people have bad eyesight.
• There's no "plain" button any more. To me this seems like quite a stark omission. I can think of many cases where I don't want all my buttons to stick out as much as black-on-white.

Navbar
.navbar-text and .navbar-btn aren't vertically aligned with .brand. You can see this here: http://twbs.github.io/bootstrap/components/#navbar-buttons

List groups & Panels
Love these. Great addition.

[cvrebert]

Filed a separate issue for the navbar: #8790. Refocusing this issue on the button stuff.

[pastur]

There should be a button class that is clearly secondary, based on color saturation. That's the point of having primary and secondary buttons. Light gray looks secondary versus blue. Black vs blue is not so obvious.

[sslepian]

@pastur Maybe something like this? It's just the .btn class with border-color: #AAAAAA. It'd need a better hover-state too, since the default hover state changes the text color to white, which is obviously unreadable on that button.

[cvrebert]

Related issue from #8827:

the 'pressed' state for the js buttons plugin is the same as the mouseover state. With standard buttons, this works fine, but it's ambiguous for toggleable buttons.

[pastur]

@sslepian I think the border makes the button look smaller. I was thinking in something more like this:

[fender]

Need a secondary button for sure. I like that one @pastur but with dark grey text and a very slightly darker background color.

[pastur]

Second try:

[fender]

+1

[joezimjs]

+1 I like @pastur's second try. We need to get this done.

[mdo]

Kapow!

[joezimjs]

I preferred the idea of having a "secondary" style, but I guess this sticks more with the conventions throughout the rest of the code. Also, this is now the only button style that has a visible border. Not necessarily a bad thing, but it doesn't seem to fit in.

[mdo]

Also, this is now the only button style that has a visible border

@joezimjs I've addressed that in another commit ;).

[PHLAK]

I understand the changes made to buttons with RC2, but now I want the dark button back for certain purposes. I can make this myself, but feel a dark button is useful to have as a default option. Could be .btn-inverse or .btn-dark

[cvrebert]

We specifically dropped .btn-inverse for being non-semantic; .btn-dark isn't any better in that respect.

[SharpNoiZy]

+1 for btn-dark

[quasipickle]

@mdo In my opinion the contrast in the red button isn't enough. Good improvement on the rest of them though.

[sergio-toro]

+1 for btn-dark

[shaund]

+1 for btn-dark

We're switching back to rc1 because the new default button doesn't fit in with the rest of the buttons.

Accessibility is also an issue, the border is too thin for some people to see, and so they do not realize it's a button until this fact is pointed out to them.

[quasipickle]

@shaund Wouldn't it be better to just tweak the CSS than reverting back to a broken RC?

[SharpNoiZy]

@quasipickle
We did the same like @shaund on exact same reasons.
We hope that RC3 will reinvent the dark button, so that we don't have to create our own style, because that is the reason to use bootstrap, to not define our own styles. ;)