New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Button hover & .btn-default styling #8786

Closed
quasipickle opened this Issue Jul 29, 2013 · 20 comments

Comments

Projects
None yet
@quasipickle

quasipickle commented Jul 29, 2013

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

This comment has been minimized.

Show comment
Hide comment
@cvrebert

cvrebert Jul 29, 2013

Member

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

Member

cvrebert commented Jul 29, 2013

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

@cvrebert cvrebert referenced this issue Jul 29, 2013

Merged

WIP: Bootstrap 3 #6342

120 of 126 tasks complete
@pastur

This comment has been minimized.

Show comment
Hide comment
@pastur

pastur Jul 29, 2013

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.

pastur commented Jul 29, 2013

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.

@cvrebert cvrebert referenced this issue Jul 30, 2013

Closed

btn class? #8828

@sslepian

This comment has been minimized.

Show comment
Hide comment
@sslepian

sslepian Jul 30, 2013

@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.

bootstap_buttons

sslepian commented Jul 30, 2013

@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.

bootstap_buttons

@cvrebert

This comment has been minimized.

Show comment
Hide comment
@cvrebert

cvrebert Jul 30, 2013

Member

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.

Member

cvrebert commented Jul 30, 2013

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

This comment has been minimized.

Show comment
Hide comment
@pastur

pastur Jul 31, 2013

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

buttons

pastur commented Jul 31, 2013

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

buttons

@fender

This comment has been minimized.

Show comment
Hide comment
@fender

fender Jul 31, 2013

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

fender commented Jul 31, 2013

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

@pastur

This comment has been minimized.

Show comment
Hide comment
@pastur

pastur Jul 31, 2013

Second try:

captura1

pastur commented Jul 31, 2013

Second try:

captura1

@fender

This comment has been minimized.

Show comment
Hide comment
@fender

fender commented Jul 31, 2013

+1

@joezimjs

This comment has been minimized.

Show comment
Hide comment
@joezimjs

joezimjs Aug 2, 2013

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

joezimjs commented Aug 2, 2013

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

@mdo

This comment has been minimized.

Show comment
Hide comment
@mdo

mdo Aug 5, 2013

Member

screen shot 2013-08-05 at 9 04 47 am

Kapow!

Member

mdo commented Aug 5, 2013

screen shot 2013-08-05 at 9 04 47 am

Kapow!

@joezimjs

This comment has been minimized.

Show comment
Hide comment
@joezimjs

joezimjs Aug 5, 2013

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.

joezimjs commented Aug 5, 2013

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

This comment has been minimized.

Show comment
Hide comment
@mdo

mdo Aug 5, 2013

Member

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

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

Member

mdo commented Aug 5, 2013

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

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

@PHLAK

This comment has been minimized.

Show comment
Hide comment
@PHLAK

PHLAK Aug 14, 2013

Contributor

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

Contributor

PHLAK commented Aug 14, 2013

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

This comment has been minimized.

Show comment
Hide comment
@cvrebert

cvrebert Aug 14, 2013

Member

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

Member

cvrebert commented Aug 14, 2013

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

@SharpNoiZy

This comment has been minimized.

Show comment
Hide comment
@SharpNoiZy

SharpNoiZy Aug 15, 2013

+1 for btn-dark

SharpNoiZy commented Aug 15, 2013

+1 for btn-dark

@quasipickle

This comment has been minimized.

Show comment
Hide comment
@quasipickle

quasipickle Aug 15, 2013

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

quasipickle commented Aug 15, 2013

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

@sergio-toro

This comment has been minimized.

Show comment
Hide comment
@sergio-toro

sergio-toro Aug 16, 2013

+1 for btn-dark

sergio-toro commented Aug 16, 2013

+1 for btn-dark

@shaund

This comment has been minimized.

Show comment
Hide comment
@shaund

shaund Aug 17, 2013

+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.

shaund commented Aug 17, 2013

+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

This comment has been minimized.

Show comment
Hide comment
@quasipickle

quasipickle Aug 19, 2013

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

quasipickle commented Aug 19, 2013

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

@SharpNoiZy

This comment has been minimized.

Show comment
Hide comment
@SharpNoiZy

SharpNoiZy Aug 20, 2013

@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. ;)

SharpNoiZy commented Aug 20, 2013

@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. ;)

stempler pushed a commit to stempler/bootstrap that referenced this issue Apr 11, 2014

stempler pushed a commit to stempler/bootstrap that referenced this issue Apr 11, 2014

stempler pushed a commit to stempler/bootstrap that referenced this issue Nov 4, 2014

stempler pushed a commit to stempler/bootstrap that referenced this issue Nov 4, 2014

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment