GNOME Bugzilla – Bug 687110
Improve the button insensitive style
Last modified: 2012-10-30 12:43:51 UTC
The current insensitive style for buttons needs to be improved. Right now we just change the text color: this doesn't make it clear that the button is actually insensitive. Instead of just changing the text color, we should make the button background completely transparent. We should also make the text color the same as the border color: https://dl.dropbox.com/u/5031519/gnome-shell/login/1-incomplete.png This style should apply to modal dialog buttons, notification buttons, and the login button.
Why is this under the keyboard component? Anyway, it's all CSS, so I'm marking this gnome-love. Relevant classes are .modal-dialog-button and .notification-button.
(In reply to comment #1) > Why is this under the keyboard component? Oops. Fixed now.
Created attachment 227552 [details] [review] Patch
This is what it looks like in the various places (do not take care of the password entry, this is not in this patch): http://zzrough.free.fr/files/public/gnome-shell-687110-Improve-the-button-insensitive-style/
(In reply to comment #4) > This is what it looks like in the various places (do not take care of the > password entry, this is not in this patch): > > http://zzrough.free.fr/files/public/gnome-shell-687110-Improve-the-button-insensitive-style/ Thanks for the screenshots, Stéphane, they're really helpful. I've discussed them with Jimmac, and there's a few changes we'd like to suggest. First, I think that the border needs to be 1px wide rather than 2px. Second, we probably need a subtle background: try the same color as the border, but at 10% opacity?
Created attachment 227573 [details] [review] Second try This also includes the rebalanced brightness of normal borders (brighter on cancel to match the mockup), the 1px border, the slight background opacity. Jimmac chose v3 (http://zzrough.free.fr/files/public/gnome-shell-687110-Improve-the-button-insensitive-style/button-in-login-dialog-3.jpg) so I've gone for this one. Note that Lapo preferred a more opaque one, but I find the text difficult to read. I also switched to shorthand notation to emphasis only the border width is changed on button focus/hover (except the login-dialog default button). This might be a separate enhancement, but at least this is clearly shown in the CSS.
Review of attachment 227573 [details] [review]: If this is what the designers chose, looks fine to commit.
(In reply to comment #7) > Review of attachment 227573 [details] [review]: > > If this is what the designers chose, looks fine to commit. I've tested this and it looks good. Just one question: it seems like this adds insensitive styles for a whole bunch of things, including dash-search-button, notification-button, and more - are we sure that these buttons have an insensitive state? If they do, the patch seems sane. Otherwise, it's unnecessary additions.
Created attachment 227630 [details] [review] Third try I deliberately added those for homogeneity (all buttons have rules for the normal, :hover, :selected/:focus :active/:pressed, but not for :insensitive). "notification-button" was already there, so I've removed the extra rules.
Comment on attachment 227630 [details] [review] Third try http://git.gnome.org/browse/gnome-shell/commit/?id=37d6a624b7b1e94a7f0e1bef3c21068cc4ac33b4
Pushed to master. Thanks for the great work, Stéphane!