forked from AuroraMiddleware/gtk
HighContrast: fix insensitive and backdrop states
- checkboxes, labels, menus/modelbuttons and buttons were a mixed bag for :insensitive and :backdrop https://bugzilla.gnome.org/show_bug.cgi?id=746188
This commit is contained in:
parent
139ed7409f
commit
0a39d7d91e
@ -33,7 +33,6 @@ $insensitive_borders_color: $borders_color;
|
||||
$backdrop_base_color: $base_color;
|
||||
$backdrop_bg_color: $bg_color;
|
||||
$backdrop_fg_color: $fg_color;
|
||||
$backdrop_insensitive_color: $insensitive_fg_color;
|
||||
$backdrop_borders_color: mix($borders_color, $bg_color, 90%);
|
||||
|
||||
//apps rely on some named colors to be exported
|
||||
|
@ -143,7 +143,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
GtkLabel {
|
||||
GtkLabel { //not sure why not .label
|
||||
&:selected,
|
||||
&:selected:focus,
|
||||
&:selected:hover,
|
||||
@ -152,6 +152,13 @@ GtkLabel {
|
||||
}
|
||||
}
|
||||
|
||||
.label {
|
||||
&:insensitive, &:backdrop:insensitive {
|
||||
color: $insensitive_fg_color;
|
||||
background-color: $insensitive_bg_color;
|
||||
}
|
||||
}
|
||||
|
||||
/*********************
|
||||
* Spinner Animation *
|
||||
*********************/
|
||||
@ -576,11 +583,13 @@ $_dot_color: $selected_bg_color;
|
||||
.menuitem.button.flat {
|
||||
@extend %undecorated_button;
|
||||
outline-offset: -1px;
|
||||
&:hover { background-color: mix($fg_color,$bg_color,10%); }
|
||||
&:selected { @extend %selected_items; }
|
||||
&:backdrop, &:backdrop:hover {
|
||||
&:hover, &:selected { @extend %selected_items; }
|
||||
&:backdrop {
|
||||
color: $backdrop_fg_color;
|
||||
@extend %undecorated_button;
|
||||
&:hover { color: $selected_fg_color; background-color: selected_bg_color; }
|
||||
}
|
||||
&:insensitive { color: $insensitive_fg_color; }
|
||||
}
|
||||
|
||||
GtkColorButton.button { padding: 4px; } // Uniform padding on the
|
||||
@ -648,7 +657,7 @@ GtkColorButton.button { padding: 4px; } // Uniform padding on the
|
||||
}
|
||||
&:backdrop:insensitive {
|
||||
background-image: none;
|
||||
color: transparentize($backdrop_insensitive_color,0.7);
|
||||
color: transparentize($insensitive_fg_color,0.7);
|
||||
border-width: 0 0 0 1px; // It is needed or it gets overridden
|
||||
&:dir(rtl) { border-width: 0 1px 0 0; }
|
||||
}
|
||||
@ -753,7 +762,7 @@ GtkComboBox {
|
||||
icon-shadow: none;
|
||||
}
|
||||
&:backdrop:insensitive {
|
||||
color: $backdrop_insensitive_color;
|
||||
color: $insensitive_fg_color;
|
||||
}
|
||||
.menuitem { text-shadow: none; }
|
||||
.separator.vertical {
|
||||
@ -1034,7 +1043,7 @@ GtkTreeView.view.progressbar { //Progressbar in treeview cells
|
||||
}
|
||||
&:insensitive {
|
||||
color: $insensitive_fg_color;
|
||||
&:backdrop { color: $backdrop_insensitive_color; }
|
||||
&:backdrop { color: $insensitive_fg_color; }
|
||||
}
|
||||
&:backdrop, &:backdrop:hover {
|
||||
color: $backdrop_fg_color;
|
||||
@ -1306,7 +1315,7 @@ GtkTreeView.view.progressbar { //Progressbar in treeview cells
|
||||
font-weight: bold;
|
||||
color: $insensitive_fg_color; /* color: inherit doesn't work here */
|
||||
&:backdrop, &.prelight-page:backdrop {
|
||||
color: mix($backdrop_fg_color, $backdrop_insensitive_color, 50%);
|
||||
color: $insensitive_fg_color;
|
||||
}
|
||||
}
|
||||
&.prelight-page GtkLabel, GtkLabel.prelight-page {
|
||||
@ -1444,8 +1453,8 @@ GtkSwitch {
|
||||
}
|
||||
&:insensitive, &:insensitive:active {
|
||||
background-color: $insensitive_bg_color;
|
||||
color: $backdrop_insensitive_color;
|
||||
border-color: $backdrop_insensitive_color;
|
||||
color: $insensitive_fg_color;
|
||||
border-color: $insensitive_fg_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1487,30 +1496,30 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
|
||||
@each $w,$a in ('check', 'checkbox'),
|
||||
('radio','radio') {
|
||||
.#{$w} {
|
||||
color: transparentize($fg_color,0.9);
|
||||
color: $fg_color;
|
||||
background-image: none;
|
||||
-gtk-icon-source: -gtk-icontheme('#{$a}-symbolic');
|
||||
&:hover { color: $borders_color; }
|
||||
&:hover { color: mix($fg_color, $bg_color, 80%) }
|
||||
&:checked, &:active {
|
||||
-gtk-icon-source: -gtk-icontheme('#{$a}-checked-symbolic');
|
||||
color: $fg_color;
|
||||
&:hover { color: $borders_color; }
|
||||
&:hover { color: mix($fg_color, $bg_color, 80%); }
|
||||
&:insensitive {
|
||||
color: $insensitive_fg_color;
|
||||
&:backdrop { color: $backdrop_insensitive_color; }
|
||||
&:backdrop { color: $insensitive_fg_color; }
|
||||
}
|
||||
&:backdrop { color: $backdrop_fg_color; }
|
||||
}
|
||||
&:insensitive {
|
||||
color: transparentize($insensitive_fg_color,0.9);
|
||||
&:backdrop { color: transparent; }
|
||||
color: $insensitive_fg_color;
|
||||
&:backdrop { color: $insensitive_fg_color; }
|
||||
}
|
||||
&:inconsistent {
|
||||
-gtk-icon-source: -gtk-icontheme('#{$a}-mixed-symbolic');
|
||||
}
|
||||
&:backdrop {
|
||||
color: transparentize($backdrop_fg_color,0.9);
|
||||
&:selected { color: transparentize($backdrop_base_color,0.9); }
|
||||
color: $backdrop_fg_color;
|
||||
&:selected { color: $backdrop_fg_color; }
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1590,7 +1599,7 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
|
||||
box-shadow: none;
|
||||
}
|
||||
&:backdrop:insensitive, .hilight:backdrop:insensitive {
|
||||
border-color: $backdrop_insensitive_color;
|
||||
border-color: $insensitive_fg_color;
|
||||
background-color: $backdrop_bg_color;
|
||||
}
|
||||
}
|
||||
@ -1626,7 +1635,7 @@ GtkProgressBar {
|
||||
font-size: 83%;
|
||||
color: transparentize($fg_color, 0.6);
|
||||
&:backdrop {
|
||||
color: $backdrop_insensitive_color;
|
||||
color: $insensitive_fg_color;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1743,7 +1752,7 @@ GtkLevelBar.vertical {
|
||||
background-color: $selected_bg_color;
|
||||
color: $selected_fg_color;
|
||||
outline-color: transparentize($selected_fg_color, 0.7);
|
||||
&:backdrop { color: $backdrop_base_color; }
|
||||
&:backdrop { background-color: $borders_color; color: $selected_fg_color; }
|
||||
}
|
||||
|
||||
/**********
|
||||
|
@ -69,7 +69,7 @@
|
||||
box-shadow: 0 1px transparentize(white,1);
|
||||
}
|
||||
@if $t==backdrop-insensitive {
|
||||
color: $backdrop_insensitive_color;
|
||||
color: $insensitive_fg_color;
|
||||
background-image: linear-gradient(to bottom, $backdrop_bg_color);
|
||||
box-shadow: 0 1px transparentize(white,1);
|
||||
}
|
||||
@ -191,8 +191,8 @@
|
||||
//
|
||||
// backdrop pushed button
|
||||
//
|
||||
color: $backdrop_fg_color;
|
||||
background-color: $backdrop_bg_color;
|
||||
color: invert($backdrop_fg_color);
|
||||
background-color: $backdrop_borders_color;
|
||||
border-color: $backdrop_borders_color;
|
||||
background-image: none;
|
||||
}
|
||||
@ -201,7 +201,7 @@
|
||||
//
|
||||
// backdrop insensitive button
|
||||
//
|
||||
color: $backdrop_insensitive_color;
|
||||
color: $insensitive_fg_color;
|
||||
background-color: $insensitive_bg_color;
|
||||
border-color: $backdrop_borders_color;
|
||||
background-image: none;
|
||||
@ -211,7 +211,7 @@
|
||||
//
|
||||
// backdrop insensitive pushed button
|
||||
//
|
||||
color: $backdrop_insensitive_color;
|
||||
color: $insensitive_fg_color;
|
||||
border-color: $backdrop_borders_color;
|
||||
background-image: none;
|
||||
background-color: mix($backdrop_borders_color,$backdrop_bg_color, 8%);
|
||||
|
@ -174,6 +174,10 @@
|
||||
border: none;
|
||||
box-shadow: none; }
|
||||
|
||||
.label:insensitive, .label:backdrop:insensitive {
|
||||
color: #7f7f7f;
|
||||
background-color: white; }
|
||||
|
||||
/*********************
|
||||
* Spinner Animation *
|
||||
*********************/
|
||||
@ -465,8 +469,8 @@
|
||||
.button:backdrop:active, .button:backdrop:checked, .button.flat:backdrop:active, .button.flat:backdrop:checked {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
color: white;
|
||||
background-color: #8b8b8b;
|
||||
border-color: #8b8b8b;
|
||||
background-image: none; }
|
||||
.button:backdrop:insensitive, .button.flat:backdrop:insensitive {
|
||||
@ -682,8 +686,8 @@
|
||||
.inline-toolbar GtkToolButton > .button:backdrop:active {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
color: white;
|
||||
background-color: #8b8b8b;
|
||||
border-color: #8b8b8b;
|
||||
background-image: none; }
|
||||
.inline-toolbar GtkToolButton > .button:backdrop:insensitive {
|
||||
@ -763,7 +767,7 @@
|
||||
border-radius: 3px;
|
||||
border-style: solid; }
|
||||
|
||||
.button.flat, .button.flat:backdrop, .button.flat:insensitive:backdrop, .menuitem.button.flat, .menuitem.button.flat:backdrop, .menuitem.button.flat:backdrop:hover, .button:link, .button:visited, .button:link:hover, .button:link:active, .button:visited:hover, .button:visited:active, .button:link:backdrop, .button:visited:backdrop, .notebook tab .button, .list-row.button, .list-row.button:backdrop:hover, GtkCalendar.button, GtkCalendar.button:hover, GtkCalendar.button:backdrop, GtkCalendar.button:backdrop:hover {
|
||||
.button.flat, .button.flat:backdrop, .button.flat:insensitive:backdrop, .menuitem.button.flat, .menuitem.button.flat:backdrop, .button:link, .button:visited, .button:link:hover, .button:link:active, .button:visited:hover, .button:visited:active, .button:link:backdrop, .button:visited:backdrop, .notebook tab .button, .list-row.button, .list-row.button:backdrop:hover, GtkCalendar.button, GtkCalendar.button:hover, GtkCalendar.button:backdrop, GtkCalendar.button:backdrop:hover {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
@ -774,8 +778,13 @@
|
||||
/* menu buttons */
|
||||
.menuitem.button.flat {
|
||||
outline-offset: -1px; }
|
||||
.menuitem.button.flat:hover {
|
||||
background-color: #e5e5e5; }
|
||||
.menuitem.button.flat:backdrop {
|
||||
color: #000; }
|
||||
.menuitem.button.flat:backdrop:hover {
|
||||
color: #fff;
|
||||
background-color: selected_bg_color; }
|
||||
.menuitem.button.flat:insensitive {
|
||||
color: #7f7f7f; }
|
||||
|
||||
GtkColorButton.button {
|
||||
padding: 4px; }
|
||||
@ -1523,7 +1532,7 @@ GtkTreeView.view.progressbar {
|
||||
color: #7f7f7f;
|
||||
/* color: inherit doesn't work here */ }
|
||||
.notebook tab GtkLabel:backdrop, .notebook tab GtkLabel.prelight-page:backdrop {
|
||||
color: #3f3f3f; }
|
||||
color: #7f7f7f; }
|
||||
.notebook tab.prelight-page GtkLabel, .notebook tab GtkLabel.prelight-page {
|
||||
color: #3f3f3f; }
|
||||
.notebook tab.active-page GtkLabel, .notebook tab GtkLabel.active-page {
|
||||
@ -1694,16 +1703,16 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
|
||||
outline-offset: 0; }
|
||||
|
||||
.check {
|
||||
color: rgba(0, 0, 0, 0.1);
|
||||
color: #000;
|
||||
background-image: none;
|
||||
-gtk-icon-source: -gtk-icontheme("checkbox-symbolic"); }
|
||||
.check:hover {
|
||||
color: #7f7f7f; }
|
||||
color: #323232; }
|
||||
.check:checked, .check:active {
|
||||
-gtk-icon-source: -gtk-icontheme("checkbox-checked-symbolic");
|
||||
color: #000; }
|
||||
.check:checked:hover, .check:active:hover {
|
||||
color: #7f7f7f; }
|
||||
color: #323232; }
|
||||
.check:checked:insensitive, .check:active:insensitive {
|
||||
color: #7f7f7f; }
|
||||
.check:checked:insensitive:backdrop, .check:active:insensitive:backdrop {
|
||||
@ -1711,27 +1720,27 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
|
||||
.check:checked:backdrop, .check:active:backdrop {
|
||||
color: #000; }
|
||||
.check:insensitive {
|
||||
color: rgba(127, 127, 127, 0.1); }
|
||||
color: #7f7f7f; }
|
||||
.check:insensitive:backdrop {
|
||||
color: transparent; }
|
||||
color: #7f7f7f; }
|
||||
.check:inconsistent {
|
||||
-gtk-icon-source: -gtk-icontheme("checkbox-mixed-symbolic"); }
|
||||
.check:backdrop {
|
||||
color: rgba(0, 0, 0, 0.1); }
|
||||
color: #000; }
|
||||
.check:backdrop:selected {
|
||||
color: rgba(255, 255, 255, 0.1); }
|
||||
color: #000; }
|
||||
|
||||
.radio {
|
||||
color: rgba(0, 0, 0, 0.1);
|
||||
color: #000;
|
||||
background-image: none;
|
||||
-gtk-icon-source: -gtk-icontheme("radio-symbolic"); }
|
||||
.radio:hover {
|
||||
color: #7f7f7f; }
|
||||
color: #323232; }
|
||||
.radio:checked, .radio:active {
|
||||
-gtk-icon-source: -gtk-icontheme("radio-checked-symbolic");
|
||||
color: #000; }
|
||||
.radio:checked:hover, .radio:active:hover {
|
||||
color: #7f7f7f; }
|
||||
color: #323232; }
|
||||
.radio:checked:insensitive, .radio:active:insensitive {
|
||||
color: #7f7f7f; }
|
||||
.radio:checked:insensitive:backdrop, .radio:active:insensitive:backdrop {
|
||||
@ -1739,15 +1748,15 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
|
||||
.radio:checked:backdrop, .radio:active:backdrop {
|
||||
color: #000; }
|
||||
.radio:insensitive {
|
||||
color: rgba(127, 127, 127, 0.1); }
|
||||
color: #7f7f7f; }
|
||||
.radio:insensitive:backdrop {
|
||||
color: transparent; }
|
||||
color: #7f7f7f; }
|
||||
.radio:inconsistent {
|
||||
-gtk-icon-source: -gtk-icontheme("radio-mixed-symbolic"); }
|
||||
.radio:backdrop {
|
||||
color: rgba(0, 0, 0, 0.1); }
|
||||
color: #000; }
|
||||
.radio:backdrop:selected {
|
||||
color: rgba(255, 255, 255, 0.1); }
|
||||
color: #000; }
|
||||
|
||||
/************
|
||||
* GtkScale *
|
||||
@ -1967,11 +1976,12 @@ GtkLevelBar.vertical {
|
||||
.level-bar.fill-block.empty-fill-block:backdrop {
|
||||
border-color: rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.view:selected, GtkCalendar:selected, .view:selected:focus, GtkCalendar:focus:selected, .view:selected:hover, GtkCalendar:hover:selected, GtkLabel:selected, GtkLabel:selected:focus, GtkLabel:selected:hover, GtkLabel:backdrop:selected, .entry:selected, .entry:selected:focus, .menuitem.button.flat:selected, .sidebar:selected, GtkPlacesSidebar.sidebar .view:selected, GtkPlacesSidebar.sidebar GtkCalendar:selected {
|
||||
.view:selected, GtkCalendar:selected, .view:selected:focus, GtkCalendar:focus:selected, .view:selected:hover, GtkCalendar:hover:selected, GtkLabel:selected, GtkLabel:selected:focus, GtkLabel:selected:hover, GtkLabel:backdrop:selected, .entry:selected, .entry:selected:focus, .menuitem.button.flat:hover, .menuitem.button.flat:selected, .sidebar:selected, GtkPlacesSidebar.sidebar .view:selected, GtkPlacesSidebar.sidebar GtkCalendar:selected {
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
outline-color: rgba(255, 255, 255, 0.3); }
|
||||
.view:backdrop:selected, GtkCalendar:backdrop:selected, GtkCalendar:backdrop:focus:selected, GtkCalendar:backdrop:hover:selected, GtkLabel:backdrop:selected, .entry:backdrop:selected, .menuitem.button.flat:backdrop:selected, .sidebar:backdrop:selected, GtkPlacesSidebar.sidebar .view:backdrop:selected, GtkPlacesSidebar.sidebar GtkCalendar:backdrop:selected {
|
||||
.view:backdrop:selected, GtkCalendar:backdrop:selected, GtkCalendar:backdrop:focus:selected, GtkCalendar:backdrop:hover:selected, GtkLabel:backdrop:selected, .entry:backdrop:selected, .menuitem.button.flat:backdrop:hover, .menuitem.button.flat:backdrop:selected, .sidebar:backdrop:selected, GtkPlacesSidebar.sidebar .view:backdrop:selected, GtkPlacesSidebar.sidebar GtkCalendar:backdrop:selected {
|
||||
background-color: #7f7f7f;
|
||||
color: #fff; }
|
||||
|
||||
/**********
|
||||
|
Loading…
Reference in New Issue
Block a user