GTK3: Fix border-color for the slider of the switch when it's disabled

This commit is contained in:
Daniel Ruiz de Alegría 2020-09-27 11:30:59 +02:00
parent 39e806aa3f
commit d985e50e2b
4 changed files with 64 additions and 58 deletions

View File

@ -5119,6 +5119,14 @@ scale slider:active, switch:hover slider {
**********/
switch {
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.6); }
switch:checked {
border-color: rgba(0, 0, 0, 0.2);
border-right-width: 0;
margin-right: 1px;
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.6); }
switch:backdrop, switch:disabled {
box-shadow: none;
border-color: #111217; }
switch slider {
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.3);
@ -5130,21 +5138,14 @@ switch {
border: 1px solid black;
border-radius: 50%;
transition-property: background, border, box-shadow; }
switch slider:checked {
border-color: black; }
switch slider:checked:backdrop:not(:disabled) {
border-color: #111217; }
switch slider:disabled {
border-color: #111217; }
switch:hover slider {
border-color: #2777ff; }
switch:checked {
border-color: rgba(0, 0, 0, 0.2);
border-right-width: 0;
margin-right: 1px;
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.6); }
switch:checked slider {
border-color: black; }
switch:backdrop, switch:disabled {
box-shadow: none; }
switch:backdrop slider, switch:disabled slider {
border-color: #111217; }
switch:backdrop:checked slider, switch:disabled:checked slider {
border-color: #111217; }
/*************************
* Check and Radio items *

View File

@ -5119,6 +5119,14 @@ scale slider:active, switch:hover slider {
**********/
switch {
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.6); }
switch:checked {
border-color: rgba(0, 0, 0, 0.2);
border-right-width: 0;
margin-right: 1px;
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.6); }
switch:backdrop, switch:disabled {
box-shadow: none;
border-color: #111217; }
switch slider {
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.3);
@ -5130,21 +5138,14 @@ switch {
border: 1px solid black;
border-radius: 50%;
transition-property: background, border, box-shadow; }
switch slider:checked {
border-color: black; }
switch slider:checked:backdrop:not(:disabled) {
border-color: #111217; }
switch slider:disabled {
border-color: #111217; }
switch:hover slider {
border-color: #2777ff; }
switch:checked {
border-color: rgba(0, 0, 0, 0.2);
border-right-width: 0;
margin-right: 1px;
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.6); }
switch:checked slider {
border-color: black; }
switch:backdrop, switch:disabled {
box-shadow: none; }
switch:backdrop slider, switch:disabled slider {
border-color: #111217; }
switch:backdrop:checked slider, switch:disabled:checked slider {
border-color: #111217; }
/*************************
* Check and Radio items *

View File

@ -5140,6 +5140,14 @@ scale slider:active, switch:hover slider {
**********/
switch {
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.2); }
switch:checked {
border-color: rgba(0, 0, 0, 0.2);
border-right-width: 0;
margin-right: 1px;
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.6); }
switch:backdrop, switch:disabled {
box-shadow: none;
border-color: #e0e0e0; }
switch slider {
color: #5c616c;
outline-color: rgba(92, 97, 108, 0.3);
@ -5151,21 +5159,14 @@ switch {
border: 1px solid #bababa;
border-radius: 50%;
transition-property: background, border, box-shadow; }
switch slider:checked {
border-color: #0051da; }
switch slider:checked:backdrop:not(:disabled) {
border-color: #2777ff; }
switch slider:disabled {
border-color: #e0e0e0; }
switch:hover slider {
border-color: #2777ff; }
switch:checked {
border-color: rgba(0, 0, 0, 0.2);
border-right-width: 0;
margin-right: 1px;
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.6); }
switch:checked slider {
border-color: #0051da; }
switch:backdrop, switch:disabled {
box-shadow: none; }
switch:backdrop slider, switch:disabled slider {
border-color: #e0e0e0; }
switch:backdrop:checked slider, switch:disabled:checked slider {
border-color: #2777ff; }
/*************************
* Check and Radio items *

View File

@ -57,37 +57,40 @@ switch {
box-shadow: inset 0 1px 2px -1px transparentize(black, if($variant=='light', .8, .4));
slider {
@include button(normal-alt, $edge: $shadow_color);
border: 1px solid $_slider_border_color;
border-radius: 50%;
transition-property: background, border, box-shadow;
}
&:hover slider {
@extend %slider_active;
border-color: $suggested_bg_color;
}
&:checked {
border-color: transparentize(black, .8);
border-right-width: 0; // Hack to prevent dirty right border-radius
margin-right: 1px; // Compensate missing right border
box-shadow: inset 0 1px 2px -1px transparentize(black, .4);
slider {
border-color: if($variant=='light', $suggested_border_color, $_slider_border_color);
}
}
&:backdrop, &:disabled {
box-shadow: none;
border-color: $backdrop_borders_color;
}
slider { border-color: $backdrop_borders_color; }
slider {
@include button(normal-alt, $edge: $shadow_color);
&:checked slider {
border-color: if($variant=='light', $suggested_bg_color, $backdrop_borders_color);
border: 1px solid $_slider_border_color;
border-radius: 50%;
transition-property: background, border, box-shadow;
&:checked {
border-color: if($variant=='light', $suggested_border_color, $_slider_border_color);
&:backdrop:not(:disabled) {
border-color: if($variant=='light', $suggested_bg_color, $backdrop_borders_color);
}
}
&:disabled {
border-color: $backdrop_borders_color;
}
}
&:hover slider {
@extend %slider_active;
border-color: $suggested_bg_color;
}
}