PoliEcho/kaliish-orange-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

GTK3: add inset shadow to switches

Browse Source
This commit is contained in:
Daniel Ruiz de Alegría 2020-03-06 12:04:45 +01:00
parent 87f2b7e506
commit c9aff30718
5 changed files with 97 additions and 127 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
share/themes/Kali-Dark/gtk-3.0/gtk.css
View File

@ -3333,24 +3333,6 @@ radio {
menu menuitem check, menu menuitem
radio {
margin: 0; }
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem check:checked, menu menuitem check:checked:hover, menu menuitem check:checked:disabled, menu menuitem check:indeterminate, menu menuitem check:indeterminate:hover, menu menuitem check:indeterminate:disabled, menu menuitem
radio, menu menuitem
radio:hover, menu menuitem
radio:disabled, menu menuitem
radio:checked, menu menuitem
radio:checked:hover, menu menuitem
radio:checked:disabled, menu menuitem
radio:indeterminate, menu menuitem
radio:indeterminate:hover, menu menuitem
radio:indeterminate:disabled {
min-height: 14px;
min-width: 14px;
background-image: none;
background-color: transparent;
box-shadow: none;
-gtk-icon-shadow: none;
color: inherit;
border-color: currentColor; }
check {
@ -5082,29 +5064,34 @@ switch:hover slider, scale slider:active {
/**********
* Switch *
**********/
switch slider {
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.3);
border-color: black;
text-shadow: 0 -1px rgba(0, 0, 0, 0.873255);
-gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.873255);
background-image: linear-gradient(to bottom, #1c1e25 20%, #16171d 90%);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.02), 0 1px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.27);
border: 1px solid black;
border-radius: 50%;
transition-property: background, border, box-shadow; }
switch:hover slider {
border-color: #2777ff; }
switch:checked slider {
border-color: black; }
switch:backdrop slider {
border-color: #111217; }
switch:backdrop:checked slider {
border-color: #111217; }
switch {
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.6); }
switch slider {
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.3);
border-color: black;
text-shadow: 0 -1px rgba(0, 0, 0, 0.873255);
-gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.873255);
background-image: linear-gradient(to bottom, #1c1e25 20%, #16171d 90%);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.02), 0 1px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.27);
border: 1px solid black;
border-radius: 50%;
transition-property: background, border, box-shadow; }
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 *

69
share/themes/Kali-Light/gtk-3.0/gtk-dark.css
View File

@ -3333,24 +3333,6 @@ radio {
menu menuitem check, menu menuitem
radio {
margin: 0; }
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem check:checked, menu menuitem check:checked:hover, menu menuitem check:checked:disabled, menu menuitem check:indeterminate, menu menuitem check:indeterminate:hover, menu menuitem check:indeterminate:disabled, menu menuitem
radio, menu menuitem
radio:hover, menu menuitem
radio:disabled, menu menuitem
radio:checked, menu menuitem
radio:checked:hover, menu menuitem
radio:checked:disabled, menu menuitem
radio:indeterminate, menu menuitem
radio:indeterminate:hover, menu menuitem
radio:indeterminate:disabled {
min-height: 14px;
min-width: 14px;
background-image: none;
background-color: transparent;
box-shadow: none;
-gtk-icon-shadow: none;
color: inherit;
border-color: currentColor; }
check {
@ -5082,29 +5064,34 @@ switch:hover slider, scale slider:active {
/**********
* Switch *
**********/
switch slider {
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.3);
border-color: black;
text-shadow: 0 -1px rgba(0, 0, 0, 0.873255);
-gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.873255);
background-image: linear-gradient(to bottom, #1c1e25 20%, #16171d 90%);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.02), 0 1px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.27);
border: 1px solid black;
border-radius: 50%;
transition-property: background, border, box-shadow; }
switch:hover slider {
border-color: #2777ff; }
switch:checked slider {
border-color: black; }
switch:backdrop slider {
border-color: #111217; }
switch:backdrop:checked slider {
border-color: #111217; }
switch {
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.6); }
switch slider {
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.3);
border-color: black;
text-shadow: 0 -1px rgba(0, 0, 0, 0.873255);
-gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.873255);
background-image: linear-gradient(to bottom, #1c1e25 20%, #16171d 90%);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.02), 0 1px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.27);
border: 1px solid black;
border-radius: 50%;
transition-property: background, border, box-shadow; }
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 *

69
share/themes/Kali-Light/gtk-3.0/gtk.css
View File

@ -3356,24 +3356,6 @@ radio {
menu menuitem check, menu menuitem
radio {
margin: 0; }
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem check:checked, menu menuitem check:checked:hover, menu menuitem check:checked:disabled, menu menuitem check:indeterminate, menu menuitem check:indeterminate:hover, menu menuitem check:indeterminate:disabled, menu menuitem
radio, menu menuitem
radio:hover, menu menuitem
radio:disabled, menu menuitem
radio:checked, menu menuitem
radio:checked:hover, menu menuitem
radio:checked:disabled, menu menuitem
radio:indeterminate, menu menuitem
radio:indeterminate:hover, menu menuitem
radio:indeterminate:disabled {
min-height: 14px;
min-width: 14px;
background-image: none;
background-color: transparent;
box-shadow: none;
-gtk-icon-shadow: none;
color: inherit;
border-color: currentColor; }
check {
@ -5106,29 +5088,34 @@ switch:hover slider, scale slider:active {
/**********
* Switch *
**********/
switch slider {
color: #5c616c;
outline-color: rgba(92, 97, 108, 0.3);
border-color: #c2c2c2;
text-shadow: 0 1px rgba(255, 255, 255, 0.769231);
-gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.769231);
background-image: linear-gradient(to bottom, white 20%, #ffffff 90%);
box-shadow: inset 0 1px white, 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.07);
border: 1px solid #bababa;
border-radius: 50%;
transition-property: background, border, box-shadow; }
switch:hover slider {
border-color: #2777ff; }
switch:checked slider {
border-color: #0051da; }
switch:backdrop slider {
border-color: #e0e0e0; }
switch:backdrop:checked slider {
border-color: #2777ff; }
switch {
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.2); }
switch slider {
color: #5c616c;
outline-color: rgba(92, 97, 108, 0.3);
border-color: #c2c2c2;
text-shadow: 0 1px rgba(255, 255, 255, 0.769231);
-gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.769231);
background-image: linear-gradient(to bottom, white 20%, #ffffff 90%);
box-shadow: inset 0 1px white, 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.07);
border: 1px solid #bababa;
border-radius: 50%;
transition-property: background, border, box-shadow; }
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 *

16
src/themes/Kali/sass/gtk-sass/_common-tweaks.scss
View File

@ -32,6 +32,8 @@ button:checked, {
switch {
$_slider_border_color: darken($alt_borders_color, 3%);
box-shadow: inset 0 1px 2px -1px transparentize(black, if($variant=='light', .8, .4));
slider {
@include button(normal-alt, $edge: $shadow_color);
@ -45,11 +47,19 @@ switch {
border-color: $suggested_bg_color;
}
&:checked slider {
border-color: if($variant=='light', $suggested_border_color, $_slider_border_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 {
&:backdrop, &:disabled {
box-shadow: none;
slider { border-color: $backdrop_borders_color; }
&:checked slider {

1
src/themes/Kali/sass/gtk-sass/upstream/_common.scss
View File

@ -3057,7 +3057,6 @@ radio {
min-height: 14px;
min-width: 14px;
background-image: none;
background-color: transparent;
box-shadow: none;
-gtk-icon-shadow: none;
color: inherit;