Improve the button insensitive style
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 make the button background almost transparent. We also make the text color the same as the border color, use a thinner border. This patch also simplifies some border rule overwrites to emphasis only the border width is changed on focus, and makes the button look closer to the mockups. https://bugzilla.gnome.org/show_bug.cgi?id=687110
This commit is contained in:
parent
0c807bddaf
commit
37d6a624b7
@ -310,7 +310,7 @@ StScrollBar StButton#vhandle:active {
|
|||||||
.notification-icon-button:focus,
|
.notification-icon-button:focus,
|
||||||
.hotplug-notification-item:focus,
|
.hotplug-notification-item:focus,
|
||||||
.modal-dialog-button:focus {
|
.modal-dialog-button:focus {
|
||||||
border: 2px solid #8b8b8b;
|
border-width: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dash-search-button:active,
|
.dash-search-button:active,
|
||||||
@ -325,9 +325,13 @@ StScrollBar StButton#vhandle:active {
|
|||||||
background-gradient-end: rgba(255, 255, 255, 0.2);
|
background-gradient-end: rgba(255, 255, 255, 0.2);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.notification-button:insensitive,
|
||||||
.notification-icon-button:insensitive,
|
.notification-icon-button:insensitive,
|
||||||
.notification-button:insensitive {
|
.modal-dialog-button:insensitive {
|
||||||
|
border-color: #666666;
|
||||||
color: #9f9f9f;
|
color: #9f9f9f;
|
||||||
|
background-gradient-direction: none;
|
||||||
|
background-color: rgba(102, 102, 102, 0.15);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Entries */
|
/* Entries */
|
||||||
@ -1632,10 +1636,6 @@ StScrollBar StButton#vhandle:active {
|
|||||||
padding: 4px 32px 5px;
|
padding: 4px 32px 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.modal-dialog-button:insensitive {
|
|
||||||
color: rgb(60, 60, 60);
|
|
||||||
}
|
|
||||||
|
|
||||||
.modal-dialog-button:focus {
|
.modal-dialog-button:focus {
|
||||||
padding: 3px 31px 4px;
|
padding: 3px 31px 4px;
|
||||||
}
|
}
|
||||||
@ -2184,24 +2184,20 @@ StScrollBar StButton#vhandle:active {
|
|||||||
height: .75em;
|
height: .75em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.login-dialog .modal-dialog-button {
|
.login-dialog .modal-dialog-button {
|
||||||
border: 1px solid #666666;
|
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
padding: 3px 18px;
|
padding: 3px 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.login-dialog .modal-dialog-button:focus {
|
.login-dialog .modal-dialog-button:focus {
|
||||||
padding: 2px 17px;
|
padding: 2px 17px;
|
||||||
border: 2px solid #8b8b8b;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.login-dialog .modal-dialog-button:default {
|
.login-dialog .modal-dialog-button:default {
|
||||||
background-gradient-start: #6793c4;
|
background-gradient-start: #6793c4;
|
||||||
background-gradient-end: #335d8f;
|
background-gradient-end: #335d8f;
|
||||||
background-gradient-direction: vertical;
|
background-gradient-direction: vertical;
|
||||||
padding: 2px 17px;
|
border-color: #16335d;
|
||||||
border: 2px solid #16335d;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.login-dialog .modal-dialog-button:default:focus {
|
.login-dialog .modal-dialog-button:default:focus {
|
||||||
@ -2219,6 +2215,13 @@ StScrollBar StButton#vhandle:active {
|
|||||||
background-gradient-end: #74a0d0;
|
background-gradient-end: #74a0d0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.login-dialog .modal-dialog-button:default:insensitive {
|
||||||
|
border-color: #666666;
|
||||||
|
color: #9f9f9f;
|
||||||
|
background-gradient-direction: none;
|
||||||
|
background-color: rgba(102, 102, 102, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
.login-dialog-message-warning {
|
.login-dialog-message-warning {
|
||||||
color: orange;
|
color: orange;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user