AuroraMiddleware/gtk
1
0
Fork 1
mirror of https://gitlab.gnome.org/GNOME/gtk.git synced 2024-09-29 18:47:38 +00:00
Code Issues Projects Releases Wiki Activity

Adwaita: fix switch styling

Browse Source 
looks like switch stare are not passed to the slider anymore so
rewrite selectors accordingly.
This commit is contained in:
Lapo Calamandrei 2015-10-23 17:12:01 +02:00
parent 4959fe3267
commit 5b0a26f8a3
3 changed files with 104 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
gtk/theme/Adwaita/_common.scss
View File

@ -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 & {

80
gtk/theme/Adwaita/gtk-contained-dark.css
View File

@ -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 *

80
gtk/theme/Adwaita/gtk-contained.css
View File

@ -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; }