From 5b0a26f8a318814f2a702ceba72d4a16ddb49f98 Mon Sep 17 00:00:00 2001 From: Lapo Calamandrei Date: Fri, 23 Oct 2015 17:12:01 +0200 Subject: [PATCH] Adwaita: fix switch styling looks like switch stare are not passed to the slider anymore so rewrite selectors accordingly. --- gtk/theme/Adwaita/_common.scss | 43 +++++++------ gtk/theme/Adwaita/gtk-contained-dark.css | 80 ++++++++++++------------ gtk/theme/Adwaita/gtk-contained.css | 80 ++++++++++++------------ 3 files changed, 104 insertions(+), 99 deletions(-) diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss index d5ba620851..6a88c6be61 100644 --- a/gtk/theme/Adwaita/_common.scss +++ b/gtk/theme/Adwaita/_common.scss @@ -2006,7 +2006,9 @@ switch { background-image: none; background-color: $insensitive_bg_color; } - & slider { + // slider styling + // switch slider doesn't respond to its own states but relies on the switch ones + slider { border: 1px solid; border-radius: 3px; @include button(normal); @@ -2014,26 +2016,29 @@ switch { transparentize(white, 0.85)), inset 0 -2px transparentize($bg_color, 0.4), inset 0 -1px mix($bg_color, $borders_color, 50%); - &:hover { - @include button(hover); - box-shadow: inset 0 1px if($variant=='light', white, - transparentize(white, 0.85)), - inset 0 -2px transparentize($bg_color, 0.4), - inset 0 -1px mix($bg_color, $borders_color, 50%); - } - &:active { border: 1px solid $selected_borders_color; } - &:insensitive { @include button(insensitive, $edge:none); } - &:backdrop { + } + &:hover slider { + @include button(hover); + box-shadow: inset 0 1px if($variant=='light', white, + transparentize(white, 0.85)), + inset 0 -2px transparentize($bg_color, 0.4), + inset 0 -1px mix($bg_color, $borders_color, 50%); + } + &:active slider { border: 1px solid $selected_borders_color; } + + &:insensitive slider { @include button(insensitive, $edge:none); } + + &:backdrop { + slider { @include button(backdrop); box-shadow: none; - &:active{ - border-color: if($variant == 'light', $selected_bg_color, - $selected_borders_color); - } - &:insensitive { - @include button(backdrop-insensitive); - box-shadow: none; - } + } + + &:active slider { border-color: if($variant == 'light', $selected_bg_color, $selected_borders_color); } + + &:insensitive slider { + @include button(backdrop-insensitive); + box-shadow: none; } } .list-row:selected & { diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css index e550622085..fdfe5cadcc 100644 --- a/gtk/theme/Adwaita/gtk-contained-dark.css +++ b/gtk/theme/Adwaita/gtk-contained-dark.css @@ -2474,46 +2474,46 @@ switch { icon-shadow: 0 -1px rgba(0, 0, 0, 0.81176); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px rgba(238, 238, 236, 0.1); box-shadow: inset 0 1px rgba(255, 255, 255, 0.15), inset 0 -2px rgba(57, 63, 63, 0.6), inset 0 -1px #2b2f2f; } - switch slider:hover { - color: #eeeeec; - outline-color: rgba(238, 238, 236, 0.3); - border-color: #1c1f1f; - background-image: linear-gradient(to bottom, #5b6464, #434a4a 40%, #393f3f); - text-shadow: 0 -1px rgba(0, 0, 0, 0.77976); - icon-shadow: 0 -1px rgba(0, 0, 0, 0.77976); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px rgba(238, 238, 236, 0.1); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.15), inset 0 -2px rgba(57, 63, 63, 0.6), inset 0 -1px #2b2f2f; } - switch slider:active { - border: 1px solid #0f2b48; } - switch slider:insensitive { - color: #949796; - border-color: #1c1f1f; - background-image: linear-gradient(to bottom, #333636); - text-shadow: none; - icon-shadow: none; - box-shadow: inset 0 1px rgba(255, 255, 255, 0); } - switch slider:insensitive > .label { - color: inherit; } - switch slider:backdrop { - color: #949796; - border-color: #1f2222; - background-image: linear-gradient(to bottom, #393f3f); - text-shadow: none; - icon-shadow: none; - box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0); - box-shadow: none; } - switch slider:backdrop:active { - border-color: #0f2b48; } - switch slider:backdrop:insensitive { - color: #5d6767; - border-color: #1f2222; - background-image: linear-gradient(to bottom, #333636); - text-shadow: none; - icon-shadow: none; - box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0); - box-shadow: none; } - switch slider:backdrop:insensitive > .label { - color: inherit; } + switch:hover slider { + color: #eeeeec; + outline-color: rgba(238, 238, 236, 0.3); + border-color: #1c1f1f; + background-image: linear-gradient(to bottom, #5b6464, #434a4a 40%, #393f3f); + text-shadow: 0 -1px rgba(0, 0, 0, 0.77976); + icon-shadow: 0 -1px rgba(0, 0, 0, 0.77976); + box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px rgba(238, 238, 236, 0.1); + box-shadow: inset 0 1px rgba(255, 255, 255, 0.15), inset 0 -2px rgba(57, 63, 63, 0.6), inset 0 -1px #2b2f2f; } + switch:active slider { + border: 1px solid #0f2b48; } + switch:insensitive slider { + color: #949796; + border-color: #1c1f1f; + background-image: linear-gradient(to bottom, #333636); + text-shadow: none; + icon-shadow: none; + box-shadow: inset 0 1px rgba(255, 255, 255, 0); } + switch:insensitive slider > .label { + color: inherit; } + switch:backdrop slider { + color: #949796; + border-color: #1f2222; + background-image: linear-gradient(to bottom, #393f3f); + text-shadow: none; + icon-shadow: none; + box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0); + box-shadow: none; } + switch:backdrop:active slider { + border-color: #0f2b48; } + switch:backdrop:insensitive slider { + color: #5d6767; + border-color: #1f2222; + background-image: linear-gradient(to bottom, #333636); + text-shadow: none; + icon-shadow: none; + box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0); + box-shadow: none; } + switch:backdrop:insensitive slider > .label { + color: inherit; } /************************* * Check and Radio items * diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css index edd406de5c..31ada6abae 100644 --- a/gtk/theme/Adwaita/gtk-contained.css +++ b/gtk/theme/Adwaita/gtk-contained.css @@ -2481,46 +2481,46 @@ switch { icon-shadow: 0 1px rgba(255, 255, 255, 0.76923); box-shadow: inset 0 1px white, 0 1px white; box-shadow: inset 0 1px white, inset 0 -2px rgba(237, 237, 237, 0.6), inset 0 -1px #c7c7c7; } - switch slider:hover { - color: #2e3436; - outline-color: rgba(46, 52, 54, 0.3); - border-color: #a1a1a1; - background-image: linear-gradient(to bottom, white, #f7f7f7 40%, #ededed); - text-shadow: 0 1px rgba(255, 255, 255, 0.76923); - icon-shadow: 0 1px rgba(255, 255, 255, 0.76923); - box-shadow: inset 0 1px white, 0 1px white; - box-shadow: inset 0 1px white, inset 0 -2px rgba(237, 237, 237, 0.6), inset 0 -1px #c7c7c7; } - switch slider:active { - border: 1px solid #184472; } - switch slider:insensitive { - color: #8e9192; - border-color: #a1a1a1; - background-image: linear-gradient(to bottom, #f4f4f4); - text-shadow: none; - icon-shadow: none; - box-shadow: inset 0 1px rgba(255, 255, 255, 0); } - switch slider:insensitive > .label { - color: inherit; } - switch slider:backdrop { - color: #8e9192; - border-color: darkgray; - background-image: linear-gradient(to bottom, #ededed); - text-shadow: none; - icon-shadow: none; - box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); - box-shadow: none; } - switch slider:backdrop:active { - border-color: #4a90d9; } - switch slider:backdrop:insensitive { - color: #c7c7c7; - border-color: darkgray; - background-image: linear-gradient(to bottom, #f4f4f4); - text-shadow: none; - icon-shadow: none; - box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); - box-shadow: none; } - switch slider:backdrop:insensitive > .label { - color: inherit; } + switch:hover slider { + color: #2e3436; + outline-color: rgba(46, 52, 54, 0.3); + border-color: #a1a1a1; + background-image: linear-gradient(to bottom, white, #f7f7f7 40%, #ededed); + text-shadow: 0 1px rgba(255, 255, 255, 0.76923); + icon-shadow: 0 1px rgba(255, 255, 255, 0.76923); + box-shadow: inset 0 1px white, 0 1px white; + box-shadow: inset 0 1px white, inset 0 -2px rgba(237, 237, 237, 0.6), inset 0 -1px #c7c7c7; } + switch:active slider { + border: 1px solid #184472; } + switch:insensitive slider { + color: #8e9192; + border-color: #a1a1a1; + background-image: linear-gradient(to bottom, #f4f4f4); + text-shadow: none; + icon-shadow: none; + box-shadow: inset 0 1px rgba(255, 255, 255, 0); } + switch:insensitive slider > .label { + color: inherit; } + switch:backdrop slider { + color: #8e9192; + border-color: darkgray; + background-image: linear-gradient(to bottom, #ededed); + text-shadow: none; + icon-shadow: none; + box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); + box-shadow: none; } + switch:backdrop:active slider { + border-color: #4a90d9; } + switch:backdrop:insensitive slider { + color: #c7c7c7; + border-color: darkgray; + background-image: linear-gradient(to bottom, #f4f4f4); + text-shadow: none; + icon-shadow: none; + box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); + box-shadow: none; } + switch:backdrop:insensitive slider > .label { + color: inherit; } .list-row:selected switch { box-shadow: none; border-color: #184472; }