diff --git a/gtk/theme/HighContrast/_colors.scss b/gtk/theme/HighContrast/_colors.scss index 2a28ba2a19..17aec9e76d 100644 --- a/gtk/theme/HighContrast/_colors.scss +++ b/gtk/theme/HighContrast/_colors.scss @@ -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 diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss index 6774f02900..77985e3d15 100644 --- a/gtk/theme/HighContrast/_common.scss +++ b/gtk/theme/HighContrast/_common.scss @@ -150,9 +150,9 @@ &:backdrop:selected { @extend %selected_items; } - &:insensitive { - color: $insensitive_fg_color; - } + &:insensitive, &:backdrop:insensitive { + color: $insensitive_fg_color; + } } /********************* @@ -579,11 +579,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 @@ -651,7 +653,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; } } @@ -756,7 +758,7 @@ GtkComboBox { icon-shadow: none; } &:backdrop:insensitive { - color: $backdrop_insensitive_color; + color: $insensitive_fg_color; } .menuitem { text-shadow: none; } .separator.vertical { @@ -1037,7 +1039,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; @@ -1309,7 +1311,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 { @@ -1447,8 +1449,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; } } } @@ -1490,30 +1492,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; } } } } @@ -1593,7 +1595,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; } } @@ -1629,7 +1631,7 @@ GtkProgressBar { font-size: 83%; color: transparentize($fg_color, 0.6); &:backdrop { - color: $backdrop_insensitive_color; + color: $insensitive_fg_color; } } @@ -1746,7 +1748,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; } } /********** diff --git a/gtk/theme/HighContrast/_drawing.scss b/gtk/theme/HighContrast/_drawing.scss index a14a5291fd..330cb2e67c 100644 --- a/gtk/theme/HighContrast/_drawing.scss +++ b/gtk/theme/HighContrast/_drawing.scss @@ -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%); diff --git a/gtk/theme/HighContrast/gtk.css b/gtk/theme/HighContrast/gtk.css index 0a9aa0a1c5..a4653f7a8f 100644 --- a/gtk/theme/HighContrast/gtk.css +++ b/gtk/theme/HighContrast/gtk.css @@ -174,8 +174,9 @@ border: none; box-shadow: none; } -.label:insensitive { - color: #7f7f7f; } +.label:insensitive, .label:backdrop:insensitive { + color: #7f7f7f; + background-color: white; } /********************* * Spinner Animation * @@ -468,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 { @@ -685,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 { @@ -766,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; @@ -777,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; } @@ -1526,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 { @@ -1697,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 { @@ -1714,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 { @@ -1742,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 * @@ -1970,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, .label:selected, .label:selected:focus, .label:selected:hover, .label: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, .label:selected, .label:selected:focus, .label:selected:hover, .label: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, .label: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, .label: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; } /**********