jarno
/
firefox-gnome-theme
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Controls: Update switcher stlye

This commit is contained in:
Rafael Mardojai CM 2022-05-21 22:15:54 -05:00
parent b7002576ea
commit 1a0a8c123f
3 changed files with 18 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
theme/colors/dark.css
View File

@ -66,14 +66,10 @@
--gnome-focused-urlbar-border-color: rgba(120, 174, 237, .5); /* Same as --gnome-accent but with opacity*/ --gnome-focused-urlbar-border-color: rgba(120, 174, 237, .5); /* Same as --gnome-accent but with opacity*/
/* Switch */ /* Switch */
--gnome-switch-background: #535353; --gnome-switch-background: rgba(255, 255, 255, .15);
--gnome-switch-border-color: var(--gnome-switch-background); --gnome-switch-slider-background: #d2d2d2;
--gnome-switch-slider-background: #FFFFFF; --gnome-switch-active-background: var(--gnome-accent-bg);
--gnome-switch-slider-border-color: var(--gnome-switch-background); --gnome-switch-active-slider-background: #ffffff;
--gnome-switch-slider-box-shadow: inset 0 1px white, 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.07);
--gnome-switch-active-background: #3584E4;
--gnome-switch-active-border-color: var(--gnome-switch-active-background);
--gnome-switch-active-slider-border-color: var(--gnome-switch-active-background);
/* Tabs */ /* Tabs */
--gnome-tabbar-tab-color: rgb(141, 144, 145); --gnome-tabbar-tab-color: rgb(141, 144, 145);

12
theme/colors/light.css
View File

@ -67,14 +67,10 @@
--gnome-focused-urlbar-border-color: var(--gnome-accent); --gnome-focused-urlbar-border-color: var(--gnome-accent);
/* Switch */ /* Switch */
--gnome-switch-background: #E0E0E0; --gnome-switch-background: rgba(0, 0, 0, .12);
--gnome-switch-border-color: var(--gnome-switch-background); --gnome-switch-slider-background: #ffffff;
--gnome-switch-slider-background: #FFFFFF; --gnome-switch-active-background: var(--gnome-accent-bg);
--gnome-switch-slider-border-color: var(--gnome-switch-background); --gnome-switch-active-slider-background: #ffffff;
--gnome-switch-slider-box-shadow: inset 0 1px white, 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.07);
--gnome-switch-active-background: #3584E4;
--gnome-switch-active-border-color: var(--gnome-switch-active-background);
--gnome-switch-active-slider-border-color: var(--gnome-switch-active-background);
/* Tabs */ /* Tabs */
--gnome-tabbar-tab-color: #303030; --gnome-tabbar-tab-color: #303030;

27
theme/parts/controls.css
View File

@ -13,41 +13,34 @@
} }
#protections-popup-tp-switch { #protections-popup-tp-switch {
background: var(--gnome-switch-background) !important; background: var(--gnome-switch-background) !important;
border: 1px solid var(--gnome-switch-border-color) !important; border: 0 !important;
border-radius: 24px !important; border-radius: 24px !important;
min-width: 50px !important; min-width: 48px !important;
width: 50px !important; width: 48px !important;
min-height: 26px !important; min-height: 26px !important;
padding: 0 !important; padding: 0 !important;
position: relative !important; position: relative !important;
display: block !important; display: block !important;
margin: 0 !important; margin: 0 !important;
} }
#protections-popup-tp-switch:hover {
border-color: var(--gnome-switch-border-color) !important;
}
#protections-popup-tp-switch::before { #protections-popup-tp-switch::before {
position: absolute !important; position: absolute !important;
top: 0px; top: 2px;
left: 0px; left: 2px;
background: var(--gnome-switch-slider-background) !important; background: var(--gnome-switch-slider-background) !important;
border: 1px solid var(--gnome-switch-slider-border-color) !important; box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
box-shadow: var(--gnome-switch-slider-box-shadow); border: 0 !important;
border-radius: 24px !important; border-radius: 24px !important;
height: 24px !important; height: 22px !important;
width: 24px !important; width: 22px !important;
transition: left .2s ease; transition: left .2s ease;
outline: 0 !important; outline: 0 !important;
} }
#protections-popup-tp-switch[enabled] { #protections-popup-tp-switch[enabled] {
background: var(--gnome-switch-active-background) !important; background: var(--gnome-switch-active-background) !important;
border-color: var(--gnome-switch-active-border-color) !important;
padding-inline-start: 24px !important; padding-inline-start: 24px !important;
} }
#protections-popup-tp-switch[enabled]:hover {
border-color: var(--gnome-switch-active-border-color) !important;
}
#protections-popup-tp-switch[enabled]::before { #protections-popup-tp-switch[enabled]::before {
border-color: var(--gnome-switch-active-slider-border-color) !important; background: var(--gnome-switch-active-slider-background) !important;
left: 24px; left: 24px;
} }