luisgulo/WhiteSur-gtk-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed GDM theme issues

Browse Source
This commit is contained in:
vinceliuice 2020-12-26 21:44:54 +08:00
parent cbaf85bf29
commit d47942587a
20 changed files with 866 additions and 960 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
README.md
View File

@ -66,11 +66,11 @@ then you can run: ( `dialog` is required, install it first! )
If you want to install GDM theme! If you want to install GDM theme!
then you can run: then you can run:
./install.sh -g (install default dark version) sudo ./install.sh -g (install default dark version)
./install.sh -g -c light (install light version) sudo ./install.sh -g -c light (install light version)
./install.sh -g -r (remove installed GDM theme) sudo ./install.sh -g -r (remove installed GDM theme)
![2](pictures/install-tip-02.png) ![2](pictures/install-tip-02.png)

142
src/assets/gnome-shell/common-assets/toggle-off.svg
View File

@ -1,123 +1,21 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg width="40" height="24" version="1.1" viewBox="0 0 40 24" xmlns="http://www.w3.org/2000/svg" xmlns:osb="http://www.openswatchbook.org/uri/2009/osb" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Created with Inkscape (http://www.inkscape.org/) --> <defs>
<filter id="filter1038" x="-.0216" y="-.070497" width="1.0432" height="1.141" color-interpolation-filters="sRGB">
<svg <feGaussianBlur stdDeviation="0.36"/>
xmlns:osb="http://www.openswatchbook.org/uri/2009/osb" </filter>
xmlns:dc="http://purl.org/dc/elements/1.1/" <filter id="filter1034" x="-.037565" y="-.037565" width="1.0751" height="1.0751" color-interpolation-filters="sRGB">
xmlns:cc="http://creativecommons.org/ns#" <feGaussianBlur stdDeviation="0.36"/>
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" </filter>
xmlns:svg="http://www.w3.org/2000/svg" <linearGradient id="linearGradient907" x1="20" x2="20" y1="23.962" gradientTransform="translate(-4.1221e-8 1028.4)" gradientUnits="userSpaceOnUse">
xmlns="http://www.w3.org/2000/svg" <stop stop-color="#000000" stop-opacity=".2" offset="0"/>
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" <stop stop-color="#040404" stop-opacity=".36" offset="1"/>
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" </linearGradient>
width="40" </defs>
height="24" <g transform="translate(0 -1028.4)">
viewBox="0 0 40 24" <rect x="-3.8809e-8" y="1028.4" width="40" height="24" rx="12" ry="12" fill="url(#linearGradient907)" stroke-linecap="round" stroke-linejoin="round" stroke-width=".495" style="paint-order:markers stroke fill"/>
id="svg2" <rect x="-3.8809e-8" y="1028.3" width="40" height="24" opacity="0" stroke-width=".87706"/>
version="1.1" <circle cx="12" cy="1040.9" r="11.5" fill="#000000" filter="url(#filter1034)" opacity=".1" stroke-width="1.2778"/>
inkscape:version="0.92.5 (unknown)" <circle cx="12" cy="1040.4" r="11" fill="#ffffff" stroke-width="1.2222"/>
sodipodi:docname="toggle-off.svg"> <path d="m12 1028.4c-6.648 0-12 5.352-12 12 0 0.086 0.011872 0.1699 0.013672 0.2559 0.13601-6.2563 5.4243-11.256 11.986-11.256h16c6.562 0 11.85 4.9996 11.986 11.256 0.0018-0.086 0.01367-0.1695 0.01367-0.2559 0-6.648-5.352-12-12-12z" fill="#000000" filter="url(#filter1038)" opacity=".1" stroke-linecap="round" stroke-linejoin="round" stroke-width=".495" style="paint-order:markers stroke fill"/>
<defs </g>
id="defs4">
<filter
style="color-interpolation-filters:sRGB"
id="n"
x="-0.096000001"
y="-0.096000001"
width="1.192"
height="1.192">
<feGaussianBlur
stdDeviation="0.72"
id="feGaussianBlur72" />
</filter>
<linearGradient
id="selected_fg_color"
osb:paint="solid">
<stop
stop-color="#ffffffgit"
offset="0"
id="stop21" />
</linearGradient>
</defs>
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="8.65625"
inkscape:cx="-4.1022112"
inkscape:cy="18.267821"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="true"
units="px"
width="40px"
inkscape:window-width="1920"
inkscape:window-height="1020"
inkscape:window-x="0"
inkscape:window-y="28"
inkscape:window-maximized="1"
inkscape:snap-bbox="true"
inkscape:bbox-nodes="true"
inkscape:snap-global="true"
inkscape:snap-nodes="true">
<inkscape:grid
type="xygrid"
id="grid4136" />
</sodipodi:namedview>
<metadata
id="metadata7">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-1028.3622)">
<g
style="display:inline;opacity:0.5"
transform="translate(-53.375999,1144.0022)"
id="switch-insensitive">
<rect
style="opacity:0;stroke-width:0.87706"
id="rect579"
height="24"
width="40"
y="-115.64"
x="53.375999" />
<g
id="g587"
transform="translate(-125.01,5.2981)">
<path
style="fill:#b3b3b3"
inkscape:connector-curvature="0"
id="path581"
d="m 190.39,-119.94 h 16 c 6.094,0 11,4.46 11,10 0,5.54 -4.906,10 -11,10 h -16 c -6.094,0 -11,-4.46 -11,-10 0,-5.54 4.906,-10 11,-10 z" />
<circle
style="opacity:0.25;filter:url(#n)"
id="circle583"
r="9"
cy="-108.14"
cx="221.25999"
transform="matrix(0.97875,0,0,0.97875,-26.23,-3.5914)" />
<circle
style="fill:#ffffff"
id="circle585"
r="9"
cy="-108.14"
cx="221.25999"
transform="matrix(0.92593,0,0,0.92593,-15.153,-9.8037)" />
</g>
</g>
</g>
</svg> </svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.4 KiB

After

Width:  |  Height:  |  Size: 1.8 KiB

28
src/assets/gnome-shell/common-assets/toggle-on.svg
View File

@ -1,17 +1,19 @@
<svg width="40" height="24" version="1.1" viewBox="0 0 40 24" xmlns="http://www.w3.org/2000/svg" xmlns:osb="http://www.openswatchbook.org/uri/2009/osb"> <svg width="40" height="24" version="1.1" viewBox="0 0 40 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs> <defs>
<filter id="m" x="-.096" y="-.096" width="1.192" height="1.192" color-interpolation-filters="sRGB"> <linearGradient id="linearGradient907" x1="20" x2="20" y1="23.962" gradientUnits="userSpaceOnUse">
<feGaussianBlur stdDeviation="0.72"/> <stop stop-color="#397df5" offset="0"/>
<stop stop-color="#256bf5" offset="1"/>
</linearGradient>
<filter id="filter1034" x="-.037565" y="-.037565" width="1.0751" height="1.0751" color-interpolation-filters="sRGB">
<feGaussianBlur stdDeviation="0.36"/>
</filter>
<filter id="filter1038" x="-.0216" y="-.070497" width="1.0432" height="1.141" color-interpolation-filters="sRGB">
<feGaussianBlur stdDeviation="0.36"/>
</filter> </filter>
</defs> </defs>
<g transform="translate(0 -1028.4)"> <rect width="40" height="24" rx="12" ry="12" fill="url(#linearGradient907)" stroke-linecap="round" stroke-linejoin="round" stroke-width=".495" style="paint-order:markers stroke fill"/>
<g id="switch-active" transform="translate(-6 1094)"> <rect y="-.038" width="40" height="24" opacity="0" stroke-width=".87706"/>
<rect x="6" y="-65.638" width="40" height="24" opacity="0" stroke-width=".87706"/> <circle cx="28" cy="12.5" r="11.5" fill="#000000" filter="url(#filter1034)" opacity=".1" stroke-width="1.2778"/>
<g transform="translate(-172.39,55.298)"> <circle cx="28" cy="12" r="11" fill="#ffffff" stroke-width="1.2222"/>
<path d="m190.39-119.94h16c6.094 0 11 4.46 11 10s-4.906 10-11 10h-16c-6.094 0-11-4.46-11-10s4.906-10 11-10z" fill="#0860f2"/> <path d="m12 0c-6.648 0-12 5.352-12 12 0 0.086409 0.011872 0.1699 0.013672 0.25586 0.13601-6.2562 5.4243-11.256 11.986-11.256h16c6.562 0 11.85 4.9996 11.986 11.256 0.0018-0.085962 0.013672-0.16945 0.013672-0.25586 0-6.648-5.352-12-12-12h-16z" fill="#000000" filter="url(#filter1038)" opacity=".1" stroke-linecap="round" stroke-linejoin="round" stroke-width=".495" style="paint-order:markers stroke fill"/>
<circle transform="matrix(.93214 0 0 .93214 .14024 -8.1317)" cx="221.26" cy="-108.14" r="9" filter="url(#m)" opacity=".3"/>
<circle transform="matrix(.92593 0 0 .92593 2.1887 -9.8037)" cx="221.26" cy="-108.14" r="9" fill="#ffffff"/>
</g>
</g>
</g>
</svg> </svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 949 B

After

Width:  |  Height:  |  Size: 1.5 KiB

119
src/main/gnome-shell/gnome-shell-dark-alt.css
View File

@ -118,6 +118,7 @@ StEntry:focus {
} }
StEntry:insensitive { StEntry:insensitive {
background-color: rgba(255, 255, 255, 0.05);
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
} }
@ -918,7 +919,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
spacing-columns: 1em; spacing-columns: 1em;
} }
/* Popovers/Menus */
.candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog { .candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog {
background-color: rgba(36, 36, 36, 0.95); background-color: rgba(36, 36, 36, 0.95);
border-radius: 12px; border-radius: 12px;
@ -928,46 +928,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
.popup-menu { .popup-menu {
min-width: 12em; min-width: 12em;
color: #afafaf; color: #afafaf;
padding: 0 0; padding: 0 0 !important;
}
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.15);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #1366f1;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
} }
.popup-menu .popup-menu-content { .popup-menu .popup-menu-content {
padding: 6px 0; padding: 6px 0 !important;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
margin: 4px 12px 20px; border: 1px solid rgba(0, 0, 0, 0.75);
margin: 4px 8px !important;
} }
.popup-menu .popup-menu-item { .popup-menu .popup-menu-item {
spacing: 12px; spacing: 12px;
padding: 6px; padding-top: 6px !important;
padding-bottom: 6px !important;
color: #afafaf; color: #afafaf;
text-shadow: none; text-shadow: none;
border-radius: 8px; border-radius: 8px;
@ -976,13 +950,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-menu .popup-menu-item:ltr { .popup-menu .popup-menu-item:ltr {
padding-right: 1.5em; padding-right: 2em !important;
padding-left: 0; padding-left: 0 !important;
} }
.popup-menu .popup-menu-item:rtl { .popup-menu .popup-menu-item:rtl {
padding-right: 0; padding-right: 0 !important;
padding-left: 1.5em; padding-left: 2em !important;
} }
.popup-menu .popup-menu-item:checked { .popup-menu .popup-menu-item:checked {
@ -1023,6 +997,34 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
} }
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.15);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #1366f1;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
}
.popup-menu .popup-inactive-menu-item { .popup-menu .popup-inactive-menu-item {
color: #afafaf; color: #afafaf;
} }
@ -1070,16 +1072,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-separator-menu-item { .popup-separator-menu-item {
margin: 0; margin: 0 0;
padding: 0 0; padding: 0 0;
background: none; background: none;
border: none; border: none;
} }
.popup-separator-menu-item .popup-separator-menu-item-separator { .popup-separator-menu-item .popup-separator-menu-item-separator {
height: 0; height: 1px;
background: none; margin: 0 0;
padding: 0; background-color: rgba(255, 255, 255, 0.12);
padding: 0 0;
}
.popup-sub-menu .popup-separator-menu-item .popup-separator-menu-item-separator {
padding: 0 0;
margin: 0 64px 0 0;
} }
.system-switch-user-submenu-icon.user-icon { .system-switch-user-submenu-icon.user-icon {
@ -1193,7 +1201,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-separator-width: 2px; -barlevel-overdrive-separator-width: 2px;
-barlevel-border-width: 0; -barlevel-border-width: 0;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
.osd-window .level-bar { .osd-window .level-bar {
@ -3245,25 +3253,27 @@ StWidget.focused .app-well-app-running-dot {
} }
.login-dialog StEntry { .login-dialog StEntry {
selection-background-color: rgba(255, 255, 255, 0.1); selection-background-color: #0860f2;
selected-background-color: rgba(255, 255, 255, 0.1); selected-background-color: #0860f2;
selected-color: #0860f2; selected-color: white;
padding: 4px 8px; padding: 4px 8px;
min-height: 20px; min-height: 20px;
background-color: rgba(0, 0, 0, 0.1); background-color: rgba(255, 255, 255, 0.1);
border-radius: 100px; border-radius: 100px;
border: 2px solid transparent; border: none;
box-shadow: none; box-shadow: none;
border-radius: 9999px; border-radius: 9999px;
} }
.login-dialog StEntry:focus { .login-dialog StEntry:focus {
border: 2px solid #4d8ef9; border: none;
box-shadow: none; background-color: rgba(255, 255, 255, 0.2);
} }
.login-dialog StEntry:insensitive { .login-dialog StEntry:insensitive {
border: none;
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
background-color: rgba(255, 255, 255, 0.05);
} }
.login-dialog .modal-dialog-button-box { .login-dialog .modal-dialog-button-box {
@ -3346,8 +3356,8 @@ StWidget.focused .app-well-app-running-dot {
border-radius: 100px; border-radius: 100px;
width: 32px; width: 32px;
height: 32px; height: 32px;
border-color: rgba(51, 51, 51, 0.3); border: none;
background-color: rgba(51, 51, 51, 0.3); background-color: rgba(255, 255, 255, 0.1);
} }
.login-dialog .cancel-button StIcon, .login-dialog .cancel-button StIcon,
@ -3362,8 +3372,11 @@ StWidget.focused .app-well-app-running-dot {
.caps-lock-warning-label { .caps-lock-warning-label {
text-align: center; text-align: center;
padding-bottom: 8px; margin-bottom: 8px;
color: #F27835; padding: 2px 6px;
color: white;
background-color: #F27835;
border-radius: 9999px;
} }
.login-dialog-logo-bin { .login-dialog-logo-bin {

119
src/main/gnome-shell/gnome-shell-dark-solid-alt.css
View File

@ -118,6 +118,7 @@ StEntry:focus {
} }
StEntry:insensitive { StEntry:insensitive {
background-color: rgba(255, 255, 255, 0.05);
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
} }
@ -918,7 +919,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
spacing-columns: 1em; spacing-columns: 1em;
} }
/* Popovers/Menus */
.candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog { .candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog {
background-color: #242424; background-color: #242424;
border-radius: 12px; border-radius: 12px;
@ -928,46 +928,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
.popup-menu { .popup-menu {
min-width: 12em; min-width: 12em;
color: #afafaf; color: #afafaf;
padding: 0 0; padding: 0 0 !important;
}
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.15);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #1366f1;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
} }
.popup-menu .popup-menu-content { .popup-menu .popup-menu-content {
padding: 6px 0; padding: 6px 0 !important;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
margin: 4px 12px 20px; border: 1px solid rgba(0, 0, 0, 0.75);
margin: 4px 8px !important;
} }
.popup-menu .popup-menu-item { .popup-menu .popup-menu-item {
spacing: 12px; spacing: 12px;
padding: 6px; padding-top: 6px !important;
padding-bottom: 6px !important;
color: #afafaf; color: #afafaf;
text-shadow: none; text-shadow: none;
border-radius: 8px; border-radius: 8px;
@ -976,13 +950,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-menu .popup-menu-item:ltr { .popup-menu .popup-menu-item:ltr {
padding-right: 1.5em; padding-right: 2em !important;
padding-left: 0; padding-left: 0 !important;
} }
.popup-menu .popup-menu-item:rtl { .popup-menu .popup-menu-item:rtl {
padding-right: 0; padding-right: 0 !important;
padding-left: 1.5em; padding-left: 2em !important;
} }
.popup-menu .popup-menu-item:checked { .popup-menu .popup-menu-item:checked {
@ -1023,6 +997,34 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
} }
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.15);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #1366f1;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
}
.popup-menu .popup-inactive-menu-item { .popup-menu .popup-inactive-menu-item {
color: #afafaf; color: #afafaf;
} }
@ -1070,16 +1072,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-separator-menu-item { .popup-separator-menu-item {
margin: 0; margin: 0 0;
padding: 0 0; padding: 0 0;
background: none; background: none;
border: none; border: none;
} }
.popup-separator-menu-item .popup-separator-menu-item-separator { .popup-separator-menu-item .popup-separator-menu-item-separator {
height: 0; height: 1px;
background: none; margin: 0 0;
padding: 0; background-color: rgba(255, 255, 255, 0.12);
padding: 0 0;
}
.popup-sub-menu .popup-separator-menu-item .popup-separator-menu-item-separator {
padding: 0 0;
margin: 0 64px 0 0;
} }
.system-switch-user-submenu-icon.user-icon { .system-switch-user-submenu-icon.user-icon {
@ -1193,7 +1201,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-separator-width: 2px; -barlevel-overdrive-separator-width: 2px;
-barlevel-border-width: 0; -barlevel-border-width: 0;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
.osd-window .level-bar { .osd-window .level-bar {
@ -3245,25 +3253,27 @@ StWidget.focused .app-well-app-running-dot {
} }
.login-dialog StEntry { .login-dialog StEntry {
selection-background-color: rgba(255, 255, 255, 0.1); selection-background-color: #0860f2;
selected-background-color: rgba(255, 255, 255, 0.1); selected-background-color: #0860f2;
selected-color: #0860f2; selected-color: white;
padding: 4px 8px; padding: 4px 8px;
min-height: 20px; min-height: 20px;
background-color: rgba(0, 0, 0, 0.1); background-color: rgba(255, 255, 255, 0.1);
border-radius: 100px; border-radius: 100px;
border: 2px solid transparent; border: none;
box-shadow: none; box-shadow: none;
border-radius: 9999px; border-radius: 9999px;
} }
.login-dialog StEntry:focus { .login-dialog StEntry:focus {
border: 2px solid #4d8ef9; border: none;
box-shadow: none; background-color: rgba(255, 255, 255, 0.2);
} }
.login-dialog StEntry:insensitive { .login-dialog StEntry:insensitive {
border: none;
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
background-color: rgba(255, 255, 255, 0.05);
} }
.login-dialog .modal-dialog-button-box { .login-dialog .modal-dialog-button-box {
@ -3346,8 +3356,8 @@ StWidget.focused .app-well-app-running-dot {
border-radius: 100px; border-radius: 100px;
width: 32px; width: 32px;
height: 32px; height: 32px;
border-color: rgba(51, 51, 51, 0.3); border: none;
background-color: rgba(51, 51, 51, 0.3); background-color: rgba(255, 255, 255, 0.1);
} }
.login-dialog .cancel-button StIcon, .login-dialog .cancel-button StIcon,
@ -3362,8 +3372,11 @@ StWidget.focused .app-well-app-running-dot {
.caps-lock-warning-label { .caps-lock-warning-label {
text-align: center; text-align: center;
padding-bottom: 8px; margin-bottom: 8px;
color: #F27835; padding: 2px 6px;
color: white;
background-color: #F27835;
border-radius: 9999px;
} }
.login-dialog-logo-bin { .login-dialog-logo-bin {

119
src/main/gnome-shell/gnome-shell-dark-solid.css
View File

@ -118,6 +118,7 @@ StEntry:focus {
} }
StEntry:insensitive { StEntry:insensitive {
background-color: rgba(255, 255, 255, 0.05);
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
} }
@ -918,7 +919,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
spacing-columns: 1em; spacing-columns: 1em;
} }
/* Popovers/Menus */
.candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog { .candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog {
background-color: #242424; background-color: #242424;
border-radius: 12px; border-radius: 12px;
@ -928,46 +928,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
.popup-menu { .popup-menu {
min-width: 12em; min-width: 12em;
color: #afafaf; color: #afafaf;
padding: 0 0; padding: 0 0 !important;
}
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.15);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #1366f1;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
} }
.popup-menu .popup-menu-content { .popup-menu .popup-menu-content {
padding: 6px 0; padding: 6px 0 !important;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
margin: 4px 12px 20px; border: 1px solid rgba(0, 0, 0, 0.75);
margin: 4px 8px !important;
} }
.popup-menu .popup-menu-item { .popup-menu .popup-menu-item {
spacing: 12px; spacing: 12px;
padding: 6px; padding-top: 6px !important;
padding-bottom: 6px !important;
color: #afafaf; color: #afafaf;
text-shadow: none; text-shadow: none;
border-radius: 8px; border-radius: 8px;
@ -976,13 +950,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-menu .popup-menu-item:ltr { .popup-menu .popup-menu-item:ltr {
padding-right: 1.5em; padding-right: 2em !important;
padding-left: 0; padding-left: 0 !important;
} }
.popup-menu .popup-menu-item:rtl { .popup-menu .popup-menu-item:rtl {
padding-right: 0; padding-right: 0 !important;
padding-left: 1.5em; padding-left: 2em !important;
} }
.popup-menu .popup-menu-item:checked { .popup-menu .popup-menu-item:checked {
@ -1023,6 +997,34 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
} }
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.15);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #1366f1;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
}
.popup-menu .popup-inactive-menu-item { .popup-menu .popup-inactive-menu-item {
color: #afafaf; color: #afafaf;
} }
@ -1070,16 +1072,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-separator-menu-item { .popup-separator-menu-item {
margin: 0; margin: 0 0;
padding: 0 0; padding: 0 0;
background: none; background: none;
border: none; border: none;
} }
.popup-separator-menu-item .popup-separator-menu-item-separator { .popup-separator-menu-item .popup-separator-menu-item-separator {
height: 0; height: 1px;
background: none; margin: 0 0;
padding: 0; background-color: rgba(255, 255, 255, 0.12);
padding: 0 0;
}
.popup-sub-menu .popup-separator-menu-item .popup-separator-menu-item-separator {
padding: 0 0;
margin: 0 64px 0 0;
} }
.system-switch-user-submenu-icon.user-icon { .system-switch-user-submenu-icon.user-icon {
@ -1193,7 +1201,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-separator-width: 2px; -barlevel-overdrive-separator-width: 2px;
-barlevel-border-width: 0; -barlevel-border-width: 0;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
.osd-window .level-bar { .osd-window .level-bar {
@ -3245,25 +3253,27 @@ StWidget.focused .app-well-app-running-dot {
} }
.login-dialog StEntry { .login-dialog StEntry {
selection-background-color: rgba(255, 255, 255, 0.1); selection-background-color: #0860f2;
selected-background-color: rgba(255, 255, 255, 0.1); selected-background-color: #0860f2;
selected-color: #0860f2; selected-color: white;
padding: 4px 8px; padding: 4px 8px;
min-height: 20px; min-height: 20px;
background-color: rgba(0, 0, 0, 0.1); background-color: rgba(255, 255, 255, 0.1);
border-radius: 100px; border-radius: 100px;
border: 2px solid transparent; border: none;
box-shadow: none; box-shadow: none;
border-radius: 9999px; border-radius: 9999px;
} }
.login-dialog StEntry:focus { .login-dialog StEntry:focus {
border: 2px solid #4d8ef9; border: none;
box-shadow: none; background-color: rgba(255, 255, 255, 0.2);
} }
.login-dialog StEntry:insensitive { .login-dialog StEntry:insensitive {
border: none;
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
background-color: rgba(255, 255, 255, 0.05);
} }
.login-dialog .modal-dialog-button-box { .login-dialog .modal-dialog-button-box {
@ -3346,8 +3356,8 @@ StWidget.focused .app-well-app-running-dot {
border-radius: 100px; border-radius: 100px;
width: 32px; width: 32px;
height: 32px; height: 32px;
border-color: rgba(51, 51, 51, 0.3); border: none;
background-color: rgba(51, 51, 51, 0.3); background-color: rgba(255, 255, 255, 0.1);
} }
.login-dialog .cancel-button StIcon, .login-dialog .cancel-button StIcon,
@ -3362,8 +3372,11 @@ StWidget.focused .app-well-app-running-dot {
.caps-lock-warning-label { .caps-lock-warning-label {
text-align: center; text-align: center;
padding-bottom: 8px; margin-bottom: 8px;
color: #F27835; padding: 2px 6px;
color: white;
background-color: #F27835;
border-radius: 9999px;
} }
.login-dialog-logo-bin { .login-dialog-logo-bin {

119
src/main/gnome-shell/gnome-shell-dark.css
View File

@ -118,6 +118,7 @@ StEntry:focus {
} }
StEntry:insensitive { StEntry:insensitive {
background-color: rgba(255, 255, 255, 0.05);
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
} }
@ -918,7 +919,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
spacing-columns: 1em; spacing-columns: 1em;
} }
/* Popovers/Menus */
.candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog { .candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog {
background-color: rgba(36, 36, 36, 0.95); background-color: rgba(36, 36, 36, 0.95);
border-radius: 12px; border-radius: 12px;
@ -928,46 +928,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
.popup-menu { .popup-menu {
min-width: 12em; min-width: 12em;
color: #afafaf; color: #afafaf;
padding: 0 0; padding: 0 0 !important;
}
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.15);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #1366f1;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
} }
.popup-menu .popup-menu-content { .popup-menu .popup-menu-content {
padding: 6px 0; padding: 6px 0 !important;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
margin: 4px 12px 20px; border: 1px solid rgba(0, 0, 0, 0.75);
margin: 4px 8px !important;
} }
.popup-menu .popup-menu-item { .popup-menu .popup-menu-item {
spacing: 12px; spacing: 12px;
padding: 6px; padding-top: 6px !important;
padding-bottom: 6px !important;
color: #afafaf; color: #afafaf;
text-shadow: none; text-shadow: none;
border-radius: 8px; border-radius: 8px;
@ -976,13 +950,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-menu .popup-menu-item:ltr { .popup-menu .popup-menu-item:ltr {
padding-right: 1.5em; padding-right: 2em !important;
padding-left: 0; padding-left: 0 !important;
} }
.popup-menu .popup-menu-item:rtl { .popup-menu .popup-menu-item:rtl {
padding-right: 0; padding-right: 0 !important;
padding-left: 1.5em; padding-left: 2em !important;
} }
.popup-menu .popup-menu-item:checked { .popup-menu .popup-menu-item:checked {
@ -1023,6 +997,34 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
} }
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.15);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #1366f1;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
}
.popup-menu .popup-inactive-menu-item { .popup-menu .popup-inactive-menu-item {
color: #afafaf; color: #afafaf;
} }
@ -1070,16 +1072,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-separator-menu-item { .popup-separator-menu-item {
margin: 0; margin: 0 0;
padding: 0 0; padding: 0 0;
background: none; background: none;
border: none; border: none;
} }
.popup-separator-menu-item .popup-separator-menu-item-separator { .popup-separator-menu-item .popup-separator-menu-item-separator {
height: 0; height: 1px;
background: none; margin: 0 0;
padding: 0; background-color: rgba(255, 255, 255, 0.12);
padding: 0 0;
}
.popup-sub-menu .popup-separator-menu-item .popup-separator-menu-item-separator {
padding: 0 0;
margin: 0 64px 0 0;
} }
.system-switch-user-submenu-icon.user-icon { .system-switch-user-submenu-icon.user-icon {
@ -1193,7 +1201,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-separator-width: 2px; -barlevel-overdrive-separator-width: 2px;
-barlevel-border-width: 0; -barlevel-border-width: 0;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
.osd-window .level-bar { .osd-window .level-bar {
@ -3245,25 +3253,27 @@ StWidget.focused .app-well-app-running-dot {
} }
.login-dialog StEntry { .login-dialog StEntry {
selection-background-color: rgba(255, 255, 255, 0.1); selection-background-color: #0860f2;
selected-background-color: rgba(255, 255, 255, 0.1); selected-background-color: #0860f2;
selected-color: #0860f2; selected-color: white;
padding: 4px 8px; padding: 4px 8px;
min-height: 20px; min-height: 20px;
background-color: rgba(0, 0, 0, 0.1); background-color: rgba(255, 255, 255, 0.1);
border-radius: 100px; border-radius: 100px;
border: 2px solid transparent; border: none;
box-shadow: none; box-shadow: none;
border-radius: 9999px; border-radius: 9999px;
} }
.login-dialog StEntry:focus { .login-dialog StEntry:focus {
border: 2px solid #4d8ef9; border: none;
box-shadow: none; background-color: rgba(255, 255, 255, 0.2);
} }
.login-dialog StEntry:insensitive { .login-dialog StEntry:insensitive {
border: none;
color: rgba(222, 222, 222, 0.35); color: rgba(222, 222, 222, 0.35);
background-color: rgba(255, 255, 255, 0.05);
} }
.login-dialog .modal-dialog-button-box { .login-dialog .modal-dialog-button-box {
@ -3346,8 +3356,8 @@ StWidget.focused .app-well-app-running-dot {
border-radius: 100px; border-radius: 100px;
width: 32px; width: 32px;
height: 32px; height: 32px;
border-color: rgba(51, 51, 51, 0.3); border: none;
background-color: rgba(51, 51, 51, 0.3); background-color: rgba(255, 255, 255, 0.1);
} }
.login-dialog .cancel-button StIcon, .login-dialog .cancel-button StIcon,
@ -3362,8 +3372,11 @@ StWidget.focused .app-well-app-running-dot {
.caps-lock-warning-label { .caps-lock-warning-label {
text-align: center; text-align: center;
padding-bottom: 8px; margin-bottom: 8px;
color: #F27835; padding: 2px 6px;
color: white;
background-color: #F27835;
border-radius: 9999px;
} }
.login-dialog-logo-bin { .login-dialog-logo-bin {

133
src/main/gnome-shell/gnome-shell-light-alt.css
View File

@ -118,6 +118,7 @@ StEntry:focus {
} }
StEntry:insensitive { StEntry:insensitive {
background-color: rgba(0, 0, 0, 0.05);
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
} }
@ -198,23 +199,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
border-radius: 16px; border-radius: 16px;
-slider-height: 19px; -slider-height: 19px;
-slider-background-color: rgba(0, 0, 0, 0.1); -slider-background-color: rgba(0, 0, 0, 0.1);
-slider-border-color: rgba(0, 0, 0, 0.12); -slider-border-color: rgba(0, 0, 0, 0.15);
-slider-active-background-color: white; -slider-active-background-color: white;
-slider-active-border-color: rgba(0, 0, 0, 0.12); -slider-active-border-color: rgba(0, 0, 0, 0.15);
-slider-border-width: 1px; -slider-border-width: 1px;
-slider-handle-radius: 10px; -slider-handle-radius: 10px;
-slider-handle-border-width: 1px; -slider-handle-border-width: 1px;
-slider-handle-border-color: rgba(0, 0, 0, 0.12); -slider-handle-border-color: rgba(0, 0, 0, 0.15);
-barlevel-height: 19px; -barlevel-height: 19px;
-barlevel-background-color: rgba(0, 0, 0, 0.1); -barlevel-background-color: rgba(0, 0, 0, 0.1);
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
-barlevel-active-background-color: white; -barlevel-active-background-color: white;
-barlevel-active-border-color: rgba(0, 0, 0, 0.12); -barlevel-active-border-color: rgba(0, 0, 0, 0.15);
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-border-color: rgba(0, 0, 0, 0.12); -barlevel-overdrive-border-color: rgba(0, 0, 0, 0.15);
-barlevel-overdrive-separator-width: 0; -barlevel-overdrive-separator-width: 0;
-barlevel-border-width: 1px; -barlevel-border-width: 1px;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
/* Check Boxes */ /* Check Boxes */
@ -918,7 +919,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
spacing-columns: 1em; spacing-columns: 1em;
} }
/* Popovers/Menus */
.candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog { .candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog {
background-color: rgba(245, 245, 245, 0.95); background-color: rgba(245, 245, 245, 0.95);
border-radius: 12px; border-radius: 12px;
@ -928,46 +928,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
.popup-menu { .popup-menu {
min-width: 12em; min-width: 12em;
color: #424242; color: #424242;
padding: 0 0; padding: 0 0 !important;
}
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.75);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #095de8;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
} }
.popup-menu .popup-menu-content { .popup-menu .popup-menu-content {
padding: 6px 0; padding: 6px 0 !important;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
margin: 4px 12px 20px; border: 1px solid rgba(0, 0, 0, 0);
margin: 4px 8px !important;
} }
.popup-menu .popup-menu-item { .popup-menu .popup-menu-item {
spacing: 12px; spacing: 12px;
padding: 6px; padding-top: 6px !important;
padding-bottom: 6px !important;
color: #424242; color: #424242;
text-shadow: none; text-shadow: none;
border-radius: 8px; border-radius: 8px;
@ -976,13 +950,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-menu .popup-menu-item:ltr { .popup-menu .popup-menu-item:ltr {
padding-right: 1.5em; padding-right: 2em !important;
padding-left: 0; padding-left: 0 !important;
} }
.popup-menu .popup-menu-item:rtl { .popup-menu .popup-menu-item:rtl {
padding-right: 0; padding-right: 0 !important;
padding-left: 1.5em; padding-left: 2em !important;
} }
.popup-menu .popup-menu-item:checked { .popup-menu .popup-menu-item:checked {
@ -1023,6 +997,34 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
} }
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.75);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #095de8;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
}
.popup-menu .popup-inactive-menu-item { .popup-menu .popup-inactive-menu-item {
color: #424242; color: #424242;
} }
@ -1070,16 +1072,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-separator-menu-item { .popup-separator-menu-item {
margin: 0; margin: 0 0;
padding: 0 0; padding: 0 0;
background: none; background: none;
border: none; border: none;
} }
.popup-separator-menu-item .popup-separator-menu-item-separator { .popup-separator-menu-item .popup-separator-menu-item-separator {
height: 0; height: 1px;
background: none; margin: 0 0;
padding: 0; background-color: rgba(0, 0, 0, 0.12);
padding: 0 0;
}
.popup-sub-menu .popup-separator-menu-item .popup-separator-menu-item-separator {
padding: 0 0;
margin: 0 64px 0 0;
} }
.system-switch-user-submenu-icon.user-icon { .system-switch-user-submenu-icon.user-icon {
@ -1193,7 +1201,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-separator-width: 2px; -barlevel-overdrive-separator-width: 2px;
-barlevel-border-width: 0; -barlevel-border-width: 0;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
.osd-window .level-bar { .osd-window .level-bar {
@ -3245,25 +3253,27 @@ StWidget.focused .app-well-app-running-dot {
} }
.login-dialog StEntry { .login-dialog StEntry {
selection-background-color: rgba(0, 0, 0, 0.2); selection-background-color: #0860f2;
selected-background-color: rgba(0, 0, 0, 0.2); selected-background-color: #0860f2;
selected-color: #0860f2; selected-color: white;
padding: 4px 8px; padding: 4px 8px;
min-height: 20px; min-height: 20px;
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(0, 0, 0, 0.1);
border-radius: 100px; border-radius: 100px;
border: 2px solid transparent; border: none;
box-shadow: none; box-shadow: none;
border-radius: 9999px; border-radius: 9999px;
} }
.login-dialog StEntry:focus { .login-dialog StEntry:focus {
border: 2px solid #4d8ef9; border: none;
box-shadow: none; background-color: rgba(0, 0, 0, 0.2);
} }
.login-dialog StEntry:insensitive { .login-dialog StEntry:insensitive {
border: none;
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
background-color: rgba(0, 0, 0, 0.05);
} }
.login-dialog .modal-dialog-button-box { .login-dialog .modal-dialog-button-box {
@ -3346,8 +3356,8 @@ StWidget.focused .app-well-app-running-dot {
border-radius: 100px; border-radius: 100px;
width: 32px; width: 32px;
height: 32px; height: 32px;
border-color: rgba(245, 245, 245, 0.3); border: none;
background-color: rgba(245, 245, 245, 0.3); background-color: rgba(0, 0, 0, 0.1);
} }
.login-dialog .cancel-button StIcon, .login-dialog .cancel-button StIcon,
@ -3362,8 +3372,11 @@ StWidget.focused .app-well-app-running-dot {
.caps-lock-warning-label { .caps-lock-warning-label {
text-align: center; text-align: center;
padding-bottom: 8px; margin-bottom: 8px;
color: #F27835; padding: 2px 6px;
color: white;
background-color: #F27835;
border-radius: 9999px;
} }
.login-dialog-logo-bin { .login-dialog-logo-bin {

137
src/main/gnome-shell/gnome-shell-light-solid-alt.css
View File

@ -118,6 +118,7 @@ StEntry:focus {
} }
StEntry:insensitive { StEntry:insensitive {
background-color: rgba(0, 0, 0, 0.05);
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
} }
@ -198,23 +199,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
border-radius: 16px; border-radius: 16px;
-slider-height: 19px; -slider-height: 19px;
-slider-background-color: rgba(0, 0, 0, 0.1); -slider-background-color: rgba(0, 0, 0, 0.1);
-slider-border-color: rgba(0, 0, 0, 0.12); -slider-border-color: rgba(0, 0, 0, 0.15);
-slider-active-background-color: white; -slider-active-background-color: white;
-slider-active-border-color: rgba(0, 0, 0, 0.12); -slider-active-border-color: rgba(0, 0, 0, 0.15);
-slider-border-width: 1px; -slider-border-width: 1px;
-slider-handle-radius: 10px; -slider-handle-radius: 10px;
-slider-handle-border-width: 1px; -slider-handle-border-width: 1px;
-slider-handle-border-color: rgba(0, 0, 0, 0.12); -slider-handle-border-color: rgba(0, 0, 0, 0.15);
-barlevel-height: 19px; -barlevel-height: 19px;
-barlevel-background-color: rgba(0, 0, 0, 0.1); -barlevel-background-color: rgba(0, 0, 0, 0.1);
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
-barlevel-active-background-color: white; -barlevel-active-background-color: white;
-barlevel-active-border-color: rgba(0, 0, 0, 0.12); -barlevel-active-border-color: rgba(0, 0, 0, 0.15);
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-border-color: rgba(0, 0, 0, 0.12); -barlevel-overdrive-border-color: rgba(0, 0, 0, 0.15);
-barlevel-overdrive-separator-width: 0; -barlevel-overdrive-separator-width: 0;
-barlevel-border-width: 1px; -barlevel-border-width: 1px;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
/* Check Boxes */ /* Check Boxes */
@ -918,9 +919,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
spacing-columns: 1em; spacing-columns: 1em;
} }
/* Popovers/Menus */
.candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog { .candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog {
background-color: #f5f5f5; background-color: whitesmoke;
border-radius: 12px; border-radius: 12px;
border: none; border: none;
} }
@ -928,46 +928,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
.popup-menu { .popup-menu {
min-width: 12em; min-width: 12em;
color: #424242; color: #424242;
padding: 0 0; padding: 0 0 !important;
}
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.75);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #095de8;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
} }
.popup-menu .popup-menu-content { .popup-menu .popup-menu-content {
padding: 6px 0; padding: 6px 0 !important;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
margin: 4px 12px 20px; border: 1px solid rgba(0, 0, 0, 0);
margin: 4px 8px !important;
} }
.popup-menu .popup-menu-item { .popup-menu .popup-menu-item {
spacing: 12px; spacing: 12px;
padding: 6px; padding-top: 6px !important;
padding-bottom: 6px !important;
color: #424242; color: #424242;
text-shadow: none; text-shadow: none;
border-radius: 8px; border-radius: 8px;
@ -976,13 +950,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-menu .popup-menu-item:ltr { .popup-menu .popup-menu-item:ltr {
padding-right: 1.5em; padding-right: 2em !important;
padding-left: 0; padding-left: 0 !important;
} }
.popup-menu .popup-menu-item:rtl { .popup-menu .popup-menu-item:rtl {
padding-right: 0; padding-right: 0 !important;
padding-left: 1.5em; padding-left: 2em !important;
} }
.popup-menu .popup-menu-item:checked { .popup-menu .popup-menu-item:checked {
@ -1023,6 +997,34 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
} }
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.75);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #095de8;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
}
.popup-menu .popup-inactive-menu-item { .popup-menu .popup-inactive-menu-item {
color: #424242; color: #424242;
} }
@ -1061,7 +1063,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
.candidate-popup-boxpointer { .candidate-popup-boxpointer {
-arrow-border-radius: 2px; -arrow-border-radius: 2px;
-arrow-background-color: #f5f5f5; -arrow-background-color: whitesmoke;
-arrow-border-width: 0; -arrow-border-width: 0;
-arrow-border-color: transparent; -arrow-border-color: transparent;
-arrow-base: 5px; -arrow-base: 5px;
@ -1070,16 +1072,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-separator-menu-item { .popup-separator-menu-item {
margin: 0; margin: 0 0;
padding: 0 0; padding: 0 0;
background: none; background: none;
border: none; border: none;
} }
.popup-separator-menu-item .popup-separator-menu-item-separator { .popup-separator-menu-item .popup-separator-menu-item-separator {
height: 0; height: 1px;
background: none; margin: 0 0;
padding: 0; background-color: rgba(0, 0, 0, 0.12);
padding: 0 0;
}
.popup-sub-menu .popup-separator-menu-item .popup-separator-menu-item-separator {
padding: 0 0;
margin: 0 64px 0 0;
} }
.system-switch-user-submenu-icon.user-icon { .system-switch-user-submenu-icon.user-icon {
@ -1193,7 +1201,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-separator-width: 2px; -barlevel-overdrive-separator-width: 2px;
-barlevel-border-width: 0; -barlevel-border-width: 0;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
.osd-window .level-bar { .osd-window .level-bar {
@ -3245,25 +3253,27 @@ StWidget.focused .app-well-app-running-dot {
} }
.login-dialog StEntry { .login-dialog StEntry {
selection-background-color: rgba(0, 0, 0, 0.2); selection-background-color: #0860f2;
selected-background-color: rgba(0, 0, 0, 0.2); selected-background-color: #0860f2;
selected-color: #0860f2; selected-color: white;
padding: 4px 8px; padding: 4px 8px;
min-height: 20px; min-height: 20px;
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(0, 0, 0, 0.1);
border-radius: 100px; border-radius: 100px;
border: 2px solid transparent; border: none;
box-shadow: none; box-shadow: none;
border-radius: 9999px; border-radius: 9999px;
} }
.login-dialog StEntry:focus { .login-dialog StEntry:focus {
border: 2px solid #4d8ef9; border: none;
box-shadow: none; background-color: rgba(0, 0, 0, 0.2);
} }
.login-dialog StEntry:insensitive { .login-dialog StEntry:insensitive {
border: none;
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
background-color: rgba(0, 0, 0, 0.05);
} }
.login-dialog .modal-dialog-button-box { .login-dialog .modal-dialog-button-box {
@ -3346,8 +3356,8 @@ StWidget.focused .app-well-app-running-dot {
border-radius: 100px; border-radius: 100px;
width: 32px; width: 32px;
height: 32px; height: 32px;
border-color: rgba(245, 245, 245, 0.3); border: none;
background-color: rgba(245, 245, 245, 0.3); background-color: rgba(0, 0, 0, 0.1);
} }
.login-dialog .cancel-button StIcon, .login-dialog .cancel-button StIcon,
@ -3362,8 +3372,11 @@ StWidget.focused .app-well-app-running-dot {
.caps-lock-warning-label { .caps-lock-warning-label {
text-align: center; text-align: center;
padding-bottom: 8px; margin-bottom: 8px;
color: #F27835; padding: 2px 6px;
color: white;
background-color: #F27835;
border-radius: 9999px;
} }
.login-dialog-logo-bin { .login-dialog-logo-bin {

137
src/main/gnome-shell/gnome-shell-light-solid.css
View File

@ -118,6 +118,7 @@ StEntry:focus {
} }
StEntry:insensitive { StEntry:insensitive {
background-color: rgba(0, 0, 0, 0.05);
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
} }
@ -198,23 +199,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
border-radius: 16px; border-radius: 16px;
-slider-height: 19px; -slider-height: 19px;
-slider-background-color: rgba(0, 0, 0, 0.1); -slider-background-color: rgba(0, 0, 0, 0.1);
-slider-border-color: rgba(0, 0, 0, 0.12); -slider-border-color: rgba(0, 0, 0, 0.15);
-slider-active-background-color: white; -slider-active-background-color: white;
-slider-active-border-color: rgba(0, 0, 0, 0.12); -slider-active-border-color: rgba(0, 0, 0, 0.15);
-slider-border-width: 1px; -slider-border-width: 1px;
-slider-handle-radius: 10px; -slider-handle-radius: 10px;
-slider-handle-border-width: 1px; -slider-handle-border-width: 1px;
-slider-handle-border-color: rgba(0, 0, 0, 0.12); -slider-handle-border-color: rgba(0, 0, 0, 0.15);
-barlevel-height: 19px; -barlevel-height: 19px;
-barlevel-background-color: rgba(0, 0, 0, 0.1); -barlevel-background-color: rgba(0, 0, 0, 0.1);
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
-barlevel-active-background-color: white; -barlevel-active-background-color: white;
-barlevel-active-border-color: rgba(0, 0, 0, 0.12); -barlevel-active-border-color: rgba(0, 0, 0, 0.15);
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-border-color: rgba(0, 0, 0, 0.12); -barlevel-overdrive-border-color: rgba(0, 0, 0, 0.15);
-barlevel-overdrive-separator-width: 0; -barlevel-overdrive-separator-width: 0;
-barlevel-border-width: 1px; -barlevel-border-width: 1px;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
/* Check Boxes */ /* Check Boxes */
@ -918,9 +919,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
spacing-columns: 1em; spacing-columns: 1em;
} }
/* Popovers/Menus */
.candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog { .candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog {
background-color: #f5f5f5; background-color: whitesmoke;
border-radius: 12px; border-radius: 12px;
border: none; border: none;
} }
@ -928,46 +928,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
.popup-menu { .popup-menu {
min-width: 12em; min-width: 12em;
color: #424242; color: #424242;
padding: 0 0; padding: 0 0 !important;
}
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.75);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #095de8;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
} }
.popup-menu .popup-menu-content { .popup-menu .popup-menu-content {
padding: 6px 0; padding: 6px 0 !important;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
margin: 4px 12px 20px; border: 1px solid rgba(0, 0, 0, 0);
margin: 4px 8px !important;
} }
.popup-menu .popup-menu-item { .popup-menu .popup-menu-item {
spacing: 12px; spacing: 12px;
padding: 6px; padding-top: 6px !important;
padding-bottom: 6px !important;
color: #424242; color: #424242;
text-shadow: none; text-shadow: none;
border-radius: 8px; border-radius: 8px;
@ -976,13 +950,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-menu .popup-menu-item:ltr { .popup-menu .popup-menu-item:ltr {
padding-right: 1.5em; padding-right: 2em !important;
padding-left: 0; padding-left: 0 !important;
} }
.popup-menu .popup-menu-item:rtl { .popup-menu .popup-menu-item:rtl {
padding-right: 0; padding-right: 0 !important;
padding-left: 1.5em; padding-left: 2em !important;
} }
.popup-menu .popup-menu-item:checked { .popup-menu .popup-menu-item:checked {
@ -1023,6 +997,34 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
} }
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.75);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #095de8;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
}
.popup-menu .popup-inactive-menu-item { .popup-menu .popup-inactive-menu-item {
color: #424242; color: #424242;
} }
@ -1061,7 +1063,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
.candidate-popup-boxpointer { .candidate-popup-boxpointer {
-arrow-border-radius: 2px; -arrow-border-radius: 2px;
-arrow-background-color: #f5f5f5; -arrow-background-color: whitesmoke;
-arrow-border-width: 0; -arrow-border-width: 0;
-arrow-border-color: transparent; -arrow-border-color: transparent;
-arrow-base: 5px; -arrow-base: 5px;
@ -1070,16 +1072,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-separator-menu-item { .popup-separator-menu-item {
margin: 0; margin: 0 0;
padding: 0 0; padding: 0 0;
background: none; background: none;
border: none; border: none;
} }
.popup-separator-menu-item .popup-separator-menu-item-separator { .popup-separator-menu-item .popup-separator-menu-item-separator {
height: 0; height: 1px;
background: none; margin: 0 0;
padding: 0; background-color: rgba(0, 0, 0, 0.12);
padding: 0 0;
}
.popup-sub-menu .popup-separator-menu-item .popup-separator-menu-item-separator {
padding: 0 0;
margin: 0 64px 0 0;
} }
.system-switch-user-submenu-icon.user-icon { .system-switch-user-submenu-icon.user-icon {
@ -1193,7 +1201,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-separator-width: 2px; -barlevel-overdrive-separator-width: 2px;
-barlevel-border-width: 0; -barlevel-border-width: 0;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
.osd-window .level-bar { .osd-window .level-bar {
@ -3245,25 +3253,27 @@ StWidget.focused .app-well-app-running-dot {
} }
.login-dialog StEntry { .login-dialog StEntry {
selection-background-color: rgba(0, 0, 0, 0.2); selection-background-color: #0860f2;
selected-background-color: rgba(0, 0, 0, 0.2); selected-background-color: #0860f2;
selected-color: #0860f2; selected-color: white;
padding: 4px 8px; padding: 4px 8px;
min-height: 20px; min-height: 20px;
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(0, 0, 0, 0.1);
border-radius: 100px; border-radius: 100px;
border: 2px solid transparent; border: none;
box-shadow: none; box-shadow: none;
border-radius: 9999px; border-radius: 9999px;
} }
.login-dialog StEntry:focus { .login-dialog StEntry:focus {
border: 2px solid #4d8ef9; border: none;
box-shadow: none; background-color: rgba(0, 0, 0, 0.2);
} }
.login-dialog StEntry:insensitive { .login-dialog StEntry:insensitive {
border: none;
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
background-color: rgba(0, 0, 0, 0.05);
} }
.login-dialog .modal-dialog-button-box { .login-dialog .modal-dialog-button-box {
@ -3346,8 +3356,8 @@ StWidget.focused .app-well-app-running-dot {
border-radius: 100px; border-radius: 100px;
width: 32px; width: 32px;
height: 32px; height: 32px;
border-color: rgba(245, 245, 245, 0.3); border: none;
background-color: rgba(245, 245, 245, 0.3); background-color: rgba(0, 0, 0, 0.1);
} }
.login-dialog .cancel-button StIcon, .login-dialog .cancel-button StIcon,
@ -3362,8 +3372,11 @@ StWidget.focused .app-well-app-running-dot {
.caps-lock-warning-label { .caps-lock-warning-label {
text-align: center; text-align: center;
padding-bottom: 8px; margin-bottom: 8px;
color: #F27835; padding: 2px 6px;
color: white;
background-color: #F27835;
border-radius: 9999px;
} }
.login-dialog-logo-bin { .login-dialog-logo-bin {

133
src/main/gnome-shell/gnome-shell-light.css
View File

@ -118,6 +118,7 @@ StEntry:focus {
} }
StEntry:insensitive { StEntry:insensitive {
background-color: rgba(0, 0, 0, 0.05);
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
} }
@ -198,23 +199,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
border-radius: 16px; border-radius: 16px;
-slider-height: 19px; -slider-height: 19px;
-slider-background-color: rgba(0, 0, 0, 0.1); -slider-background-color: rgba(0, 0, 0, 0.1);
-slider-border-color: rgba(0, 0, 0, 0.12); -slider-border-color: rgba(0, 0, 0, 0.15);
-slider-active-background-color: white; -slider-active-background-color: white;
-slider-active-border-color: rgba(0, 0, 0, 0.12); -slider-active-border-color: rgba(0, 0, 0, 0.15);
-slider-border-width: 1px; -slider-border-width: 1px;
-slider-handle-radius: 10px; -slider-handle-radius: 10px;
-slider-handle-border-width: 1px; -slider-handle-border-width: 1px;
-slider-handle-border-color: rgba(0, 0, 0, 0.12); -slider-handle-border-color: rgba(0, 0, 0, 0.15);
-barlevel-height: 19px; -barlevel-height: 19px;
-barlevel-background-color: rgba(0, 0, 0, 0.1); -barlevel-background-color: rgba(0, 0, 0, 0.1);
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
-barlevel-active-background-color: white; -barlevel-active-background-color: white;
-barlevel-active-border-color: rgba(0, 0, 0, 0.12); -barlevel-active-border-color: rgba(0, 0, 0, 0.15);
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-border-color: rgba(0, 0, 0, 0.12); -barlevel-overdrive-border-color: rgba(0, 0, 0, 0.15);
-barlevel-overdrive-separator-width: 0; -barlevel-overdrive-separator-width: 0;
-barlevel-border-width: 1px; -barlevel-border-width: 1px;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
/* Check Boxes */ /* Check Boxes */
@ -918,7 +919,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
spacing-columns: 1em; spacing-columns: 1em;
} }
/* Popovers/Menus */
.candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog { .candidate-popup-boxpointer, .popup-menu .popup-menu-content, .modal-dialog {
background-color: rgba(245, 245, 245, 0.95); background-color: rgba(245, 245, 245, 0.95);
border-radius: 12px; border-radius: 12px;
@ -928,46 +928,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
.popup-menu { .popup-menu {
min-width: 12em; min-width: 12em;
color: #424242; color: #424242;
padding: 0 0; padding: 0 0 !important;
}
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.75);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #095de8;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
} }
.popup-menu .popup-menu-content { .popup-menu .popup-menu-content {
padding: 6px 0; padding: 6px 0 !important;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
margin: 4px 12px 20px; border: 1px solid rgba(0, 0, 0, 0);
margin: 4px 8px !important;
} }
.popup-menu .popup-menu-item { .popup-menu .popup-menu-item {
spacing: 12px; spacing: 12px;
padding: 6px; padding-top: 6px !important;
padding-bottom: 6px !important;
color: #424242; color: #424242;
text-shadow: none; text-shadow: none;
border-radius: 8px; border-radius: 8px;
@ -976,13 +950,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-menu .popup-menu-item:ltr { .popup-menu .popup-menu-item:ltr {
padding-right: 1.5em; padding-right: 2em !important;
padding-left: 0; padding-left: 0 !important;
} }
.popup-menu .popup-menu-item:rtl { .popup-menu .popup-menu-item:rtl {
padding-right: 0; padding-right: 0 !important;
padding-left: 1.5em; padding-left: 2em !important;
} }
.popup-menu .popup-menu-item:checked { .popup-menu .popup-menu-item:checked {
@ -1023,6 +997,34 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
} }
.popup-menu .popup-sub-menu {
background-color: rgba(255, 255, 255, 0.75);
border-radius: 0 0 8px 8px;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
}
.popup-menu .popup-sub-menu .popup-menu-item {
margin: 0;
border-radius: 8px;
}
.popup-menu .popup-sub-menu .popup-menu-item:hover {
color: white;
background-color: #0860f2;
}
.popup-menu .popup-sub-menu .popup-menu-item:active {
color: white;
background-color: #095de8;
}
.popup-menu .popup-sub-menu .popup-menu-item:not(:first-child):last-child {
border-radius: 0 0 8px 8px;
}
.popup-menu .popup-inactive-menu-item { .popup-menu .popup-inactive-menu-item {
color: #424242; color: #424242;
} }
@ -1070,16 +1072,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
} }
.popup-separator-menu-item { .popup-separator-menu-item {
margin: 0; margin: 0 0;
padding: 0 0; padding: 0 0;
background: none; background: none;
border: none; border: none;
} }
.popup-separator-menu-item .popup-separator-menu-item-separator { .popup-separator-menu-item .popup-separator-menu-item-separator {
height: 0; height: 1px;
background: none; margin: 0 0;
padding: 0; background-color: rgba(0, 0, 0, 0.12);
padding: 0 0;
}
.popup-sub-menu .popup-separator-menu-item .popup-separator-menu-item-separator {
padding: 0 0;
margin: 0 64px 0 0;
} }
.system-switch-user-submenu-icon.user-icon { .system-switch-user-submenu-icon.user-icon {
@ -1193,7 +1201,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
-barlevel-overdrive-color: #f8464c; -barlevel-overdrive-color: #f8464c;
-barlevel-overdrive-separator-width: 2px; -barlevel-overdrive-separator-width: 2px;
-barlevel-border-width: 0; -barlevel-border-width: 0;
-barlevel-border-color: rgba(0, 0, 0, 0.12); -barlevel-border-color: rgba(0, 0, 0, 0.15);
} }
.osd-window .level-bar { .osd-window .level-bar {
@ -3245,25 +3253,27 @@ StWidget.focused .app-well-app-running-dot {
} }
.login-dialog StEntry { .login-dialog StEntry {
selection-background-color: rgba(0, 0, 0, 0.2); selection-background-color: #0860f2;
selected-background-color: rgba(0, 0, 0, 0.2); selected-background-color: #0860f2;
selected-color: #0860f2; selected-color: white;
padding: 4px 8px; padding: 4px 8px;
min-height: 20px; min-height: 20px;
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(0, 0, 0, 0.1);
border-radius: 100px; border-radius: 100px;
border: 2px solid transparent; border: none;
box-shadow: none; box-shadow: none;
border-radius: 9999px; border-radius: 9999px;
} }
.login-dialog StEntry:focus { .login-dialog StEntry:focus {
border: 2px solid #4d8ef9; border: none;
box-shadow: none; background-color: rgba(0, 0, 0, 0.2);
} }
.login-dialog StEntry:insensitive { .login-dialog StEntry:insensitive {
border: none;
color: rgba(36, 36, 36, 0.45); color: rgba(36, 36, 36, 0.45);
background-color: rgba(0, 0, 0, 0.05);
} }
.login-dialog .modal-dialog-button-box { .login-dialog .modal-dialog-button-box {
@ -3346,8 +3356,8 @@ StWidget.focused .app-well-app-running-dot {
border-radius: 100px; border-radius: 100px;
width: 32px; width: 32px;
height: 32px; height: 32px;
border-color: rgba(245, 245, 245, 0.3); border: none;
background-color: rgba(245, 245, 245, 0.3); background-color: rgba(0, 0, 0, 0.1);
} }
.login-dialog .cancel-button StIcon, .login-dialog .cancel-button StIcon,
@ -3362,8 +3372,11 @@ StWidget.focused .app-well-app-running-dot {
.caps-lock-warning-label { .caps-lock-warning-label {
text-align: center; text-align: center;
padding-bottom: 8px; margin-bottom: 8px;
color: #F27835; padding: 2px 6px;
color: white;
background-color: #F27835;
border-radius: 9999px;
} }
.login-dialog-logo-bin { .login-dialog-logo-bin {

73
src/main/gtk-3.0/gtk-dark-solid.css
View File

@ -1,12 +1,3 @@
@keyframes switch_ripple_effect {
from {
background-image: radial-gradient(circle farthest-corner at center, #0860f2 0%, transparent 0%);
}
to {
background-image: radial-gradient(circle farthest-corner at center, #0860f2 100%, transparent 0%);
}
}
@keyframes header_ripple_effect { @keyframes header_ripple_effect {
from { from {
background-image: radial-gradient(circle farthest-corner at center, #373737 0%, transparent 0%); background-image: radial-gradient(circle farthest-corner at center, #373737 0%, transparent 0%);
@ -2717,64 +2708,66 @@ scrollbar.vertical slider {
min-height: 40px; min-height: 40px;
} }
label:disabled selection:checked { @keyframes switch_ripple_effect {
background-image: -gtk-scaled(url("assets/switch-active-insensitive.png"), url("assets/switch-active-insensitive@2.png")); from {
} background-image: linear-gradient(0deg, rgba(222, 222, 222, 0.25) 0%, rgba(222, 222, 222, 0.35) 100%), radial-gradient(circle farthest-corner at center, transparent 0%, transparent 0%);
}
label:disabled selection:not(:indeterminate) { to {
background-image: -gtk-scaled(url("assets/switch-insensitive-dark.png"), url("assets/switch-insensitive-dark@2.png")); background-image: linear-gradient(0deg, #357ef8 0%, #0860f2 100%), radial-gradient(circle farthest-corner at center, rgba(8, 96, 242, 0.75) 100%, rgba(8, 96, 242, 0) 0%);
} }
label:disabled selection:checked {
background-image: -gtk-scaled(url("assets/toggle-on-disabled.png"), url("assets/toggle-on-disabled@2.png"));
}
label:disabled selection:not(:indeterminate) {
background-image: -gtk-scaled(url("assets/toggle-off-disabled.png"), url("assets/toggle-off-disabled@2.png"));
} }
switch { switch {
transition: all 150ms cubic-bezier(0, 0, 0.2, 1); transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
border-radius: 50px; border-radius: 9999px;
background-color: rgba(222, 222, 222, 0.3); background-color: transparent;
background-clip: padding-box; background-clip: padding-box;
color: rgba(222, 222, 222, 0.3); color: transparent;
min-widt: 40px;
min-height: 24px;
font-size: 0; font-size: 0;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
background-image: linear-gradient(0deg, rgba(222, 222, 222, 0.25) 0%, rgba(222, 222, 222, 0.35) 100%), radial-gradient(circle farthest-corner at center, transparent 0%, transparent 0%);
} }
switch:disabled { switch:disabled {
color: rgba(222, 222, 222, 0.15); color: transparent;
background-color: rgba(222, 222, 222, 0.15); background-color: transparent;
background-image: linear-gradient(0deg, rgba(222, 222, 222, 0.1) 0%, rgba(222, 222, 222, 0.15) 100%);
} }
switch:checked { switch:checked {
animation: switch_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1); animation: switch_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
background-color: #0860f2; background-color: transparent;
color: rgba(255, 255, 255, 0.65); color: transparent;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
transition: background-image 0.3s, box-shadow 0;
background-image: linear-gradient(0deg, #357ef8 0%, #0860f2 100%), radial-gradient(circle farthest-corner at center, rgba(8, 96, 242, 0.75) 100%, transparent 0%);
} }
switch:checked:disabled, label:disabled selection:checked { switch:checked:disabled, label:disabled selection:checked {
background-color: rgba(8, 96, 242, 0.45); background-color: transparent;
color: rgba(255, 255, 255, 0.35); background-image: linear-gradient(0deg, #b0cdfc 0%, #7fadfb 100%);
color: transparent;
} }
switch slider { switch slider {
transition: all 150ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1), margin 0; transition: all 150ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1), margin 0;
min-width: 18px; min-width: 22px;
min-height: 18px; min-height: 22px;
margin: 2px 0 2px 2px; margin: 1px 0 1px 1px;
border-radius: 50px; border-radius: 9999px;
-gtk-outline-radius: 50px; -gtk-outline-radius: 9999px;
background-color: white; background-color: white;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15), 0 2px 3px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
} }
switch:hover slider { switch:hover slider {
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2), 0 3px 5px 0 rgba(0, 0, 0, 0.15); box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15), 0 2px 3px 0 rgba(0, 0, 0, 0.1);
} }
switch:checked slider { switch:checked slider {
margin: 2px 2px 2px 0; margin: 1px 1px 1px 0;
background-color: white; background-color: white;
} }

73
src/main/gtk-3.0/gtk-dark.css
View File

@ -1,12 +1,3 @@
@keyframes switch_ripple_effect {
from {
background-image: radial-gradient(circle farthest-corner at center, #0860f2 0%, transparent 0%);
}
to {
background-image: radial-gradient(circle farthest-corner at center, #0860f2 100%, transparent 0%);
}
}
@keyframes header_ripple_effect { @keyframes header_ripple_effect {
from { from {
background-image: radial-gradient(circle farthest-corner at center, #373737 0%, transparent 0%); background-image: radial-gradient(circle farthest-corner at center, #373737 0%, transparent 0%);
@ -2717,64 +2708,66 @@ scrollbar.vertical slider {
min-height: 40px; min-height: 40px;
} }
label:disabled selection:checked { @keyframes switch_ripple_effect {
background-image: -gtk-scaled(url("assets/switch-active-insensitive.png"), url("assets/switch-active-insensitive@2.png")); from {
} background-image: linear-gradient(0deg, rgba(222, 222, 222, 0.25) 0%, rgba(222, 222, 222, 0.35) 100%), radial-gradient(circle farthest-corner at center, transparent 0%, transparent 0%);
}
label:disabled selection:not(:indeterminate) { to {
background-image: -gtk-scaled(url("assets/switch-insensitive-dark.png"), url("assets/switch-insensitive-dark@2.png")); background-image: linear-gradient(0deg, #357ef8 0%, #0860f2 100%), radial-gradient(circle farthest-corner at center, rgba(8, 96, 242, 0.75) 100%, rgba(8, 96, 242, 0) 0%);
} }
label:disabled selection:checked {
background-image: -gtk-scaled(url("assets/toggle-on-disabled.png"), url("assets/toggle-on-disabled@2.png"));
}
label:disabled selection:not(:indeterminate) {
background-image: -gtk-scaled(url("assets/toggle-off-disabled.png"), url("assets/toggle-off-disabled@2.png"));
} }
switch { switch {
transition: all 150ms cubic-bezier(0, 0, 0.2, 1); transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
border-radius: 50px; border-radius: 9999px;
background-color: rgba(222, 222, 222, 0.3); background-color: transparent;
background-clip: padding-box; background-clip: padding-box;
color: rgba(222, 222, 222, 0.3); color: transparent;
min-widt: 40px;
min-height: 24px;
font-size: 0; font-size: 0;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
background-image: linear-gradient(0deg, rgba(222, 222, 222, 0.25) 0%, rgba(222, 222, 222, 0.35) 100%), radial-gradient(circle farthest-corner at center, transparent 0%, transparent 0%);
} }
switch:disabled { switch:disabled {
color: rgba(222, 222, 222, 0.15); color: transparent;
background-color: rgba(222, 222, 222, 0.15); background-color: transparent;
background-image: linear-gradient(0deg, rgba(222, 222, 222, 0.1) 0%, rgba(222, 222, 222, 0.15) 100%);
} }
switch:checked { switch:checked {
animation: switch_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1); animation: switch_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
background-color: #0860f2; background-color: transparent;
color: rgba(255, 255, 255, 0.65); color: transparent;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
transition: background-image 0.3s, box-shadow 0;
background-image: linear-gradient(0deg, #357ef8 0%, #0860f2 100%), radial-gradient(circle farthest-corner at center, rgba(8, 96, 242, 0.75) 100%, transparent 0%);
} }
switch:checked:disabled, label:disabled selection:checked { switch:checked:disabled, label:disabled selection:checked {
background-color: rgba(8, 96, 242, 0.45); background-color: transparent;
color: rgba(255, 255, 255, 0.35); background-image: linear-gradient(0deg, #b0cdfc 0%, #7fadfb 100%);
color: transparent;
} }
switch slider { switch slider {
transition: all 150ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1), margin 0; transition: all 150ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1), margin 0;
min-width: 18px; min-width: 22px;
min-height: 18px; min-height: 22px;
margin: 2px 0 2px 2px; margin: 1px 0 1px 1px;
border-radius: 50px; border-radius: 9999px;
-gtk-outline-radius: 50px; -gtk-outline-radius: 9999px;
background-color: white; background-color: white;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15), 0 2px 3px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
} }
switch:hover slider { switch:hover slider {
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2), 0 3px 5px 0 rgba(0, 0, 0, 0.15); box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15), 0 2px 3px 0 rgba(0, 0, 0, 0.1);
} }
switch:checked slider { switch:checked slider {
margin: 2px 2px 2px 0; margin: 1px 1px 1px 0;
background-color: white; background-color: white;
} }

73
src/main/gtk-3.0/gtk-light-solid.css
View File

@ -1,12 +1,3 @@
@keyframes switch_ripple_effect {
from {
background-image: radial-gradient(circle farthest-corner at center, #0860f2 0%, transparent 0%);
}
to {
background-image: radial-gradient(circle farthest-corner at center, #0860f2 100%, transparent 0%);
}
}
@keyframes header_ripple_effect { @keyframes header_ripple_effect {
from { from {
background-image: radial-gradient(circle farthest-corner at center, #ffffff 0%, transparent 0%); background-image: radial-gradient(circle farthest-corner at center, #ffffff 0%, transparent 0%);
@ -2729,64 +2720,66 @@ scrollbar.vertical slider {
min-height: 40px; min-height: 40px;
} }
label:disabled selection:checked { @keyframes switch_ripple_effect {
background-image: -gtk-scaled(url("assets/switch-active-insensitive.png"), url("assets/switch-active-insensitive@2.png")); from {
} background-image: linear-gradient(0deg, rgba(36, 36, 36, 0.25) 0%, rgba(36, 36, 36, 0.35) 100%), radial-gradient(circle farthest-corner at center, transparent 0%, transparent 0%);
}
label:disabled selection:not(:indeterminate) { to {
background-image: -gtk-scaled(url("assets/switch-insensitive.png"), url("assets/switch-insensitive@2.png")); background-image: linear-gradient(0deg, #357ef8 0%, #0860f2 100%), radial-gradient(circle farthest-corner at center, rgba(8, 96, 242, 0.75) 100%, rgba(8, 96, 242, 0) 0%);
} }
label:disabled selection:checked {
background-image: -gtk-scaled(url("assets/toggle-on-disabled.png"), url("assets/toggle-on-disabled@2.png"));
}
label:disabled selection:not(:indeterminate) {
background-image: -gtk-scaled(url("assets/toggle-off-disabled.png"), url("assets/toggle-off-disabled@2.png"));
} }
switch { switch {
transition: all 150ms cubic-bezier(0, 0, 0.2, 1); transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
border-radius: 50px; border-radius: 9999px;
background-color: rgba(36, 36, 36, 0.3); background-color: transparent;
background-clip: padding-box; background-clip: padding-box;
color: rgba(36, 36, 36, 0.3); color: transparent;
min-widt: 40px;
min-height: 24px;
font-size: 0; font-size: 0;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
background-image: linear-gradient(0deg, rgba(36, 36, 36, 0.25) 0%, rgba(36, 36, 36, 0.35) 100%), radial-gradient(circle farthest-corner at center, transparent 0%, transparent 0%);
} }
switch:disabled { switch:disabled {
color: rgba(36, 36, 36, 0.15); color: transparent;
background-color: rgba(36, 36, 36, 0.15); background-color: transparent;
background-image: linear-gradient(0deg, rgba(36, 36, 36, 0.1) 0%, rgba(36, 36, 36, 0.15) 100%);
} }
switch:checked { switch:checked {
animation: switch_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1); animation: switch_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
background-color: #0860f2; background-color: transparent;
color: rgba(255, 255, 255, 0.65); color: transparent;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
transition: background-image 0.3s, box-shadow 0;
background-image: linear-gradient(0deg, #357ef8 0%, #0860f2 100%), radial-gradient(circle farthest-corner at center, rgba(8, 96, 242, 0.75) 100%, transparent 0%);
} }
switch:checked:disabled, label:disabled selection:checked { switch:checked:disabled, label:disabled selection:checked {
background-color: rgba(8, 96, 242, 0.45); background-color: transparent;
color: rgba(255, 255, 255, 0.35); background-image: linear-gradient(0deg, #b0cdfc 0%, #7fadfb 100%);
color: transparent;
} }
switch slider { switch slider {
transition: all 150ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1), margin 0; transition: all 150ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1), margin 0;
min-width: 18px; min-width: 22px;
min-height: 18px; min-height: 22px;
margin: 2px 0 2px 2px; margin: 1px 0 1px 1px;
border-radius: 50px; border-radius: 9999px;
-gtk-outline-radius: 50px; -gtk-outline-radius: 9999px;
background-color: white; background-color: white;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15), 0 2px 3px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
} }
switch:hover slider { switch:hover slider {
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2), 0 3px 5px 0 rgba(0, 0, 0, 0.15); box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15), 0 2px 3px 0 rgba(0, 0, 0, 0.1);
} }
switch:checked slider { switch:checked slider {
margin: 2px 2px 2px 0; margin: 1px 1px 1px 0;
background-color: white; background-color: white;
} }

73
src/main/gtk-3.0/gtk-light.css
View File

@ -1,12 +1,3 @@
@keyframes switch_ripple_effect {
from {
background-image: radial-gradient(circle farthest-corner at center, #0860f2 0%, transparent 0%);
}
to {
background-image: radial-gradient(circle farthest-corner at center, #0860f2 100%, transparent 0%);
}
}
@keyframes header_ripple_effect { @keyframes header_ripple_effect {
from { from {
background-image: radial-gradient(circle farthest-corner at center, #ffffff 0%, transparent 0%); background-image: radial-gradient(circle farthest-corner at center, #ffffff 0%, transparent 0%);
@ -2729,64 +2720,66 @@ scrollbar.vertical slider {
min-height: 40px; min-height: 40px;
} }
label:disabled selection:checked { @keyframes switch_ripple_effect {
background-image: -gtk-scaled(url("assets/switch-active-insensitive.png"), url("assets/switch-active-insensitive@2.png")); from {
} background-image: linear-gradient(0deg, rgba(36, 36, 36, 0.25) 0%, rgba(36, 36, 36, 0.35) 100%), radial-gradient(circle farthest-corner at center, transparent 0%, transparent 0%);
}
label:disabled selection:not(:indeterminate) { to {
background-image: -gtk-scaled(url("assets/switch-insensitive.png"), url("assets/switch-insensitive@2.png")); background-image: linear-gradient(0deg, #357ef8 0%, #0860f2 100%), radial-gradient(circle farthest-corner at center, rgba(8, 96, 242, 0.75) 100%, rgba(8, 96, 242, 0) 0%);
} }
label:disabled selection:checked {
background-image: -gtk-scaled(url("assets/toggle-on-disabled.png"), url("assets/toggle-on-disabled@2.png"));
}
label:disabled selection:not(:indeterminate) {
background-image: -gtk-scaled(url("assets/toggle-off-disabled.png"), url("assets/toggle-off-disabled@2.png"));
} }
switch { switch {
transition: all 150ms cubic-bezier(0, 0, 0.2, 1); transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
border-radius: 50px; border-radius: 9999px;
background-color: rgba(36, 36, 36, 0.3); background-color: transparent;
background-clip: padding-box; background-clip: padding-box;
color: rgba(36, 36, 36, 0.3); color: transparent;
min-widt: 40px;
min-height: 24px;
font-size: 0; font-size: 0;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
background-image: linear-gradient(0deg, rgba(36, 36, 36, 0.25) 0%, rgba(36, 36, 36, 0.35) 100%), radial-gradient(circle farthest-corner at center, transparent 0%, transparent 0%);
} }
switch:disabled { switch:disabled {
color: rgba(36, 36, 36, 0.15); color: transparent;
background-color: rgba(36, 36, 36, 0.15); background-color: transparent;
background-image: linear-gradient(0deg, rgba(36, 36, 36, 0.1) 0%, rgba(36, 36, 36, 0.15) 100%);
} }
switch:checked { switch:checked {
animation: switch_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1); animation: switch_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
background-color: #0860f2; background-color: transparent;
color: rgba(255, 255, 255, 0.65); color: transparent;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
transition: background-image 0.3s, box-shadow 0;
background-image: linear-gradient(0deg, #357ef8 0%, #0860f2 100%), radial-gradient(circle farthest-corner at center, rgba(8, 96, 242, 0.75) 100%, transparent 0%);
} }
switch:checked:disabled, label:disabled selection:checked { switch:checked:disabled, label:disabled selection:checked {
background-color: rgba(8, 96, 242, 0.45); background-color: transparent;
color: rgba(255, 255, 255, 0.35); background-image: linear-gradient(0deg, #b0cdfc 0%, #7fadfb 100%);
color: transparent;
} }
switch slider { switch slider {
transition: all 150ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1), margin 0; transition: all 150ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1), margin 0;
min-width: 18px; min-width: 22px;
min-height: 18px; min-height: 22px;
margin: 2px 0 2px 2px; margin: 1px 0 1px 1px;
border-radius: 50px; border-radius: 9999px;
-gtk-outline-radius: 50px; -gtk-outline-radius: 9999px;
background-color: white; background-color: white;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15), 0 2px 3px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
} }
switch:hover slider { switch:hover slider {
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2), 0 3px 5px 0 rgba(0, 0, 0, 0.15); box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15), 0 2px 3px 0 rgba(0, 0, 0, 0.1);
} }
switch:checked slider { switch:checked slider {
margin: 2px 2px 2px 0; margin: 1px 1px 1px 0;
background-color: white; background-color: white;
} }

6
src/sass/_colors.scss
View File

@ -164,10 +164,10 @@ $button_active_image: linear-gradient(0deg, $button_active_bottom
$button_active_hover_image: linear-gradient(0deg, $button_active_hover_bottom 0%, $button_active_hover_top 100%); $button_active_hover_image: linear-gradient(0deg, $button_active_hover_bottom 0%, $button_active_hover_top 100%);
// WM colors // WM colors
$wm_border_light: 0 0 0 2px rgba(black, 0.03), 0 0 0 1px rgba(black, 0.12); $wm_outline_light: 0 0 0 2px rgba(black, 0.03), 0 0 0 1px rgba(black, 0.12);
$wm_border_dark: 0 0 0 2px rgba(black, 0.1), 0 0 0 1px rgba(black, 0.75); $wm_outline_dark: 0 0 0 2px rgba(black, 0.1), 0 0 0 1px rgba(black, 0.75);
$wm_shadow: if($variant=='light', rgba(black, 0.15), rgba(black, 0.35)); $wm_shadow: if($variant=='light', rgba(black, 0.15), rgba(black, 0.35));
$wm_border: if($variant=='light', $wm_border_light, $wm_border_dark); $wm_outline: if($variant=='light', $wm_outline_light, $wm_outline_dark);
// WM Buttons // WM Buttons

120
src/sass/gnome-shell/_common.scss
View File

@ -150,7 +150,7 @@ StScrollBar {
$slider_color: if($variant == 'light', white, white); $slider_color: if($variant == 'light', white, white);
$barlevel_bg_color: if($variant == 'light', rgba(black, 0.1), rgba(white, 0.1)); $barlevel_bg_color: if($variant == 'light', rgba(black, 0.1), rgba(white, 0.1));
$barlevel_active_bg_color: if($variant == 'light', white, rgba(white, 0.35)); $barlevel_active_bg_color: if($variant == 'light', white, rgba(white, 0.35));
$barlevel_boder_color: if($variant == 'light', rgba(black, 0.12), transparent); $barlevel_boder_color: if($variant == 'light', rgba(black, 0.15), transparent);
.slider { .slider {
height: 20px; height: 20px;
@ -756,12 +756,12 @@ $barlevel_boder_color: if($variant == 'light', rgba(black, 0.12), transparent);
spacing-columns: 1em; spacing-columns: 1em;
} }
/* Popovers/Menus */ // Popovers/Menus
$dialog_bg_color: if($variant == 'light', $bg_color, $base_color); $dialog_bg_color: if($variant == 'light', darken($bg_color, 0%), $base_color);
@if $trans=='true' { @if $trans=='true' {
$dialog_bg_color: if($variant == 'light', rgba($bg_color, 0.95), rgba($base_color, 0.95)); $dialog_bg_color: if($variant == 'light', rgba(darken($bg_color, 0%), 0.95), rgba($base_color, 0.95));
} }
$popop_menuitem_radius: $wm_radius - 4px; $popop_menuitem_radius: $wm_radius - 4px;
@ -775,56 +775,30 @@ $popop_menuitem_radius: $wm_radius - 4px;
.popup-menu { .popup-menu {
min-width: 12em; min-width: 12em;
color: $alt_fg_color; color: $alt_fg_color;
padding: 0 0; padding: 0 0 !important;
.popup-menu-arrow { } //defined globally in the TOP BAR .popup-menu-arrow { } //defined globally in the TOP BAR
.popup-sub-menu {
background-color: if($variant == 'light', rgba(white, 0.75), rgba(white, 0.15));
border-radius: 0 0 $popop_menuitem_radius $popop_menuitem_radius;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
.popup-menu-item {
margin: 0;
border-radius: $popop_menuitem_radius;
&:hover {
color: $selected_fg_color;
background-color: $selected_bg_color;
}
&:active {
color: $selected_fg_color;
background-color: mix($fg_color, $selected_bg_color, 5%);
}
&:not(:first-child):last-child {
border-radius: 0 0 $popop_menuitem_radius $popop_menuitem_radius;
}
}
}
.popup-menu-content { .popup-menu-content {
padding: 6px 0; padding: 6px 0 !important;
@extend %theme_dialogs; @extend %theme_dialogs;
box-shadow: 0 8px 16px 0 rgba(black, 0.25); box-shadow: 0 8px 16px 0 rgba(black, 0.25);
margin: 4px 12px 20px; border: 1px solid if($variant=='light', rgba(black, 0), rgba(black, 0.75));
margin: 4px 8px !important;
} }
.popup-menu-item { .popup-menu-item {
spacing: 12px; spacing: 12px;
padding: 6px; padding-top: 6px !important;
padding-bottom: 6px !important;
color: $alt_fg_color; color: $alt_fg_color;
text-shadow: none; text-shadow: none;
border-radius: $popop_menuitem_radius; border-radius: $popop_menuitem_radius;
margin: 0 6px; margin: 0 6px;
transition-duration: 0ms; transition-duration: 0ms;
&:ltr { padding-right: 1.5em; padding-left: 0; } &:ltr { padding-right: 2em !important; padding-left: 0 !important; }
&:rtl { padding-right: 0; padding-left: 1.5em; } &:rtl { padding-right: 0 !important; padding-left: 2em !important; }
&:checked { &:checked {
font-weight: normal; font-weight: normal;
@ -861,6 +835,34 @@ $popop_menuitem_radius: $wm_radius - 4px;
&:insensitive { color: $disabled_fg_color; } &:insensitive { color: $disabled_fg_color; }
} }
.popup-sub-menu {
background-color: if($variant == 'light', rgba(white, 0.75), rgba(white, 0.15));
border-radius: 0 0 $popop_menuitem_radius $popop_menuitem_radius;
border: none;
box-shadow: none;
margin: 0 6px;
transition-duration: 0ms;
.popup-menu-item {
margin: 0;
border-radius: $popop_menuitem_radius;
&:hover {
color: $selected_fg_color;
background-color: $selected_bg_color;
}
&:active {
color: $selected_fg_color;
background-color: mix($fg_color, $selected_bg_color, 5%);
}
&:not(:first-child):last-child {
border-radius: 0 0 $popop_menuitem_radius $popop_menuitem_radius;
}
}
}
.popup-inactive-menu-item { //all icons and other graphical elements .popup-inactive-menu-item { //all icons and other graphical elements
color: $alt_fg_color; color: $alt_fg_color;
@ -909,16 +911,21 @@ $popop_menuitem_radius: $wm_radius - 4px;
} }
.popup-separator-menu-item { .popup-separator-menu-item {
// height: 0; //not really the whole box margin: 0 0;
margin: 0;
padding: 0 0; padding: 0 0;
background: none; background: none;
border: none; border: none;
.popup-separator-menu-item-separator { .popup-separator-menu-item-separator {
height: 0; //not really the whole box height: 1px; //not really the whole box
background: none; margin: 0 0;
padding: 0; background-color: $borders_color;
padding: 0 0;
.popup-sub-menu & { //submenu separators
padding: 0 0;
margin: 0 64px 0 0;
}
} }
} }
@ -1023,7 +1030,7 @@ $popop_menuitem_radius: $wm_radius - 4px;
-barlevel-overdrive-color: $destructive_color; -barlevel-overdrive-color: $destructive_color;
-barlevel-overdrive-separator-width: 2px; -barlevel-overdrive-separator-width: 2px;
-barlevel-border-width: 0; -barlevel-border-width: 0;
-barlevel-border-color: rgba(black, 0.12); -barlevel-border-color: rgba(black, 0.15);
} }
.level-bar { .level-bar {
@ -2795,22 +2802,20 @@ StWidget.focused .app-well-app-running-dot {
max-width: 23em; max-width: 23em;
} }
$login_entry_bg: if($variant == 'dark', rgba(black, 0.1), rgba(white, 0.1));
.login-dialog { .login-dialog {
//reset //reset
border: none; border: none;
background-color: transparent; background-color: transparent;
StEntry { StEntry {
selection-background-color: $track_color; selection-background-color: $primary_color;
selected-background-color: $track_color; selected-background-color: $primary_color;
selected-color: $primary_color; selected-color: white;
padding: 4px 8px; padding: 4px 8px;
min-height: $small_size; min-height: $small_size;
@include entry(normal, $bc: $login_entry_bg); @include entry(flat-normal);
&:focus { @include entry(focus); } &:focus { @include entry(flat-focus); }
&:insensitive { @include entry(insensitive); } &:insensitive { @include entry(flat-insensitive); }
border-radius: $circular_radius; border-radius: $circular_radius;
} }
@ -2838,8 +2843,8 @@ $login_entry_bg: if($variant == 'dark', rgba(black, 0.1), rgba(white, 0.1));
border-radius: 100px; border-radius: 100px;
width: 32px; width: 32px;
height: 32px; height: 32px;
border-color: transparentize($bg_color, 0.7); border: none;
background-color: transparentize($bg_color, 0.7); background-color: rgba($borders_color, 0.1);
StIcon { icon-size: 16px; } StIcon { icon-size: 16px; }
} }
@ -2852,8 +2857,11 @@ $login_entry_bg: if($variant == 'dark', rgba(black, 0.1), rgba(white, 0.1));
// Caps-lock warning // Caps-lock warning
.caps-lock-warning-label { .caps-lock-warning-label {
text-align: center; text-align: center;
padding-bottom: 8px; margin-bottom: 8px;
color: $warning_color; padding: 2px 6px;
color: white;
background-color: $warning_color;
border-radius: $circular_radius;
} }
.login-dialog-logo-bin { padding: 24px 0px; } .login-dialog-logo-bin { padding: 24px 0px; }

24
src/sass/gnome-shell/_drawing.scss
View File

@ -112,8 +112,32 @@
} }
@if $t == insensitive { @if $t == insensitive {
background-color: rgba($bc, 0.05);
color: $disabled_fg_color; color: $disabled_fg_color;
} }
@if $t == flat-normal {
background-color: $bc;
border-radius: 100px;
border: none;
box-shadow: none;
}
@if $t == flat-hover {
background-color: $bc;
box-shadow: inset 0 0 0 1px rgba($borders_color, 0.05);
}
@if $t == flat-focus {
border: none;
background-color: rgba($bc, 0.2);
}
@if $t == flat-insensitive {
border: none;
color: $disabled_fg_color;
background-color: rgba($bc, 0.05);
}
} }
@mixin search_entry($t, $fc: $primary_color) { @mixin search_entry($t, $fc: $primary_color) {

176
src/sass/gtk/_common.scss
View File

@ -2429,166 +2429,80 @@ scrollbar {
// Switches // Switches
// //
%reset_switch { $switch_image: linear-gradient(0deg, rgba($fg_color, 0.25) 0%, rgba($fg_color, 0.35) 100%);
&, &:disabled { // specificity bump $switch_disabled_image: linear-gradient(0deg, rgba($fg_color, 0.1) 0%, rgba($fg_color, 0.15) 100%);
padding: 0; $switch_checked_image: linear-gradient(0deg, lighten($selected_bg_color, 10%) 0%, $selected_bg_color 100%);
border: none; $switch_checked_disabled_image: linear-gradient(0deg, lighten($selected_bg_color, 35%) 0%, lighten($selected_bg_color, 25%) 100%);
color: transparent; $switch_animation: switch_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
background: unset;
background-image: unset;
background-repeat: no-repeat;
background-position: right center;
box-shadow: none;
animation: none;
font-size: 0;
outline-color: transparent;
&:dir(rtl) { background-position: left center; } @keyframes switch_ripple_effect {
from {
background-image: $switch_image, radial-gradient(circle farthest-corner at center,
transparent 0%,
transparent 0%);
} }
}
%switch_pixmap { to {
// 'indeterminate' is the synthetic wildcard background-image: $switch_checked_image, radial-gradient(circle farthest-corner at center,
&:not(:indeterminate) { rgba($selected_bg_color, 0.75) 100%,
@extend %reset_switch; rgba($selected_bg_color, 0.0) 0%);
min-width: 40px;
min-height: 24px;
margin: 0;
background-size: 40px 24px;
transition: all 350ms $ease-out-quad;
slider:not(:indeterminate) {
@extend %reset_switch;
margin: 0;
background-size: 40px 24px;
}
// use ugly pixmaps
background-image: -gtk-scaled(
url("assets/switch.png"),
url("assets/switch@2.png"));
&:hover {
transition: all 350ms $ease-out-quad;
background-image: -gtk-scaled(
url("assets/switch-hover.png"),
url("assets/switch-hover@2.png"));
}
&:checked {
transition: all 350ms $ease-out-quad;
background-image: -gtk-scaled(
url("assets/switch-active.png"),
url("assets/switch-active@2.png"));
&:hover {
background-image: -gtk-scaled(
url("assets/switch-active-hover.png"),
url("assets/switch-active-hover@2.png"));
}
&:disabled,
&:disabled:hover {
background-image: -gtk-scaled(
url("assets/switch-active-insensitive.png"),
url("assets/switch-active-insensitive@2.png"));
}
}
&:disabled,
&:disabled:hover {
background-image: -gtk-scaled(
url("assets/switch-insensitive#{$asset_suffix}.png"),
url("assets/switch-insensitive#{$asset_suffix}@2.png"));
}
}
}
%switch_mac {
// 'indeterminate' is the synthetic wildcard
&:not(:indeterminate) {
@extend %reset_switch;
min-width: 50px;
min-height: 20px;
margin: 6px 2px;
background-size: 50px 20px;
transition: all 350ms $ease-out-quad;
slider:not(:indeterminate) {
@extend %reset_switch;
margin: 0;
background-size: 50px 20px;
}
// use ugly pixmaps
background-image: -gtk-scaled(url("assets/toggle-off.png"),
url("assets/toggle-off@2.png"));
&:checked {
transition: all 350ms $ease-out-quad;
background-image: -gtk-scaled(url("assets/toggle-on.png"),
url("assets/toggle-on@2.png"));
&:disabled {
background-image: -gtk-scaled(url("assets/toggle-on-disabled.png"),
url("assets/toggle-on-disabled@2.png"));
}
}
&:disabled {
background-image: -gtk-scaled(url("assets/toggle-off-disabled.png"),
url("assets/toggle-off-disabled@2.png"));
}
} }
} }
switch { switch {
transition: $longer_transition; transition: $longer_transition;
// margin: 6px 0; border-radius: $circular_radius;
border-radius: 50px; background-color: transparent;
background-color: rgba($fg_color, 0.3);
background-clip: padding-box; background-clip: padding-box;
color: rgba($fg_color, 0.3); color: transparent;
min-widt: 40px;
min-height: 24px;
font-size: 0; font-size: 0;
box-shadow: inset 0 1px 2px rgba(black, 0.1);
background-image: $switch_image, radial-gradient(circle farthest-corner at center, transparent 0%, transparent 0%);
&:disabled { &:disabled {
color: rgba($fg_color, 0.15); color: transparent;
background-color: rgba($fg_color, 0.15); background-color: transparent;
background-image: $switch_disabled_image;
} }
&:checked { &:checked {
animation: $switch_animation; animation: $switch_animation;
background-color: $selected_bg_color; background-color: transparent;
color: rgba(white, 0.65); color: transparent;
box-shadow: inset 0 1px 2px rgba(black, 0.15);
transition: background-image 0.3s, box-shadow 0;
background-image: $switch_checked_image, radial-gradient(circle farthest-corner at center, rgba($selected_bg_color, 0.75) 100%, transparent 0%);
&:disabled { &:disabled {
background-color: rgba($selected_bg_color, 0.45); background-color: transparent;
color: rgba(white, 0.35); background-image: $switch_checked_disabled_image;
color: transparent;
} }
} }
slider { slider {
transition: $longer_transition, $shadow_transition, margin 0; transition: $longer_transition, $shadow_transition, margin 0;
min-width: 18px; min-width: 22px;
min-height: 18px; min-height: 22px;
margin: 2px 0 2px 2px; margin: 1px 0 1px 1px;
border-radius: 50px; border-radius: $circular_radius;
-gtk-outline-radius: 50px; -gtk-outline-radius: $circular_radius;
background-color: white; background-color: white;
box-shadow: $shadow_5; box-shadow: 0 1px 2px rgba(black, 0.15);
} }
&:hover slider { box-shadow: $shadow_4; } &:hover slider { box-shadow: $shadow_5; }
&:checked slider { &:checked slider {
margin: 2px 2px 2px 0; margin: 1px 1px 1px 0;
background-color: $selected_fg_color; background-color: $selected_fg_color;
} }
&:disabled slider { @include entry(disabled); } &:disabled slider { @include entry(disabled); }
&:checked:disabled slider { animation: none; } &:checked:disabled slider { animation: none; }
// row & { @extend %switch_pixmap; }
} }
// //
@ -3946,7 +3860,7 @@ decoration {
box-shadow: 0 3px 3px 0 $wm_shadow, box-shadow: 0 3px 3px 0 $wm_shadow,
0 8px 8px 0 $wm_shadow, 0 8px 8px 0 $wm_shadow,
0 16px 16px 0 $wm_shadow, 0 16px 16px 0 $wm_shadow,
$wm_border; $wm_outline;
// this is used for the resize cursor area // this is used for the resize cursor area
margin: 6px; margin: 6px;
@ -3957,7 +3871,7 @@ decoration {
box-shadow: 0 3px 3px 0 $wm_shadow, box-shadow: 0 3px 3px 0 $wm_shadow,
0 8px 8px 0 transparent, 0 8px 8px 0 transparent,
0 16px 16px 0 transparent, 0 16px 16px 0 transparent,
$wm_border; $wm_outline;
} }
.maximized &, .maximized &,
@ -3968,7 +3882,7 @@ decoration {
.tiled-bottom &, .tiled-bottom &,
.tiled-left & { .tiled-left & {
border-radius: 0; border-radius: 0;
box-shadow: 0 3px 3px 0 $wm_shadow, $wm_border; box-shadow: 0 3px 3px 0 $wm_shadow, $wm_outline;
} }
.popup & { .popup & {
@ -3980,13 +3894,13 @@ decoration {
.ssd & { .ssd & {
margin: -5px; margin: -5px;
border-radius: $wm_radius $wm_radius 0 0; border-radius: $wm_radius $wm_radius 0 0;
box-shadow: 0 0 5px 0 $wm_shadow, $wm_border; box-shadow: 0 0 5px 0 $wm_shadow, $wm_outline;
&.maximized { border-radius: 0; } &.maximized { border-radius: 0; }
} }
.csd.popup & { .csd.popup & {
border-radius: $mn_radius; border-radius: $mn_radius;
box-shadow: 0 5px 8px rgba(0, 0, 0, 0.15), 0 8px 15px rgba(0, 0, 0, 0.08), $wm_border; box-shadow: 0 5px 8px rgba(0, 0, 0, 0.15), 0 8px 15px rgba(0, 0, 0, 0.08), $wm_outline;
} }
tooltip.csd & { tooltip.csd & {

16
src/sass/gtk/_drawing.scss
View File

@ -1,20 +1,4 @@
// Animations // Animations
$switch_animation: switch_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
@keyframes switch_ripple_effect {
from {
background-image: radial-gradient(circle farthest-corner at center,
$selected_bg_color 0%,
transparent 0%);
}
to {
background-image: radial-gradient(circle farthest-corner at center,
$selected_bg_color 100%,
transparent 0%);
}
}
@keyframes header_ripple_effect { @keyframes header_ripple_effect {
from { from {
background-image: radial-gradient(circle farthest-corner at center, background-image: radial-gradient(circle farthest-corner at center,