Merge branch 'gnome-45' into kali/master

This commit is contained in:
Daniel Ruiz de Alegría 2023-11-08 13:32:24 +01:00
commit dbbe1439f6
No known key found for this signature in database
GPG Key ID: 59667A77E8BFCB6C
24 changed files with 1799 additions and 1547 deletions

4
debian/control vendored
View File

@ -65,8 +65,8 @@ Depends:
plymouth-label,
${misc:Depends},
Breaks:
gnome-shell (>= 45~),
gnome-shell (<< 44~),
gnome-shell (>= 46~),
gnome-shell (<< 45~),
kali-defaults (<< 2019.4.0),
kali-desktop-xfce (<< 2020.2.18),
kali-menu (<< 2019.4.4),

View File

@ -1,84 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="76"
height="27"
id="svg11252"
version="1.1">
<defs
id="defs11254">
<radialGradient
xlink:href="#linearGradient39563-4-2"
id="radialGradient68155-2-3"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(1,0,0,0.3486842,0,317.8421)"
cx="49"
cy="488"
fx="49"
fy="488"
r="38" />
<linearGradient
id="linearGradient39563-4-2">
<stop
style="stop-color:#ffffff;stop-opacity:1;"
offset="0"
id="stop39565-1-4" />
<stop
style="stop-color:#ffffff;stop-opacity:0;"
offset="1"
id="stop39567-7-9" />
</linearGradient>
<radialGradient
xlink:href="#linearGradient39573-6-1"
id="radialGradient68157-0-8"
gradientUnits="userSpaceOnUse"
cx="50.5"
cy="487.5"
fx="50.5"
fy="487.5"
r="10.5" />
<linearGradient
id="linearGradient39573-6-1">
<stop
style="stop-color:#ffffff;stop-opacity:1;"
offset="0"
id="stop39575-5-6" />
<stop
style="stop-color:#ffffff;stop-opacity:0;"
offset="1"
id="stop39577-1-2" />
</linearGradient>
</defs>
<g
id="layer1"
transform="translate(-337,-518.86218)">
<g
id="g99967"
style="display:inline"
transform="translate(326,44.862171)">
<rect
style="opacity:0.49375;color:#000000;fill:url(#radialGradient68155-2-3);fill-opacity:1;stroke:none;stroke-width:1;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
id="rect99969"
width="76"
height="2"
x="11"
y="487"
rx="0"
ry="0" />
<path
style="opacity:0.43125;color:#000000;fill:url(#radialGradient68157-0-8);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
id="path99971"
d="M 61,487.5 C 61,493.29899 56.29899,498 50.5,498 44.70101,498 40,493.29899 40,487.5 40,481.70101 44.70101,477 50.5,477 c 5.79899,0 10.5,4.70101 10.5,10.5 z"
transform="matrix(1.2857143,0,0,1.2857143,-14.428572,-139.28571)" />
<path
transform="matrix(0.43589747,0,0,0.43589747,28.487179,275)"
d="M 61,487.5 C 61,493.29899 56.29899,498 50.5,498 44.70101,498 40,493.29899 40,487.5 40,481.70101 44.70101,477 50.5,477 c 5.79899,0 10.5,4.70101 10.5,10.5 z"
id="path99973"
style="color:#000000;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate" />
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 2.9 KiB

View File

@ -1 +0,0 @@
<svg version="1.1" viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg"><defs><filter id="a" x="-.12" y="-.12" width="1.24" height="1.24" style="color-interpolation-filters:sRGB"><feGaussianBlur stdDeviation="1.7"/></filter></defs><path d="m5 7v12h12v-12zm22 0v12h12v-12zm-19 3h6v6h-6zm22 0h6v6h-6zm-25 19v12h12v-12zm22 0v12h12v-12zm-19 3h6v6h-6zm22 0h6v6h-6z" style="filter:url(#a);opacity:.5;stroke-width:.5625"/><path d="m5 5v12h12v-12h-12zm22 0v12h12v-12h-12zm-19 3h6v6h-6v-6zm22 0h6v6h-6v-6zm-25 19v12h12v-12h-12zm22 0v12h12v-12h-12zm-19 3h6v6h-6v-6zm22 0h6v6h-6v-6z" style="fill:#fff;stroke-width:.5625"/></svg>

Before

Width:  |  Height:  |  Size: 620 B

View File

@ -1 +0,0 @@
<svg version="1.1" viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg"><defs><filter id="a" x="-.12" y="-.12" width="1.24" height="1.24" style="color-interpolation-filters:sRGB"><feGaussianBlur stdDeviation="1.7"/></filter></defs><path d="m5 7v12h12v-12zm22 0v12h12v-12zm-19 3h6v6h-6zm22 0h6v6h-6zm-25 19v12h12v-12zm22 0v12h12v-12zm-19 3h6v6h-6zm22 0h6v6h-6z" style="filter:url(#a);opacity:.5;stroke-width:.5625"/><path d="m5 5v12h12v-12h-12zm22 0v12h12v-12h-12zm-19 3h6v6h-6v-6zm22 0h6v6h-6v-6zm-25 19v12h12v-12h-12zm22 0v12h12v-12h-12zm-19 3h6v6h-6v-6zm22 0h6v6h-6v-6z" style="stroke-width:.5625"/></svg>

Before

Width:  |  Height:  |  Size: 610 B

View File

@ -32,84 +32,120 @@ stage {
text-align: center;
color: inherit; }
#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .calendar .calendar-day.calendar-today, .calendar .calendar-day, .calendar .calendar-month-header .pager-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
border-radius: 8px;
border-style: solid;
border-width: 1px;
font-weight: bold;
padding: 3px 24px; }
.app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
.app-folder-dialog .folder-name-container .edit-folder-button, .button, .calendar .calendar-day.calendar-today, .calendar .calendar-day, .calendar .calendar-month-header .pager-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
transition-duration: 100ms;
color: #eeeeec;
background-color: #35373f; }
.app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .icon-button:focus, .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .close-button:focus {
.app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .calendar .calendar-day:focus, .calendar .calendar-month-header .pager-button:focus, .icon-button:focus, .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .close-button:focus {
transition-duration: 100ms;
color: #eeeeec;
background-color: #343d52;
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; }
.app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .icon-button:focus:hover, .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .close-button:focus:hover {
.app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .calendar .calendar-day:focus:hover, .calendar .calendar-month-header .pager-button:focus:hover, .icon-button:focus:hover, .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .close-button:focus:hover {
background-color: #3a445a;
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; }
.app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .icon-button:focus:active, .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .close-button:focus:active {
.app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .calendar .calendar-day:focus:active, .calendar .calendar-month-header .pager-button:focus:active, .icon-button:focus:active, .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .close-button:focus:active {
background-color: #404a61;
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; }
.app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .icon-button:hover, .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .close-button:hover {
.app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .calendar .calendar-day:hover, .calendar .calendar-month-header .pager-button:hover, .icon-button:hover, .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .close-button:hover {
transition-duration: 100ms;
color: #eeeeec;
background-color: #3c3e47; }
.app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .icon-button:insensitive, .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .close-button:insensitive {
.app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .calendar .calendar-day:insensitive, .calendar .calendar-month-header .pager-button:insensitive, .icon-button:insensitive, .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .close-button:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05); }
.app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .icon-button:selected, .login-dialog-button.cancel-button:selected, .login-dialog-button.switch-user-button:selected, .login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .close-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .icon-button:active, .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active, .background-app-item .close-button:active {
.app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .calendar .calendar-day:selected, .calendar .calendar-month-header .pager-button:selected, .icon-button:selected, .login-dialog-button.cancel-button:selected, .login-dialog-button.switch-user-button:selected, .login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .close-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .calendar .calendar-day:active, .calendar .calendar-month-header .pager-button:active, .icon-button:active, .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active, .background-app-item .close-button:active {
transition-duration: 100ms;
color: #eeeeec;
background-color: #434650; }
.app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .icon-button:checked, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .close-button:checked {
.app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .calendar .calendar-day:checked, .calendar .calendar-month-header .pager-button:checked, .icon-button:checked, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .close-button:checked {
transition-duration: 100ms;
color: #eeeeec;
background-color: #4a4d58; }
.app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .icon-button:checked:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .close-button:checked:hover {
.app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .calendar .calendar-day:checked:hover, .calendar .calendar-month-header .pager-button:checked:hover, .icon-button:checked:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .close-button:checked:hover {
background-color: #515460; }
.app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .icon-button:checked:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .close-button:checked:active {
.app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .calendar .calendar-day:checked:active, .calendar .calendar-month-header .pager-button:checked:active, .icon-button:checked:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .close-button:checked:active {
background-color: #585b69; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button, .flat.button, .flat.icon-button, .flat.login-dialog-button.cancel-button, .flat.login-dialog-button.switch-user-button, .flat.login-dialog-button.login-dialog-session-list-button, .background-app-item .flat.close-button {
.app-folder-dialog .folder-name-container .default.edit-folder-button, .default.button, .calendar .default.calendar-day, .calendar .calendar-day.calendar-today, .calendar .calendar-month-header .default.pager-button, .default.icon-button, .default.login-dialog-button.cancel-button, .default.login-dialog-button.switch-user-button, .default.login-dialog-button.login-dialog-session-list-button, .background-app-item .default.close-button {
transition-duration: 100ms;
background-color: #2777ff;
color: #ffffff; }
.app-folder-dialog .folder-name-container .default.edit-folder-button:focus, .default.button:focus, .calendar .default.calendar-day:focus, .calendar .calendar-day.calendar-today:focus, .calendar .calendar-month-header .default.pager-button:focus, .default.icon-button:focus, .default.login-dialog-button.cancel-button:focus, .default.login-dialog-button.switch-user-button:focus, .default.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .default.close-button:focus {
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.6) !important; }
.app-folder-dialog .folder-name-container .default.edit-folder-button:hover, .default.button:hover, .calendar .default.calendar-day:hover, .calendar .calendar-day.calendar-today:hover, .calendar .calendar-month-header .default.pager-button:hover, .default.icon-button:hover, .default.login-dialog-button.cancel-button:hover, .default.login-dialog-button.switch-user-button:hover, .default.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .default.close-button:hover, .app-folder-dialog .folder-name-container .default.edit-folder-button:focus, .default.button:focus, .calendar .default.calendar-day:focus, .calendar .calendar-day.calendar-today:focus, .calendar .calendar-month-header .default.pager-button:focus, .default.icon-button:focus, .default.login-dialog-button.cancel-button:focus, .default.login-dialog-button.switch-user-button:focus, .default.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .default.close-button:focus {
background-color: #4187ff;
color: white; }
.app-folder-dialog .folder-name-container .default.edit-folder-button:active, .default.button:active, .calendar .default.calendar-day:active, .calendar .calendar-day.calendar-today:active, .calendar .calendar-month-header .default.pager-button:active, .default.icon-button:active, .default.login-dialog-button.cancel-button:active, .default.login-dialog-button.switch-user-button:active, .default.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .default.close-button:active {
background-color: #0361ff;
color: #ededed; }
.app-folder-dialog .folder-name-container .default.edit-folder-button:insensitive, .default.button:insensitive, .calendar .default.calendar-day:insensitive, .calendar .calendar-day.calendar-today:insensitive, .calendar .calendar-month-header .default.pager-button:insensitive, .default.icon-button:insensitive, .default.login-dialog-button.cancel-button:insensitive, .default.login-dialog-button.switch-user-button:insensitive, .default.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .default.close-button:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: rgba(39, 119, 255, 0.5);
color: rgba(255, 255, 255, 0.5); }
.app-folder-dialog .folder-name-container .flat.edit-folder-button, .calendar .app-folder-dialog .folder-name-container .calendar-day.edit-folder-button, .app-folder-dialog .folder-name-container .calendar .calendar-day.edit-folder-button, .flat.button, .calendar .button.calendar-day, .calendar .calendar-day.calendar-today, .calendar .flat.calendar-day, .calendar .calendar-day, .calendar .calendar-month-header .pager-button, .flat.icon-button, .flat.login-dialog-button.cancel-button, .flat.login-dialog-button.switch-user-button, .flat.login-dialog-button.login-dialog-session-list-button, .background-app-item .flat.close-button, .calendar .icon-button.calendar-day, .calendar .calendar-day.login-dialog-button.cancel-button, .calendar .calendar-day.login-dialog-button.switch-user-button, .calendar .calendar-day.login-dialog-button.login-dialog-session-list-button, .calendar .background-app-item .calendar-day.close-button, .background-app-item .calendar .calendar-day.close-button {
transition-duration: 100ms;
color: #eeeeec;
background-color: #35373f;
background-color: transparent; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .flat.icon-button:focus, .flat.login-dialog-button.cancel-button:focus, .flat.login-dialog-button.switch-user-button:focus, .flat.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .flat.close-button:focus {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .calendar .calendar-day:focus, .calendar .calendar-month-header .pager-button:focus, .flat.icon-button:focus, .flat.login-dialog-button.cancel-button:focus, .flat.login-dialog-button.switch-user-button:focus, .flat.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .flat.close-button:focus {
transition-duration: 100ms;
color: #eeeeec;
background-color: #343d52;
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .flat.icon-button:focus:hover, .flat.login-dialog-button.cancel-button:focus:hover, .flat.login-dialog-button.switch-user-button:focus:hover, .flat.login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .flat.close-button:focus:hover {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .calendar .calendar-day:focus:hover, .calendar .calendar-month-header .pager-button:focus:hover, .flat.icon-button:focus:hover, .flat.login-dialog-button.cancel-button:focus:hover, .flat.login-dialog-button.switch-user-button:focus:hover, .flat.login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .flat.close-button:focus:hover {
background-color: #3a445a;
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .flat.icon-button:focus:active, .flat.login-dialog-button.cancel-button:focus:active, .flat.login-dialog-button.switch-user-button:focus:active, .flat.login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .flat.close-button:focus:active {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .calendar .calendar-day:focus:active, .calendar .calendar-month-header .pager-button:focus:active, .flat.icon-button:focus:active, .flat.login-dialog-button.cancel-button:focus:active, .flat.login-dialog-button.switch-user-button:focus:active, .flat.login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .flat.close-button:focus:active {
background-color: #404a61;
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .flat.icon-button:hover, .flat.login-dialog-button.cancel-button:hover, .flat.login-dialog-button.switch-user-button:hover, .flat.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .flat.close-button:hover {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .calendar .calendar-day:hover, .calendar .calendar-month-header .pager-button:hover, .flat.icon-button:hover, .flat.login-dialog-button.cancel-button:hover, .flat.login-dialog-button.switch-user-button:hover, .flat.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .flat.close-button:hover {
transition-duration: 100ms;
color: #eeeeec;
background-color: #3c3e47; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .flat.icon-button:insensitive, .flat.login-dialog-button.cancel-button:insensitive, .flat.login-dialog-button.switch-user-button:insensitive, .flat.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .flat.close-button:insensitive {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .calendar .calendar-day:insensitive, .calendar .calendar-month-header .pager-button:insensitive, .flat.icon-button:insensitive, .flat.login-dialog-button.cancel-button:insensitive, .flat.login-dialog-button.switch-user-button:insensitive, .flat.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .flat.close-button:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05); }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .flat.icon-button:selected, .flat.login-dialog-button.cancel-button:selected, .flat.login-dialog-button.switch-user-button:selected, .flat.login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .flat.close-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .flat.icon-button:active, .flat.login-dialog-button.cancel-button:active, .flat.login-dialog-button.switch-user-button:active, .flat.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .flat.close-button:active {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .calendar .calendar-day:selected, .calendar .calendar-month-header .pager-button:selected, .flat.icon-button:selected, .flat.login-dialog-button.cancel-button:selected, .flat.login-dialog-button.switch-user-button:selected, .flat.login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .flat.close-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .calendar .calendar-day:active, .calendar .calendar-month-header .pager-button:active, .flat.icon-button:active, .flat.login-dialog-button.cancel-button:active, .flat.login-dialog-button.switch-user-button:active, .flat.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .flat.close-button:active {
transition-duration: 100ms;
color: #eeeeec;
background-color: #434650; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .flat.icon-button:checked, .flat.login-dialog-button.cancel-button:checked, .flat.login-dialog-button.switch-user-button:checked, .flat.login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .flat.close-button:checked {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .calendar .calendar-day:checked, .calendar .calendar-month-header .pager-button:checked, .flat.icon-button:checked, .flat.login-dialog-button.cancel-button:checked, .flat.login-dialog-button.switch-user-button:checked, .flat.login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .flat.close-button:checked {
transition-duration: 100ms;
color: #eeeeec;
background-color: #4a4d58; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .flat.icon-button:checked:hover, .flat.login-dialog-button.cancel-button:checked:hover, .flat.login-dialog-button.switch-user-button:checked:hover, .flat.login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .flat.close-button:checked:hover {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .calendar .calendar-day:checked:hover, .calendar .calendar-month-header .pager-button:checked:hover, .flat.icon-button:checked:hover, .flat.login-dialog-button.cancel-button:checked:hover, .flat.login-dialog-button.switch-user-button:checked:hover, .flat.login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .flat.close-button:checked:hover {
background-color: #515460; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .flat.icon-button:checked:active, .flat.login-dialog-button.cancel-button:checked:active, .flat.login-dialog-button.switch-user-button:checked:active, .flat.login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .flat.close-button:checked:active {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .calendar .calendar-day:checked:active, .calendar .calendar-month-header .pager-button:checked:active, .flat.icon-button:checked:active, .flat.login-dialog-button.cancel-button:checked:active, .flat.login-dialog-button.switch-user-button:checked:active, .flat.login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .flat.close-button:checked:active {
background-color: #585b69; }
.app-folder-dialog .folder-name-container .flat.default.edit-folder-button, .flat.default.button, .calendar .default.calendar-day, .calendar .calendar-day.calendar-today, .calendar .calendar-month-header .default.pager-button, .default.icon-button, .default.login-dialog-button.cancel-button, .default.login-dialog-button.switch-user-button, .default.login-dialog-button.login-dialog-session-list-button, .background-app-item .default.close-button {
transition-duration: 100ms;
background-color: #2777ff;
color: #ffffff; }
.app-folder-dialog .folder-name-container .flat.default.edit-folder-button:focus, .flat.default.button:focus, .calendar .default.calendar-day:focus, .calendar .calendar-day.calendar-today:focus, .calendar .calendar-month-header .default.pager-button:focus, .default.icon-button:focus, .default.login-dialog-button.cancel-button:focus, .default.login-dialog-button.switch-user-button:focus, .default.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .default.close-button:focus {
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.6) !important; }
.app-folder-dialog .folder-name-container .flat.default.edit-folder-button:hover, .flat.default.button:hover, .calendar .default.calendar-day:hover, .calendar .calendar-day.calendar-today:hover, .calendar .calendar-month-header .default.pager-button:hover, .default.icon-button:hover, .default.login-dialog-button.cancel-button:hover, .default.login-dialog-button.switch-user-button:hover, .default.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .default.close-button:hover, .app-folder-dialog .folder-name-container .flat.default.edit-folder-button:focus, .flat.default.button:focus, .calendar .default.calendar-day:focus, .calendar .calendar-day.calendar-today:focus, .calendar .calendar-month-header .default.pager-button:focus, .default.icon-button:focus, .default.login-dialog-button.cancel-button:focus, .default.login-dialog-button.switch-user-button:focus, .default.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .default.close-button:focus {
background-color: #4187ff;
color: white; }
.app-folder-dialog .folder-name-container .flat.default.edit-folder-button:active, .flat.default.button:active, .calendar .default.calendar-day:active, .calendar .calendar-day.calendar-today:active, .calendar .calendar-month-header .default.pager-button:active, .default.icon-button:active, .default.login-dialog-button.cancel-button:active, .default.login-dialog-button.switch-user-button:active, .default.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .default.close-button:active {
background-color: #0361ff;
color: #ededed; }
.app-folder-dialog .folder-name-container .flat.default.edit-folder-button:insensitive, .flat.default.button:insensitive, .calendar .default.calendar-day:insensitive, .calendar .calendar-day.calendar-today:insensitive, .calendar .calendar-month-header .default.pager-button:insensitive, .default.icon-button:insensitive, .default.login-dialog-button.cancel-button:insensitive, .default.login-dialog-button.switch-user-button:insensitive, .default.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .default.close-button:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: rgba(39, 119, 255, 0.5);
color: rgba(255, 255, 255, 0.5); }
.login-dialog-prompt-entry, .search-entry, .lg-dialog StEntry, StEntry {
border-radius: 8px;
@ -192,8 +228,9 @@ StEntry {
margin-left: 0 !important;
margin-right: 0 !important; }
.dash-label, .window-caption {
.dash-label, .window-caption, .screenshot-ui-tooltip {
background-color: rgba(0, 0, 0, 0.9);
border: 1px solid rgba(255, 255, 255, 0.1);
color: white;
border-radius: 99px;
padding: 6px 12px;
@ -216,7 +253,7 @@ StEntry {
font-weight: 700;
font-size: 13pt; }
.lg-extension-name, .background-app-item .title, .osd-window, .dialog-list .dialog-list-title, .message-list-controls, .weather-button .weather-forecast-temp, .weather-button .weather-header, .world-clocks-button .world-clocks-time, .world-clocks-button .world-clocks-header, .events-button .events-title, .calendar .calendar-month-header .calendar-month-label, .datemenu-today-button .day-label, .popup-menu-ornament {
.lg-extension-name, .background-app-item .title, .osd-window, .dialog-list .dialog-list-title, .message-list-controls, .weather-button .weather-forecast-temp, .weather-button .weather-header, .world-clocks-button .world-clocks-time, .world-clocks-button .world-clocks-header, .events-button .events-title, .calendar .calendar-month-header .calendar-month-label, .datemenu-today-button .day-label {
font-weight: 700;
font-size: 11pt; }
@ -230,11 +267,11 @@ StEntry {
font-weight: 400;
font-size: 9pt; }
.calendar .calendar-day-base.calendar-day-heading, .calendar .calendar-day-base {
.calendar .calendar-day {
font-weight: 400;
font-size: 8pt; }
.unlock-dialog-clock .unlock-dialog-clock-time, #panel, .weather-button .weather-forecast-time, .world-clocks-button .world-clocks-timezone, .world-clocks-button .world-clocks-time, .events-button .event-time, .calendar .calendar-day-base {
.unlock-dialog-clock .unlock-dialog-clock-time, #panel, .weather-button .weather-forecast-time, .world-clocks-button .world-clocks-timezone, .world-clocks-button .world-clocks-time, .events-button .event-time, .calendar .calendar-day {
font-feature-settings: "tnum"; }
/* OSD Elements */
@ -267,7 +304,7 @@ StEntry {
#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button {
transition-duration: 100ms;
color: white;
background-color: #424651; }
background-color: rgba(255, 255, 255, 0.1); }
#LookingGlassDialog .notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .lg-toolbar-button:insensitive, .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive {
transition-duration: 100ms;
color: rgba(255, 255, 255, 0.5);
@ -275,30 +312,30 @@ StEntry {
#LookingGlassDialog .notebook-tab:focus, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus, .screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus {
transition-duration: 100ms;
color: white;
background-color: #3f4b62;
background-color: rgba(108, 163, 255, 0.19);
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; }
#LookingGlassDialog .notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:hover, .screenshot-ui-show-pointer-button:focus:hover, .screenshot-ui-type-button:focus:hover {
background-color: #45516a;
background-color: rgba(108, 163, 255, 0.19);
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; }
#LookingGlassDialog .notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:active, .screenshot-ui-show-pointer-button:focus:active, .screenshot-ui-type-button:focus:active {
background-color: #4c5872;
background-color: rgba(108, 163, 255, 0.19);
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; }
#LookingGlassDialog .notebook-tab:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:hover, .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover {
transition-duration: 100ms;
color: white;
background-color: #494d59; }
background-color: rgba(255, 255, 255, 0.1); }
#LookingGlassDialog .notebook-tab:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:active, .screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active {
transition-duration: 100ms;
color: white;
background-color: #505562; }
background-color: rgba(255, 255, 255, 0.1); }
#LookingGlassDialog .notebook-tab:outlined, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined, .screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, #LookingGlassDialog .notebook-tab:checked, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked {
transition-duration: 100ms;
color: white;
background-color: #575c6a; }
background-color: rgba(255, 255, 255, 0.1); }
#LookingGlassDialog .notebook-tab:outlined:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:hover, .screenshot-ui-show-pointer-button:outlined:hover, .screenshot-ui-type-button:outlined:hover, #LookingGlassDialog .notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:hover, .screenshot-ui-show-pointer-button:checked:hover, .screenshot-ui-type-button:checked:hover {
background-color: #5d6373; }
background-color: rgba(255, 255, 255, 0.1); }
#LookingGlassDialog .notebook-tab:outlined:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:active, .screenshot-ui-show-pointer-button:outlined:active, .screenshot-ui-type-button:outlined:active, #LookingGlassDialog .notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:active, .screenshot-ui-show-pointer-button:checked:active, .screenshot-ui-type-button:checked:active {
background-color: #646a7b; }
background-color: rgba(255, 255, 255, 0.1); }
.screenshot-ui-show-pointer-button, .screenshot-ui-type-button {
transition-duration: 100ms;
@ -309,8 +346,7 @@ StEntry {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
.screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive {
transition-duration: 100ms;
background-color: transparent;
@ -320,8 +356,7 @@ StEntry {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
/* System Elements */
.login-dialog-prompt-entry, .search-entry {
@ -405,7 +440,7 @@ StEntry StLabel.hint-text {
margin-left: 2px; }
/* Buttons */
.button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
.button, .calendar .calendar-day.calendar-today, .calendar .calendar-day, .calendar .calendar-month-header .pager-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
min-height: 22px; }
.icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
@ -512,16 +547,11 @@ StScrollBar {
box-shadow: none;
box-shadow: none !important;
border-radius: 12px; }
.popup-menu-item:ltr {
padding-left: 6px; }
.popup-menu-item:rtl {
padding-right: 6px; }
.popup-menu-item:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
.popup-menu-item:focus, .popup-menu-item:hover {
transition-duration: 100ms;
color: #eeeeec;
@ -545,6 +575,12 @@ StScrollBar {
.popup-menu-item .toggle-switch:rtl {
margin-right: 4px; }
.popup-ornamented-menu-item:ltr {
padding-left: 6px; }
.popup-ornamented-menu-item:rtl {
padding-right: 6px; }
.popup-inactive-menu-item {
color: #eeeeec; }
.popup-inactive-menu-item:insensitive {
@ -557,8 +593,6 @@ StScrollBar {
.popup-sub-menu {
border-radius: 0 0 13px 13px;
margin-bottom: 6px; }
.popup-sub-menu .popup-menu-ornament {
min-width: 1.09em !important; }
.popup-sub-menu .popup-menu-item {
border-radius: 0;
font-weight: normal;
@ -569,10 +603,6 @@ StScrollBar {
color: #eeeeec;
background-color: #4d515f;
border-top-width: 0; }
.popup-sub-menu .popup-menu-item:ltr {
padding-left: 6px; }
.popup-sub-menu .popup-menu-item:rtl {
padding-right: 6px; }
.popup-sub-menu .popup-menu-item:focus, .popup-sub-menu .popup-menu-item:hover {
transition-duration: 100ms;
color: #eeeeec;
@ -598,20 +628,14 @@ StScrollBar {
border-radius: 0 0 12px 12px; }
.popup-menu-ornament {
width: 1.2em;
text-align: center !important; }
.popup-menu-ornament:ltr {
text-align: right; }
.popup-menu-ornament:rtl {
text-align: left; }
icon-size: 1.09em !important;
width: 1.09em; }
.popup-separator-menu-item {
border: none !important; }
.popup-separator-menu-item .popup-separator-menu-item-separator {
height: 1px;
background-color: #0d0e11; }
.popup-separator-menu-item .popup-menu-ornament {
width: 0 !important; }
.popup-sub-menu .popup-separator-menu-item {
background-color: transparent; }
.popup-sub-menu .popup-separator-menu-item:ltr {
@ -627,8 +651,6 @@ StScrollBar {
.app-menu {
max-width: 27.25em; }
.app-menu .popup-menu-ornament {
width: 0 !important; }
.app-menu .popup-inactive-menu-item:first-child > StLabel:ltr {
margin-right: 8px; }
.app-menu .popup-inactive-menu-item:first-child > StLabel:rtl {
@ -661,8 +683,7 @@ StScrollBar {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
.datemenu-today-button:hover {
transition-duration: 100ms;
color: #eeeeec;
@ -702,8 +723,7 @@ StScrollBar {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
.calendar:hover {
transition-duration: 100ms;
color: #eeeeec;
@ -734,67 +754,44 @@ StScrollBar {
.calendar .calendar-month-header .calendar-month-label {
padding: 8px 0; }
.calendar .calendar-month-header .pager-button {
background-color: transparent;
padding: 0 !important;
height: 32px;
width: 32px;
margin: 2px;
border-radius: 8px; }
.calendar .calendar-month-header .pager-button:hover, .calendar .calendar-month-header .pager-button:focus {
background-color: #383d4b; }
.calendar .calendar-month-header .pager-button:active {
background-color: #3d4251; }
.calendar .calendar-day-base {
text-align: center;
margin: 2px;
padding: 0 !important;
border-radius: 8px;
transition-duration: 100ms; }
.calendar .calendar-day {
border-radius: 99px;
height: 3em !important;
width: 3em !important;
border-radius: 99px;
margin: 2px;
padding: 0 !important;
font-weight: 600;
text-align: center;
transition-duration: 100ms; }
.calendar .calendar-day-base:hover {
background-color: #383d4b; }
.calendar .calendar-day-base:focus {
background-color: #243658;
color: inherit;
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
.calendar .calendar-day-base:active, .calendar .calendar-day-base:selected {
color: white;
background-color: #3d4251; }
.calendar .calendar-day-base:active:focus, .calendar .calendar-day-base:selected:focus {
background-color: #384c74; }
.calendar .calendar-day-base.calendar-day-heading {
.calendar .calendar-day.calendar-day-heading {
background-color: transparent;
color: #888a8d;
padding-top: 6px;
height: 1.1em !important;
font-weight: 600; }
.calendar .calendar-day {
font-weight: 600; }
.calendar .calendar-nonwork-day {
color: #888a8d; }
.calendar .calendar-other-month-day {
color: rgba(238, 238, 236, 0.5); }
.calendar .calendar-other-month-day.calendar-nonwork-day {
color: rgba(136, 138, 141, 0.5); }
.calendar .calendar-today {
background-color: #2777ff;
font-weight: 800;
color: #ffffff !important; }
.calendar .calendar-today:hover, .calendar .calendar-today:focus {
background-color: #3681ff;
color: inherit; }
.calendar .calendar-today:active, .calendar .calendar-today:selected {
background-color: #2777ff;
color: inherit; }
.calendar .calendar-today:active:hover, .calendar .calendar-today:active:focus, .calendar .calendar-today:selected:hover, .calendar .calendar-today:selected:focus {
background-color: #3681ff;
color: inherit; }
.calendar .calendar-day-with-events {
background-image: url("assets/calendar-today.svg");
background-size: contain; }
height: 0.93em !important;
padding-top: 6px !important;
margin-bottom: 0;
border-radius: 9px; }
.calendar .calendar-day.calendar-weekend {
color: #888a8d; }
.calendar .calendar-day.calendar-other-month {
color: rgba(136, 138, 141, 0.3) !important;
font-weight: normal; }
.calendar .calendar-day.calendar-today {
color: #ffffff;
/* override weekends */ }
.calendar .calendar-day.calendar-day-with-events {
background-image: url("assets/calendar-today.svg");
background-size: contain; }
.calendar .calendar-week-number {
font-size: 6pt;
font-weight: bold;
font-feature-settings: "tnum";
text-align: center;
margin: 6px;
padding: 0 6px;
border-radius: 3px;
@ -1138,7 +1135,7 @@ StScrollBar {
min-height: 64px;
width: 34em;
box-shadow: 0 2px 4px 2px rgba(0, 0, 0, 0.3);
border-radius: 12px;
border-radius: 16px;
margin: 4px; }
.notification-banner .notification-actions {
spacing: 0; }
@ -1384,21 +1381,21 @@ StScrollBar {
.switcher-list .item-box {
background-color: transparent; }
.switcher-list .item-box:hover {
background-color: rgba(238, 238, 236, 0.1); }
background-color: rgba(255, 255, 255, 0.1); }
.switcher-list .item-box:selected, .switcher-list .item-box:focus {
background-color: rgba(238, 238, 236, 0.13); }
background-color: rgba(255, 255, 255, 0.13); }
.switcher-list .item-box:selected:hover, .switcher-list .item-box:focus:hover {
background-color: rgba(238, 238, 236, 0.16); }
background-color: rgba(255, 255, 255, 0.16); }
.switcher-list .item-box:selected:active, .switcher-list .item-box:focus:active {
background-color: rgba(238, 238, 236, 0.13); }
background-color: rgba(255, 255, 255, 0.13); }
.switcher-list .item-box:active {
background-color: rgba(238, 238, 236, 0.16); }
background-color: rgba(255, 255, 255, 0.16); }
.switcher-list .item-box:outlined, .switcher-list .item-box:checked {
background-color: rgba(238, 238, 236, 0.19); }
background-color: rgba(255, 255, 255, 0.19); }
.switcher-list .item-box:outlined:active, .switcher-list .item-box:checked:active {
background-color: rgba(238, 238, 236, 0.22); }
background-color: rgba(255, 255, 255, 0.22); }
.switcher-list .item-box:outlined:hover, .switcher-list .item-box:checked:hover {
background-color: rgba(238, 238, 236, 0.25); }
background-color: rgba(255, 255, 255, 0.25); }
.switcher-list .item-box:drop {
border: 2px solid rgba(39, 119, 255, 0.8);
background-color: rgba(39, 119, 255, 0.2); }
@ -1495,7 +1492,7 @@ StScrollBar {
background-color: #9f1313; }
.screenshot-ui-shot-cast-container {
background-color: #3b3f4e;
background-color: rgba(255, 255, 255, 0.1);
border-radius: 16px;
padding: 3px;
spacing: 3px; }
@ -1509,12 +1506,12 @@ StScrollBar {
background-color: transparent;
border-radius: 13px; }
.screenshot-ui-shot-cast-button:hover, .screenshot-ui-shot-cast-button:focus {
background-color: #464b5d; }
background-color: rgba(255, 255, 255, 0.2); }
.screenshot-ui-shot-cast-button:active {
background-color: #484d60; }
background-color: rgba(255, 255, 255, 0.5); }
.screenshot-ui-shot-cast-button:checked {
background-color: white;
color: black; }
color: #303340; }
.screenshot-ui-shot-cast-button:insensitive {
color: rgba(255, 255, 255, 0.5); }
.screenshot-ui-shot-cast-button StIcon {
@ -1584,10 +1581,6 @@ StScrollBar {
border: 2px white; }
.screenshot-ui-tooltip {
color: white;
background-color: #303340;
border-radius: 99px;
padding: 6px 12px;
text-align: center;
-y-offset: 24px; }
@ -1598,63 +1591,22 @@ StScrollBar {
height: 2.2em;
transition-duration: 250ms;
box-shadow: inset 0 -1px 0 0 black; }
#panel.unlock-screen, #panel.login-screen, #panel:overview {
background-color: transparent;
box-shadow: none; }
#panel.unlock-screen .panel-button, #panel.login-screen .panel-button, #panel:overview .panel-button {
color: white !important; }
#panel .panel-button {
font-weight: bold;
color: #e2e2df;
-natural-hpadding: 12px;
-minimum-hpadding: 6px;
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px; }
#panel .panel-button.clock-display .clock {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px; }
#panel .panel-button.screen-recording-indicator {
box-shadow: inset 0 0 0 100px #bf1717; }
#panel .panel-button.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px #fd7d00; }
#panel .panel-button.screen-sharing-indicator StBoxLayout {
margin: 0 6px; }
#panel .panel-button.screen-recording-indicator StBoxLayout, #panel .panel-button.screen-sharing-indicator StBoxLayout {
spacing: 6px; }
#panel .panel-button.screen-recording-indicator StIcon, #panel .panel-button.screen-sharing-indicator StIcon {
icon-size: 1.09em; }
#panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.2); }
#panel .panel-button:active.clock-display, #panel .panel-button:overview.clock-display, #panel .panel-button:focus.clock-display, #panel .panel-button:checked.clock-display {
box-shadow: none; }
#panel .panel-button:active.clock-display .clock, #panel .panel-button:overview.clock-display .clock, #panel .panel-button:focus.clock-display .clock, #panel .panel-button:checked.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.2); }
#panel .panel-button:active.screen-recording-indicator, #panel .panel-button:overview.screen-recording-indicator, #panel .panel-button:focus.screen-recording-indicator, #panel .panel-button:checked.screen-recording-indicator {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.85); }
#panel .panel-button:active.screen-sharing-indicator, #panel .panel-button:overview.screen-sharing-indicator, #panel .panel-button:focus.screen-sharing-indicator, #panel .panel-button:checked.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.85); }
#panel .panel-button:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.15); }
#panel .panel-button:hover.clock-display {
box-shadow: none; }
#panel .panel-button:hover.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.15); }
#panel .panel-button:hover.screen-recording-indicator {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.9); }
#panel .panel-button:hover.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.9); }
#panel .panel-button:active:hover, #panel .panel-button:overview:hover, #panel .panel-button:focus:hover, #panel .panel-button:checked:hover {
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: none;
-natural-hpadding: 12px;
-minimum-hpadding: 6px; }
#panel .panel-button:active, #panel .panel-button:focus, #panel .panel-button:checked {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.25); }
#panel .panel-button:active:hover.clock-display, #panel .panel-button:overview:hover.clock-display, #panel .panel-button:focus:hover.clock-display, #panel .panel-button:checked:hover.clock-display {
box-shadow: none; }
#panel .panel-button:active:hover.clock-display .clock, #panel .panel-button:overview:hover.clock-display .clock, #panel .panel-button:focus:hover.clock-display .clock, #panel .panel-button:checked:hover.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.25); }
#panel .panel-button:active:hover.screen-recording-indicator, #panel .panel-button:overview:hover.screen-recording-indicator, #panel .panel-button:focus:hover.screen-recording-indicator, #panel .panel-button:checked:hover.screen-recording-indicator {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.8); }
#panel .panel-button:active:hover.screen-sharing-indicator, #panel .panel-button:overview:hover.screen-sharing-indicator, #panel .panel-button:focus:hover.screen-sharing-indicator, #panel .panel-button:checked:hover.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.8); }
#panel .panel-button:active:hover, #panel .panel-button:focus:hover, #panel .panel-button:checked:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.35); }
#panel .panel-button:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.2); }
#panel .panel-button .system-status-icon {
icon-size: 1.09em;
padding: 5px;
@ -1665,44 +1617,157 @@ StScrollBar {
#panel .panel-button .app-menu-icon {
-st-icon-style: symbolic; }
#panel .panel-button#panelActivities {
-natural-hpadding: 18px; }
#panel.unlock-screen .panel-button:active, #panel.unlock-screen .panel-button:overview, #panel.unlock-screen .panel-button:focus, #panel.unlock-screen .panel-button:checked, #panel.login-screen .panel-button:active, #panel.login-screen .panel-button:overview, #panel.login-screen .panel-button:focus, #panel.login-screen .panel-button:checked, #panel:overview .panel-button:active, #panel:overview .panel-button:overview, #panel:overview .panel-button:focus, #panel:overview .panel-button:checked {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.15); }
#panel.unlock-screen .panel-button:active.clock-display, #panel.unlock-screen .panel-button:overview.clock-display, #panel.unlock-screen .panel-button:focus.clock-display, #panel.unlock-screen .panel-button:checked.clock-display, #panel.login-screen .panel-button:active.clock-display, #panel.login-screen .panel-button:overview.clock-display, #panel.login-screen .panel-button:focus.clock-display, #panel.login-screen .panel-button:checked.clock-display, #panel:overview .panel-button:active.clock-display, #panel:overview .panel-button:overview.clock-display, #panel:overview .panel-button:focus.clock-display, #panel:overview .panel-button:checked.clock-display {
box-shadow: none; }
#panel.unlock-screen .panel-button:active.clock-display .clock, #panel.unlock-screen .panel-button:overview.clock-display .clock, #panel.unlock-screen .panel-button:focus.clock-display .clock, #panel.unlock-screen .panel-button:checked.clock-display .clock, #panel.login-screen .panel-button:active.clock-display .clock, #panel.login-screen .panel-button:overview.clock-display .clock, #panel.login-screen .panel-button:focus.clock-display .clock, #panel.login-screen .panel-button:checked.clock-display .clock, #panel:overview .panel-button:active.clock-display .clock, #panel:overview .panel-button:overview.clock-display .clock, #panel:overview .panel-button:focus.clock-display .clock, #panel:overview .panel-button:checked.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.15); }
#panel.unlock-screen .panel-button:active.screen-recording-indicator, #panel.unlock-screen .panel-button:overview.screen-recording-indicator, #panel.unlock-screen .panel-button:focus.screen-recording-indicator, #panel.unlock-screen .panel-button:checked.screen-recording-indicator, #panel.login-screen .panel-button:active.screen-recording-indicator, #panel.login-screen .panel-button:overview.screen-recording-indicator, #panel.login-screen .panel-button:focus.screen-recording-indicator, #panel.login-screen .panel-button:checked.screen-recording-indicator, #panel:overview .panel-button:active.screen-recording-indicator, #panel:overview .panel-button:overview.screen-recording-indicator, #panel:overview .panel-button:focus.screen-recording-indicator, #panel:overview .panel-button:checked.screen-recording-indicator {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.85); }
#panel.unlock-screen .panel-button:active.screen-sharing-indicator, #panel.unlock-screen .panel-button:overview.screen-sharing-indicator, #panel.unlock-screen .panel-button:focus.screen-sharing-indicator, #panel.unlock-screen .panel-button:checked.screen-sharing-indicator, #panel.login-screen .panel-button:active.screen-sharing-indicator, #panel.login-screen .panel-button:overview.screen-sharing-indicator, #panel.login-screen .panel-button:focus.screen-sharing-indicator, #panel.login-screen .panel-button:checked.screen-sharing-indicator, #panel:overview .panel-button:active.screen-sharing-indicator, #panel:overview .panel-button:overview.screen-sharing-indicator, #panel:overview .panel-button:focus.screen-sharing-indicator, #panel:overview .panel-button:checked.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.85); }
#panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel:overview .panel-button:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.1); }
#panel.unlock-screen .panel-button:hover.clock-display, #panel.login-screen .panel-button:hover.clock-display, #panel:overview .panel-button:hover.clock-display {
box-shadow: none; }
#panel.unlock-screen .panel-button:hover.clock-display .clock, #panel.login-screen .panel-button:hover.clock-display .clock, #panel:overview .panel-button:hover.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.1); }
#panel.unlock-screen .panel-button:hover.screen-recording-indicator, #panel.login-screen .panel-button:hover.screen-recording-indicator, #panel:overview .panel-button:hover.screen-recording-indicator {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.9); }
#panel.unlock-screen .panel-button:hover.screen-sharing-indicator, #panel.login-screen .panel-button:hover.screen-sharing-indicator, #panel:overview .panel-button:hover.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.9); }
#panel.unlock-screen .panel-button:active:hover, #panel.unlock-screen .panel-button:overview:hover, #panel.unlock-screen .panel-button:focus:hover, #panel.unlock-screen .panel-button:checked:hover, #panel.login-screen .panel-button:active:hover, #panel.login-screen .panel-button:overview:hover, #panel.login-screen .panel-button:focus:hover, #panel.login-screen .panel-button:checked:hover, #panel:overview .panel-button:active:hover, #panel:overview .panel-button:overview:hover, #panel:overview .panel-button:focus:hover, #panel:overview .panel-button:checked:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel.unlock-screen .panel-button:active:hover.clock-display, #panel.unlock-screen .panel-button:overview:hover.clock-display, #panel.unlock-screen .panel-button:focus:hover.clock-display, #panel.unlock-screen .panel-button:checked:hover.clock-display, #panel.login-screen .panel-button:active:hover.clock-display, #panel.login-screen .panel-button:overview:hover.clock-display, #panel.login-screen .panel-button:focus:hover.clock-display, #panel.login-screen .panel-button:checked:hover.clock-display, #panel:overview .panel-button:active:hover.clock-display, #panel:overview .panel-button:overview:hover.clock-display, #panel:overview .panel-button:focus:hover.clock-display, #panel:overview .panel-button:checked:hover.clock-display {
box-shadow: none; }
#panel.unlock-screen .panel-button:active:hover.clock-display .clock, #panel.unlock-screen .panel-button:overview:hover.clock-display .clock, #panel.unlock-screen .panel-button:focus:hover.clock-display .clock, #panel.unlock-screen .panel-button:checked:hover.clock-display .clock, #panel.login-screen .panel-button:active:hover.clock-display .clock, #panel.login-screen .panel-button:overview:hover.clock-display .clock, #panel.login-screen .panel-button:focus:hover.clock-display .clock, #panel.login-screen .panel-button:checked:hover.clock-display .clock, #panel:overview .panel-button:active:hover.clock-display .clock, #panel:overview .panel-button:overview:hover.clock-display .clock, #panel:overview .panel-button:focus:hover.clock-display .clock, #panel:overview .panel-button:checked:hover.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel.unlock-screen .panel-button:active:hover.screen-recording-indicator, #panel.unlock-screen .panel-button:overview:hover.screen-recording-indicator, #panel.unlock-screen .panel-button:focus:hover.screen-recording-indicator, #panel.unlock-screen .panel-button:checked:hover.screen-recording-indicator, #panel.login-screen .panel-button:active:hover.screen-recording-indicator, #panel.login-screen .panel-button:overview:hover.screen-recording-indicator, #panel.login-screen .panel-button:focus:hover.screen-recording-indicator, #panel.login-screen .panel-button:checked:hover.screen-recording-indicator, #panel:overview .panel-button:active:hover.screen-recording-indicator, #panel:overview .panel-button:overview:hover.screen-recording-indicator, #panel:overview .panel-button:focus:hover.screen-recording-indicator, #panel:overview .panel-button:checked:hover.screen-recording-indicator {
-natural-hpadding: 15px; }
#panel .panel-button#panelActivities StBoxLayout {
spacing: 5px; }
#panel .panel-button#panelActivities .workspace-dot {
border-radius: 999px;
min-width: 8px;
min-height: 8px;
background-color: #e2e2df; }
#panel .panel-button.screen-recording-indicator StBoxLayout, #panel .panel-button.screen-sharing-indicator StBoxLayout {
spacing: 6px; }
#panel .panel-button.screen-recording-indicator StIcon, #panel .panel-button.screen-sharing-indicator StIcon {
icon-size: 1.09em; }
#panel .panel-button.screen-recording-indicator {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.8); }
#panel.unlock-screen .panel-button:active:hover.screen-sharing-indicator, #panel.unlock-screen .panel-button:overview:hover.screen-sharing-indicator, #panel.unlock-screen .panel-button:focus:hover.screen-sharing-indicator, #panel.unlock-screen .panel-button:checked:hover.screen-sharing-indicator, #panel.login-screen .panel-button:active:hover.screen-sharing-indicator, #panel.login-screen .panel-button:overview:hover.screen-sharing-indicator, #panel.login-screen .panel-button:focus:hover.screen-sharing-indicator, #panel.login-screen .panel-button:checked:hover.screen-sharing-indicator, #panel:overview .panel-button:active:hover.screen-sharing-indicator, #panel:overview .panel-button:overview:hover.screen-sharing-indicator, #panel:overview .panel-button:focus:hover.screen-sharing-indicator, #panel:overview .panel-button:checked:hover.screen-sharing-indicator {
#panel .panel-button.screen-recording-indicator:active, #panel .panel-button.screen-recording-indicator:focus, #panel .panel-button.screen-recording-indicator:checked {
box-shadow: inset 0 0 0 100px #bf1717; }
#panel .panel-button.screen-recording-indicator:active:hover, #panel .panel-button.screen-recording-indicator:focus:hover, #panel .panel-button.screen-recording-indicator:checked:hover {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.95); }
#panel .panel-button.screen-recording-indicator:hover {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.9); }
#panel .panel-button.screen-sharing-indicator {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.8); }
#panel .panel-button.screen-sharing-indicator:active, #panel .panel-button.screen-sharing-indicator:focus, #panel .panel-button.screen-sharing-indicator:checked {
box-shadow: inset 0 0 0 100px #fd7d00; }
#panel .panel-button.screen-sharing-indicator:active:hover, #panel .panel-button.screen-sharing-indicator:focus:hover, #panel .panel-button.screen-sharing-indicator:checked:hover {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.95); }
#panel .panel-button.screen-sharing-indicator:hover {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.9); }
#panel .panel-button.clock-display {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: none;
box-shadow: none !important; }
#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:focus, #panel .panel-button.clock-display:checked {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.25); }
#panel .panel-button.clock-display:active:hover, #panel .panel-button.clock-display:focus:hover, #panel .panel-button.clock-display:checked:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.35); }
#panel .panel-button.clock-display:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.2); }
#panel .panel-button.clock-display .clock {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px; }
#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:focus, #panel .panel-button.clock-display:checked {
box-shadow: none !important; }
#panel .panel-button.clock-display:active .clock, #panel .panel-button.clock-display:focus .clock, #panel .panel-button.clock-display:checked .clock {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.25); }
#panel .panel-button.clock-display:active .clock:hover, #panel .panel-button.clock-display:focus .clock:hover, #panel .panel-button.clock-display:checked .clock:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.35) !important; }
#panel .panel-button.clock-display:hover {
box-shadow: none !important; }
#panel .panel-button.clock-display:hover .clock {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.2); }
#panel.unlock-screen, #panel.login-screen, #panel:overview {
background-color: transparent;
box-shadow: none; }
#panel.unlock-screen .panel-button, #panel.login-screen .panel-button, #panel:overview .panel-button {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: white;
box-shadow: none; }
#panel.unlock-screen .panel-button:active, #panel.unlock-screen .panel-button:focus, #panel.unlock-screen .panel-button:checked, #panel.login-screen .panel-button:active, #panel.login-screen .panel-button:focus, #panel.login-screen .panel-button:checked, #panel:overview .panel-button:active, #panel:overview .panel-button:focus, #panel:overview .panel-button:checked {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); }
#panel.unlock-screen .panel-button:active:hover, #panel.unlock-screen .panel-button:focus:hover, #panel.unlock-screen .panel-button:checked:hover, #panel.login-screen .panel-button:active:hover, #panel.login-screen .panel-button:focus:hover, #panel.login-screen .panel-button:checked:hover, #panel:overview .panel-button:active:hover, #panel:overview .panel-button:focus:hover, #panel:overview .panel-button:checked:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.35); }
#panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel:overview .panel-button:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel.unlock-screen .panel-button#panelActivities .workspace-dot, #panel.login-screen .panel-button#panelActivities .workspace-dot, #panel:overview .panel-button#panelActivities .workspace-dot {
background-color: white; }
#panel.unlock-screen .panel-button.clock-display, #panel.login-screen .panel-button.clock-display, #panel:overview .panel-button.clock-display {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: white;
box-shadow: none;
box-shadow: none !important; }
#panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:focus, #panel.unlock-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:checked {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); }
#panel.unlock-screen .panel-button.clock-display:active:hover, #panel.unlock-screen .panel-button.clock-display:focus:hover, #panel.unlock-screen .panel-button.clock-display:checked:hover, #panel.login-screen .panel-button.clock-display:active:hover, #panel.login-screen .panel-button.clock-display:focus:hover, #panel.login-screen .panel-button.clock-display:checked:hover, #panel:overview .panel-button.clock-display:active:hover, #panel:overview .panel-button.clock-display:focus:hover, #panel:overview .panel-button.clock-display:checked:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.35); }
#panel.unlock-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px; }
#panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:focus, #panel.unlock-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:checked {
box-shadow: none !important; }
#panel.unlock-screen .panel-button.clock-display:active .clock, #panel.unlock-screen .panel-button.clock-display:focus .clock, #panel.unlock-screen .panel-button.clock-display:checked .clock, #panel.login-screen .panel-button.clock-display:active .clock, #panel.login-screen .panel-button.clock-display:focus .clock, #panel.login-screen .panel-button.clock-display:checked .clock, #panel:overview .panel-button.clock-display:active .clock, #panel:overview .panel-button.clock-display:focus .clock, #panel:overview .panel-button.clock-display:checked .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); }
#panel.unlock-screen .panel-button.clock-display:active .clock:hover, #panel.unlock-screen .panel-button.clock-display:focus .clock:hover, #panel.unlock-screen .panel-button.clock-display:checked .clock:hover, #panel.login-screen .panel-button.clock-display:active .clock:hover, #panel.login-screen .panel-button.clock-display:focus .clock:hover, #panel.login-screen .panel-button.clock-display:checked .clock:hover, #panel:overview .panel-button.clock-display:active .clock:hover, #panel:overview .panel-button.clock-display:focus .clock:hover, #panel:overview .panel-button.clock-display:checked .clock:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.35) !important; }
#panel.unlock-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:hover {
box-shadow: none !important; }
#panel.unlock-screen .panel-button.clock-display:hover .clock, #panel.login-screen .panel-button.clock-display:hover .clock, #panel:overview .panel-button.clock-display:hover .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel.unlock-screen .panel-button.screen-recording-indicator, #panel.login-screen .panel-button.screen-recording-indicator, #panel:overview .panel-button.screen-recording-indicator {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.8); }
#panel.unlock-screen .panel-button.screen-recording-indicator:active, #panel.unlock-screen .panel-button.screen-recording-indicator:focus, #panel.unlock-screen .panel-button.screen-recording-indicator:checked, #panel.login-screen .panel-button.screen-recording-indicator:active, #panel.login-screen .panel-button.screen-recording-indicator:focus, #panel.login-screen .panel-button.screen-recording-indicator:checked, #panel:overview .panel-button.screen-recording-indicator:active, #panel:overview .panel-button.screen-recording-indicator:focus, #panel:overview .panel-button.screen-recording-indicator:checked {
box-shadow: inset 0 0 0 100px #bf1717; }
#panel.unlock-screen .panel-button.screen-recording-indicator:active:hover, #panel.unlock-screen .panel-button.screen-recording-indicator:focus:hover, #panel.unlock-screen .panel-button.screen-recording-indicator:checked:hover, #panel.login-screen .panel-button.screen-recording-indicator:active:hover, #panel.login-screen .panel-button.screen-recording-indicator:focus:hover, #panel.login-screen .panel-button.screen-recording-indicator:checked:hover, #panel:overview .panel-button.screen-recording-indicator:active:hover, #panel:overview .panel-button.screen-recording-indicator:focus:hover, #panel:overview .panel-button.screen-recording-indicator:checked:hover {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.95); }
#panel.unlock-screen .panel-button.screen-recording-indicator:hover, #panel.login-screen .panel-button.screen-recording-indicator:hover, #panel:overview .panel-button.screen-recording-indicator:hover {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.9); }
#panel.unlock-screen .panel-button.screen-sharing-indicator, #panel.login-screen .panel-button.screen-sharing-indicator, #panel:overview .panel-button.screen-sharing-indicator {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.8); }
#panel.unlock-screen .panel-button.screen-sharing-indicator:active, #panel.unlock-screen .panel-button.screen-sharing-indicator:focus, #panel.unlock-screen .panel-button.screen-sharing-indicator:checked, #panel.login-screen .panel-button.screen-sharing-indicator:active, #panel.login-screen .panel-button.screen-sharing-indicator:focus, #panel.login-screen .panel-button.screen-sharing-indicator:checked, #panel:overview .panel-button.screen-sharing-indicator:active, #panel:overview .panel-button.screen-sharing-indicator:focus, #panel:overview .panel-button.screen-sharing-indicator:checked {
box-shadow: inset 0 0 0 100px #fd7d00; }
#panel.unlock-screen .panel-button.screen-sharing-indicator:active:hover, #panel.unlock-screen .panel-button.screen-sharing-indicator:focus:hover, #panel.unlock-screen .panel-button.screen-sharing-indicator:checked:hover, #panel.login-screen .panel-button.screen-sharing-indicator:active:hover, #panel.login-screen .panel-button.screen-sharing-indicator:focus:hover, #panel.login-screen .panel-button.screen-sharing-indicator:checked:hover, #panel:overview .panel-button.screen-sharing-indicator:active:hover, #panel:overview .panel-button.screen-sharing-indicator:focus:hover, #panel:overview .panel-button.screen-sharing-indicator:checked:hover {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.95); }
#panel.unlock-screen .panel-button.screen-sharing-indicator:hover, #panel.login-screen .panel-button.screen-sharing-indicator:hover, #panel:overview .panel-button.screen-sharing-indicator:hover {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.9); }
#panel .panel-status-indicators-box,
#panel .panel-status-menu-box {
spacing: 2px; }
#panel .power-status.panel-status-indicators-box {
spacing: 0; }
#panel .screencast-indicator,
#panel .remote-access-indicator {
#panel .privacy-indicator {
color: #fd7d00; }
#appMenu {
@ -1733,7 +1798,7 @@ StScrollBar {
.quick-settings {
padding: 18px;
border-radius: 36px; }
.quick-settings .icon-button, .quick-settings .login-dialog-button.cancel-button, .quick-settings .login-dialog-button.switch-user-button, .quick-settings .login-dialog-button.login-dialog-session-list-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button {
.quick-settings .icon-button, .quick-settings .login-dialog-button.cancel-button, .quick-settings .login-dialog-button.switch-user-button, .quick-settings .login-dialog-button.login-dialog-session-list-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button, .quick-settings .calendar .calendar-month-header .pager-button, .calendar .calendar-month-header .quick-settings .pager-button, .quick-settings .calendar .calendar-day, .calendar .quick-settings .calendar-day {
padding: 10.5px; }
.quick-settings-grid {
@ -1770,7 +1835,7 @@ StScrollBar {
color: rgba(255, 255, 255, 0.5); }
.quick-toggle > StBoxLayout {
spacing: 9px; }
.quick-toggle.button, .quick-toggle.icon-button, .quick-toggle.login-dialog-button.cancel-button, .quick-toggle.login-dialog-button.switch-user-button, .quick-toggle.login-dialog-button.login-dialog-session-list-button, .background-app-item .quick-toggle.close-button {
.quick-toggle.button, .quick-toggle.icon-button, .quick-toggle.login-dialog-button.cancel-button, .quick-toggle.login-dialog-button.switch-user-button, .quick-toggle.login-dialog-button.login-dialog-session-list-button, .background-app-item .quick-toggle.close-button, .calendar .calendar-month-header .quick-toggle.pager-button, .calendar .quick-toggle.calendar-day {
padding: 0; }
.quick-toggle > StBoxLayout {
padding: 0 12px; }
@ -1804,7 +1869,8 @@ StScrollBar {
.quick-menu-toggle .quick-toggle-arrow {
padding: 6px 10.5px;
border-width: 0; }
border-width: 0;
border-color: rgba(238, 238, 236, 0.25); }
.quick-menu-toggle .quick-toggle-arrow:checked {
transition-duration: 100ms;
background-color: #2777ff;
@ -1927,6 +1993,30 @@ StScrollBar {
.device-subtitle {
color: rgba(238, 238, 236, 0.5); }
.keyboard-brightness-item .slider {
min-height: 16px; }
.keyboard-brightness-level {
spacing: 6px; }
.keyboard-brightness-level .button:checked, .keyboard-brightness-level .icon-button:checked, .keyboard-brightness-level .login-dialog-button.cancel-button:checked, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked, .keyboard-brightness-level .background-app-item .close-button:checked, .background-app-item .keyboard-brightness-level .close-button:checked, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked, .keyboard-brightness-level .calendar .calendar-day:checked, .calendar .keyboard-brightness-level .calendar-day:checked {
transition-duration: 100ms;
background-color: #2777ff;
color: #ffffff; }
.keyboard-brightness-level .button:checked:focus, .keyboard-brightness-level .icon-button:checked:focus, .keyboard-brightness-level .login-dialog-button.cancel-button:checked:focus, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked:focus, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked:focus, .keyboard-brightness-level .background-app-item .close-button:checked:focus, .background-app-item .keyboard-brightness-level .close-button:checked:focus, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked:focus, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked:focus, .keyboard-brightness-level .calendar .calendar-day:checked:focus, .calendar .keyboard-brightness-level .calendar-day:checked:focus {
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.6) !important; }
.keyboard-brightness-level .button:checked:hover, .keyboard-brightness-level .icon-button:checked:hover, .keyboard-brightness-level .login-dialog-button.cancel-button:checked:hover, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked:hover, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked:hover, .keyboard-brightness-level .background-app-item .close-button:checked:hover, .background-app-item .keyboard-brightness-level .close-button:checked:hover, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked:hover, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked:hover, .keyboard-brightness-level .calendar .calendar-day:checked:hover, .calendar .keyboard-brightness-level .calendar-day:checked:hover, .keyboard-brightness-level .button:checked:focus, .keyboard-brightness-level .icon-button:checked:focus, .keyboard-brightness-level .login-dialog-button.cancel-button:checked:focus, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked:focus, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked:focus, .keyboard-brightness-level .background-app-item .close-button:checked:focus, .background-app-item .keyboard-brightness-level .close-button:checked:focus, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked:focus, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked:focus, .keyboard-brightness-level .calendar .calendar-day:checked:focus, .calendar .keyboard-brightness-level .calendar-day:checked:focus {
background-color: #4187ff;
color: white; }
.keyboard-brightness-level .button:checked:active, .keyboard-brightness-level .icon-button:checked:active, .keyboard-brightness-level .login-dialog-button.cancel-button:checked:active, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked:active, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked:active, .keyboard-brightness-level .background-app-item .close-button:checked:active, .background-app-item .keyboard-brightness-level .close-button:checked:active, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked:active, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked:active, .keyboard-brightness-level .calendar .calendar-day:checked:active, .calendar .keyboard-brightness-level .calendar-day:checked:active {
background-color: #0361ff;
color: #ededed; }
.keyboard-brightness-level .button:checked:insensitive, .keyboard-brightness-level .icon-button:checked:insensitive, .keyboard-brightness-level .login-dialog-button.cancel-button:checked:insensitive, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked:insensitive, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked:insensitive, .keyboard-brightness-level .background-app-item .close-button:checked:insensitive, .background-app-item .keyboard-brightness-level .close-button:checked:insensitive, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked:insensitive, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked:insensitive, .keyboard-brightness-level .calendar .calendar-day:checked:insensitive, .calendar .keyboard-brightness-level .calendar-day:checked:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: rgba(39, 119, 255, 0.5);
color: rgba(255, 255, 255, 0.5); }
.background-apps-quick-toggle {
min-height: 40px;
background-color: transparent; }
@ -1940,6 +2030,9 @@ StScrollBar {
.background-app-item .close-button {
padding: 6px; }
.background-app-item .spinner {
padding: 6px; }
.background-app-item.popup-inactive-menu-item {
color: #eeeeec; }
@ -2200,16 +2293,16 @@ StScrollBar {
.app-folder-dialog {
border-radius: 64px;
background-color: #23252e;
background-color: #3d3f48;
padding: 12px;
box-shadow: inset 0 0 0 1px rgba(238, 238, 236, 0.07); }
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1); }
.app-folder-dialog .folder-name-container {
padding: 24px 36px 0;
spacing: 12px;
/* FIXME: this is to keep the label in sync with the entry */ }
.app-folder-dialog .folder-name-container .folder-name-entry {
width: 12em;
border-radius: 16px; }
color: white !important; }
.app-folder-dialog .folder-name-container .folder-name-label {
padding: 5px 7px;
color: white; }
@ -2254,7 +2347,8 @@ StScrollBar {
width: 10px;
height: 10px;
border-radius: 10px;
background-color: white; }
background-color: white;
transition-duration: 400ms; }
.apps-scroll-view {
padding: 0; }
@ -2285,7 +2379,8 @@ StScrollBar {
padding: 18px;
width: 24px;
height: 24px;
border-radius: 99px; }
border-radius: 99px;
transition-duration: 100ms; }
.page-navigation-arrow > StIcon {
color: white; }
.page-navigation-arrow:insensitive {
@ -2297,8 +2392,7 @@ StScrollBar {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
.page-navigation-arrow:hover {
transition-duration: 100ms;
color: white;
@ -2553,7 +2647,8 @@ StScrollBar {
#LookingGlassDialog {
background-color: rgba(48, 51, 64, 0.98);
color: white;
border-radius: 0 0 16px 16px;
border-radius: 16px;
margin-top: 4px;
border-top-width: 0;
padding: 6px;
spacing: 6px;
@ -2785,6 +2880,11 @@ StScrollBar {
/* Screen Shield */
.unlock-dialog {
background-color: transparent; }
.unlock-dialog .login-dialog-prompt-entry:focus {
transition-duration: 100ms;
background-color: rgba(255, 255, 255, 0.2625);
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.2);
color: white; }
.screen-shield-background {
background: black;
@ -2878,6 +2978,12 @@ StScrollBar {
.icon-dropshadow {
icon-shadow: 0 1px 5px rgba(0, 0, 0, 0.3); }
/* Slider */
.slider {
-barlevel-border-width: 0;
-barlevel-height: 6px;
-slider-handle-radius: 0; }
/* Message List */
.message-list-controls {
spacing: 12px;
@ -2936,39 +3042,28 @@ StScrollBar {
box-shadow: none; }
#panel StIcon {
icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); }
#panel.unlock-screen, #panel.login-screen, #panel.lock-screen, #panel:overview {
background-color: transparent; }
#panel.unlock-screen .panel-button, #panel.unlock-screen .panel-button:hover, #panel.unlock-screen .panel-button:active, #panel.unlock-screen .panel-button:focus, #panel.unlock-screen .panel-button:overview, #panel.unlock-screen .panel-button:checked, #panel.login-screen .panel-button, #panel.login-screen .panel-button:hover, #panel.login-screen .panel-button:active, #panel.login-screen .panel-button:focus, #panel.login-screen .panel-button:overview, #panel.login-screen .panel-button:checked, #panel.lock-screen .panel-button, #panel.lock-screen .panel-button:hover, #panel.lock-screen .panel-button:active, #panel.lock-screen .panel-button:focus, #panel.lock-screen .panel-button:overview, #panel.lock-screen .panel-button:checked, #panel:overview .panel-button, #panel:overview .panel-button:hover, #panel:overview .panel-button:active, #panel:overview .panel-button:focus, #panel:overview .panel-button:overview, #panel:overview .panel-button:checked {
color: white; }
#panel .panel-button {
color: white; }
#panel .panel-button:hover, #panel .panel-button:active, #panel .panel-button:focus, #panel .panel-button:overview, #panel .panel-button:checked {
color: white;
#panel .panel-button:active, #panel .panel-button:focus, #panel .panel-button:checked {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); }
#panel .panel-button:active:hover, #panel .panel-button:focus:hover, #panel .panel-button:checked:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.35); }
#panel .panel-button:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel .panel-button.screen-recording-indicator {
#panel .panel-button.clock-display {
color: white; }
#panel .panel-button.clock-display:active .clock, #panel .panel-button.clock-display:focus .clock, #panel .panel-button.clock-display:checked .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); }
#panel .panel-button.clock-display:active .clock:hover, #panel .panel-button.clock-display:focus .clock:hover, #panel .panel-button.clock-display:checked .clock:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.35); }
#panel .panel-button.clock-display:hover {
box-shadow: none !important; }
#panel .panel-button.clock-display:hover .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel .panel-button#panelActivities .workspace-dot {
background-color: white; }
#panel .panel-button.screen-recording-indicator, #panel .panel-button.screen-sharing-indicator {
color: white; }
#panel .panel-button.clock-display:hover, #panel .panel-button.clock-display:active, #panel .panel-button.clock-display:overview, #panel .panel-button.clock-display:focus, #panel .panel-button.clock-display:checked {
box-shadow: none; }
#panel .panel-button.clock-display:hover .clock, #panel .panel-button.clock-display:active .clock, #panel .panel-button.clock-display:overview .clock, #panel .panel-button.clock-display:focus .clock, #panel .panel-button.clock-display:checked .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel #panelActivities.panel-button {
margin-left: .4em; }
#panel #panelActivities.panel-button StLabel {
background-image: url("assets/view-grid-symbolic-dark.svg");
background-size: contain;
width: 1.5em;
height: 1.5em;
color: transparent; }
#panel #panelActivities.panel-button:overview StLabel {
background-image: url("assets/view-grid-symbolic-dark.svg"); }
/* Date/Time Menu */
.datemenu-today-button:insensitive {
color: inherit; }
/* Quick Settings */
.quick-toggle-menu .header .icon.active {
color: #ffffff; }
/* Search */
.search-entry {
@ -3037,10 +3132,7 @@ StScrollBar {
.app-folder-dialog {
background: black;
color: white;
box-shadow: 0 0 100px #0a0a0a; }
.app-folder-dialog .folder-name-container .folder-name-entry {
color: white; }
/* OSD */
.osd-window, .workspace-switcher {

File diff suppressed because it is too large Load Diff

View File

@ -32,84 +32,120 @@ stage {
text-align: center;
color: inherit; }
#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .calendar .calendar-day.calendar-today, .calendar .calendar-day, .calendar .calendar-month-header .pager-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
border-radius: 8px;
border-style: solid;
border-width: 1px;
font-weight: bold;
padding: 3px 24px; }
.app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
.app-folder-dialog .folder-name-container .edit-folder-button, .button, .calendar .calendar-day.calendar-today, .calendar .calendar-day, .calendar .calendar-month-header .pager-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
transition-duration: 100ms;
color: #eeeeec;
background-color: #35373f; }
.app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .icon-button:focus, .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .close-button:focus {
.app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .calendar .calendar-day:focus, .calendar .calendar-month-header .pager-button:focus, .icon-button:focus, .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .close-button:focus {
transition-duration: 100ms;
color: #eeeeec;
background-color: #403249;
box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; }
.app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .icon-button:focus:hover, .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .close-button:focus:hover {
.app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .calendar .calendar-day:focus:hover, .calendar .calendar-month-header .pager-button:focus:hover, .icon-button:focus:hover, .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .close-button:focus:hover {
background-color: #463851;
box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; }
.app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .icon-button:focus:active, .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .close-button:focus:active {
.app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .calendar .calendar-day:focus:active, .calendar .calendar-month-header .pager-button:focus:active, .icon-button:focus:active, .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .close-button:focus:active {
background-color: #4d3f58;
box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; }
.app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .icon-button:hover, .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .close-button:hover {
.app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .calendar .calendar-day:hover, .calendar .calendar-month-header .pager-button:hover, .icon-button:hover, .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .close-button:hover {
transition-duration: 100ms;
color: #eeeeec;
background-color: #3c3e47; }
.app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .icon-button:insensitive, .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .close-button:insensitive {
.app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .calendar .calendar-day:insensitive, .calendar .calendar-month-header .pager-button:insensitive, .icon-button:insensitive, .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .close-button:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05); }
.app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .icon-button:selected, .login-dialog-button.cancel-button:selected, .login-dialog-button.switch-user-button:selected, .login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .close-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .icon-button:active, .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active, .background-app-item .close-button:active {
.app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .calendar .calendar-day:selected, .calendar .calendar-month-header .pager-button:selected, .icon-button:selected, .login-dialog-button.cancel-button:selected, .login-dialog-button.switch-user-button:selected, .login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .close-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .calendar .calendar-day:active, .calendar .calendar-month-header .pager-button:active, .icon-button:active, .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active, .background-app-item .close-button:active {
transition-duration: 100ms;
color: #eeeeec;
background-color: #434650; }
.app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .icon-button:checked, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .close-button:checked {
.app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .calendar .calendar-day:checked, .calendar .calendar-month-header .pager-button:checked, .icon-button:checked, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .close-button:checked {
transition-duration: 100ms;
color: #eeeeec;
background-color: #4a4d58; }
.app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .icon-button:checked:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .close-button:checked:hover {
.app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .calendar .calendar-day:checked:hover, .calendar .calendar-month-header .pager-button:checked:hover, .icon-button:checked:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .close-button:checked:hover {
background-color: #515460; }
.app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .icon-button:checked:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .close-button:checked:active {
.app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .calendar .calendar-day:checked:active, .calendar .calendar-month-header .pager-button:checked:active, .icon-button:checked:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .close-button:checked:active {
background-color: #585b69; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button, .flat.button, .flat.icon-button, .flat.login-dialog-button.cancel-button, .flat.login-dialog-button.switch-user-button, .flat.login-dialog-button.login-dialog-session-list-button, .background-app-item .flat.close-button {
.app-folder-dialog .folder-name-container .default.edit-folder-button, .default.button, .calendar .default.calendar-day, .calendar .calendar-day.calendar-today, .calendar .calendar-month-header .default.pager-button, .default.icon-button, .default.login-dialog-button.cancel-button, .default.login-dialog-button.switch-user-button, .default.login-dialog-button.login-dialog-session-list-button, .background-app-item .default.close-button {
transition-duration: 100ms;
background-color: #a400a4;
color: #ffffff; }
.app-folder-dialog .folder-name-container .default.edit-folder-button:focus, .default.button:focus, .calendar .default.calendar-day:focus, .calendar .calendar-day.calendar-today:focus, .calendar .calendar-month-header .default.pager-button:focus, .default.icon-button:focus, .default.login-dialog-button.cancel-button:focus, .default.login-dialog-button.switch-user-button:focus, .default.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .default.close-button:focus {
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.6) !important; }
.app-folder-dialog .folder-name-container .default.edit-folder-button:hover, .default.button:hover, .calendar .default.calendar-day:hover, .calendar .calendar-day.calendar-today:hover, .calendar .calendar-month-header .default.pager-button:hover, .default.icon-button:hover, .default.login-dialog-button.cancel-button:hover, .default.login-dialog-button.switch-user-button:hover, .default.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .default.close-button:hover, .app-folder-dialog .folder-name-container .default.edit-folder-button:focus, .default.button:focus, .calendar .default.calendar-day:focus, .calendar .calendar-day.calendar-today:focus, .calendar .calendar-month-header .default.pager-button:focus, .default.icon-button:focus, .default.login-dialog-button.cancel-button:focus, .default.login-dialog-button.switch-user-button:focus, .default.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .default.close-button:focus {
background-color: #be00be;
color: white; }
.app-folder-dialog .folder-name-container .default.edit-folder-button:active, .default.button:active, .calendar .default.calendar-day:active, .calendar .calendar-day.calendar-today:active, .calendar .calendar-month-header .default.pager-button:active, .default.icon-button:active, .default.login-dialog-button.cancel-button:active, .default.login-dialog-button.switch-user-button:active, .default.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .default.close-button:active {
background-color: purple;
color: #ededed; }
.app-folder-dialog .folder-name-container .default.edit-folder-button:insensitive, .default.button:insensitive, .calendar .default.calendar-day:insensitive, .calendar .calendar-day.calendar-today:insensitive, .calendar .calendar-month-header .default.pager-button:insensitive, .default.icon-button:insensitive, .default.login-dialog-button.cancel-button:insensitive, .default.login-dialog-button.switch-user-button:insensitive, .default.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .default.close-button:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: rgba(164, 0, 164, 0.5);
color: rgba(255, 255, 255, 0.5); }
.app-folder-dialog .folder-name-container .flat.edit-folder-button, .calendar .app-folder-dialog .folder-name-container .calendar-day.edit-folder-button, .app-folder-dialog .folder-name-container .calendar .calendar-day.edit-folder-button, .flat.button, .calendar .button.calendar-day, .calendar .calendar-day.calendar-today, .calendar .flat.calendar-day, .calendar .calendar-day, .calendar .calendar-month-header .pager-button, .flat.icon-button, .flat.login-dialog-button.cancel-button, .flat.login-dialog-button.switch-user-button, .flat.login-dialog-button.login-dialog-session-list-button, .background-app-item .flat.close-button, .calendar .icon-button.calendar-day, .calendar .calendar-day.login-dialog-button.cancel-button, .calendar .calendar-day.login-dialog-button.switch-user-button, .calendar .calendar-day.login-dialog-button.login-dialog-session-list-button, .calendar .background-app-item .calendar-day.close-button, .background-app-item .calendar .calendar-day.close-button {
transition-duration: 100ms;
color: #eeeeec;
background-color: #35373f;
background-color: transparent; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .flat.icon-button:focus, .flat.login-dialog-button.cancel-button:focus, .flat.login-dialog-button.switch-user-button:focus, .flat.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .flat.close-button:focus {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .calendar .calendar-day:focus, .calendar .calendar-month-header .pager-button:focus, .flat.icon-button:focus, .flat.login-dialog-button.cancel-button:focus, .flat.login-dialog-button.switch-user-button:focus, .flat.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .flat.close-button:focus {
transition-duration: 100ms;
color: #eeeeec;
background-color: #403249;
box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .flat.icon-button:focus:hover, .flat.login-dialog-button.cancel-button:focus:hover, .flat.login-dialog-button.switch-user-button:focus:hover, .flat.login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .flat.close-button:focus:hover {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .calendar .calendar-day:focus:hover, .calendar .calendar-month-header .pager-button:focus:hover, .flat.icon-button:focus:hover, .flat.login-dialog-button.cancel-button:focus:hover, .flat.login-dialog-button.switch-user-button:focus:hover, .flat.login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .flat.close-button:focus:hover {
background-color: #463851;
box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .flat.icon-button:focus:active, .flat.login-dialog-button.cancel-button:focus:active, .flat.login-dialog-button.switch-user-button:focus:active, .flat.login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .flat.close-button:focus:active {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .calendar .calendar-day:focus:active, .calendar .calendar-month-header .pager-button:focus:active, .flat.icon-button:focus:active, .flat.login-dialog-button.cancel-button:focus:active, .flat.login-dialog-button.switch-user-button:focus:active, .flat.login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .flat.close-button:focus:active {
background-color: #4d3f58;
box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .flat.icon-button:hover, .flat.login-dialog-button.cancel-button:hover, .flat.login-dialog-button.switch-user-button:hover, .flat.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .flat.close-button:hover {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .calendar .calendar-day:hover, .calendar .calendar-month-header .pager-button:hover, .flat.icon-button:hover, .flat.login-dialog-button.cancel-button:hover, .flat.login-dialog-button.switch-user-button:hover, .flat.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .flat.close-button:hover {
transition-duration: 100ms;
color: #eeeeec;
background-color: #3c3e47; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .flat.icon-button:insensitive, .flat.login-dialog-button.cancel-button:insensitive, .flat.login-dialog-button.switch-user-button:insensitive, .flat.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .flat.close-button:insensitive {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .calendar .calendar-day:insensitive, .calendar .calendar-month-header .pager-button:insensitive, .flat.icon-button:insensitive, .flat.login-dialog-button.cancel-button:insensitive, .flat.login-dialog-button.switch-user-button:insensitive, .flat.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .flat.close-button:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05); }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .flat.icon-button:selected, .flat.login-dialog-button.cancel-button:selected, .flat.login-dialog-button.switch-user-button:selected, .flat.login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .flat.close-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .flat.icon-button:active, .flat.login-dialog-button.cancel-button:active, .flat.login-dialog-button.switch-user-button:active, .flat.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .flat.close-button:active {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .calendar .calendar-day:selected, .calendar .calendar-month-header .pager-button:selected, .flat.icon-button:selected, .flat.login-dialog-button.cancel-button:selected, .flat.login-dialog-button.switch-user-button:selected, .flat.login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .flat.close-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .calendar .calendar-day:active, .calendar .calendar-month-header .pager-button:active, .flat.icon-button:active, .flat.login-dialog-button.cancel-button:active, .flat.login-dialog-button.switch-user-button:active, .flat.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .flat.close-button:active {
transition-duration: 100ms;
color: #eeeeec;
background-color: #434650; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .flat.icon-button:checked, .flat.login-dialog-button.cancel-button:checked, .flat.login-dialog-button.switch-user-button:checked, .flat.login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .flat.close-button:checked {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .calendar .calendar-day:checked, .calendar .calendar-month-header .pager-button:checked, .flat.icon-button:checked, .flat.login-dialog-button.cancel-button:checked, .flat.login-dialog-button.switch-user-button:checked, .flat.login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .flat.close-button:checked {
transition-duration: 100ms;
color: #eeeeec;
background-color: #4a4d58; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .flat.icon-button:checked:hover, .flat.login-dialog-button.cancel-button:checked:hover, .flat.login-dialog-button.switch-user-button:checked:hover, .flat.login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .flat.close-button:checked:hover {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .calendar .calendar-day:checked:hover, .calendar .calendar-month-header .pager-button:checked:hover, .flat.icon-button:checked:hover, .flat.login-dialog-button.cancel-button:checked:hover, .flat.login-dialog-button.switch-user-button:checked:hover, .flat.login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .flat.close-button:checked:hover {
background-color: #515460; }
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .flat.icon-button:checked:active, .flat.login-dialog-button.cancel-button:checked:active, .flat.login-dialog-button.switch-user-button:checked:active, .flat.login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .flat.close-button:checked:active {
.app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .calendar .calendar-day:checked:active, .calendar .calendar-month-header .pager-button:checked:active, .flat.icon-button:checked:active, .flat.login-dialog-button.cancel-button:checked:active, .flat.login-dialog-button.switch-user-button:checked:active, .flat.login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .flat.close-button:checked:active {
background-color: #585b69; }
.app-folder-dialog .folder-name-container .flat.default.edit-folder-button, .flat.default.button, .calendar .default.calendar-day, .calendar .calendar-day.calendar-today, .calendar .calendar-month-header .default.pager-button, .default.icon-button, .default.login-dialog-button.cancel-button, .default.login-dialog-button.switch-user-button, .default.login-dialog-button.login-dialog-session-list-button, .background-app-item .default.close-button {
transition-duration: 100ms;
background-color: #a400a4;
color: #ffffff; }
.app-folder-dialog .folder-name-container .flat.default.edit-folder-button:focus, .flat.default.button:focus, .calendar .default.calendar-day:focus, .calendar .calendar-day.calendar-today:focus, .calendar .calendar-month-header .default.pager-button:focus, .default.icon-button:focus, .default.login-dialog-button.cancel-button:focus, .default.login-dialog-button.switch-user-button:focus, .default.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .default.close-button:focus {
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.6) !important; }
.app-folder-dialog .folder-name-container .flat.default.edit-folder-button:hover, .flat.default.button:hover, .calendar .default.calendar-day:hover, .calendar .calendar-day.calendar-today:hover, .calendar .calendar-month-header .default.pager-button:hover, .default.icon-button:hover, .default.login-dialog-button.cancel-button:hover, .default.login-dialog-button.switch-user-button:hover, .default.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .default.close-button:hover, .app-folder-dialog .folder-name-container .flat.default.edit-folder-button:focus, .flat.default.button:focus, .calendar .default.calendar-day:focus, .calendar .calendar-day.calendar-today:focus, .calendar .calendar-month-header .default.pager-button:focus, .default.icon-button:focus, .default.login-dialog-button.cancel-button:focus, .default.login-dialog-button.switch-user-button:focus, .default.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .default.close-button:focus {
background-color: #be00be;
color: white; }
.app-folder-dialog .folder-name-container .flat.default.edit-folder-button:active, .flat.default.button:active, .calendar .default.calendar-day:active, .calendar .calendar-day.calendar-today:active, .calendar .calendar-month-header .default.pager-button:active, .default.icon-button:active, .default.login-dialog-button.cancel-button:active, .default.login-dialog-button.switch-user-button:active, .default.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .default.close-button:active {
background-color: purple;
color: #ededed; }
.app-folder-dialog .folder-name-container .flat.default.edit-folder-button:insensitive, .flat.default.button:insensitive, .calendar .default.calendar-day:insensitive, .calendar .calendar-day.calendar-today:insensitive, .calendar .calendar-month-header .default.pager-button:insensitive, .default.icon-button:insensitive, .default.login-dialog-button.cancel-button:insensitive, .default.login-dialog-button.switch-user-button:insensitive, .default.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .default.close-button:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: rgba(164, 0, 164, 0.5);
color: rgba(255, 255, 255, 0.5); }
.login-dialog-prompt-entry, .search-entry, .lg-dialog StEntry, StEntry {
border-radius: 8px;
@ -192,8 +228,9 @@ StEntry {
margin-left: 0 !important;
margin-right: 0 !important; }
.dash-label, .window-caption {
.dash-label, .window-caption, .screenshot-ui-tooltip {
background-color: rgba(0, 0, 0, 0.9);
border: 1px solid rgba(255, 255, 255, 0.1);
color: white;
border-radius: 99px;
padding: 6px 12px;
@ -216,7 +253,7 @@ StEntry {
font-weight: 700;
font-size: 13pt; }
.lg-extension-name, .background-app-item .title, .osd-window, .dialog-list .dialog-list-title, .message-list-controls, .weather-button .weather-forecast-temp, .weather-button .weather-header, .world-clocks-button .world-clocks-time, .world-clocks-button .world-clocks-header, .events-button .events-title, .calendar .calendar-month-header .calendar-month-label, .datemenu-today-button .day-label, .popup-menu-ornament {
.lg-extension-name, .background-app-item .title, .osd-window, .dialog-list .dialog-list-title, .message-list-controls, .weather-button .weather-forecast-temp, .weather-button .weather-header, .world-clocks-button .world-clocks-time, .world-clocks-button .world-clocks-header, .events-button .events-title, .calendar .calendar-month-header .calendar-month-label, .datemenu-today-button .day-label {
font-weight: 700;
font-size: 11pt; }
@ -230,11 +267,11 @@ StEntry {
font-weight: 400;
font-size: 9pt; }
.calendar .calendar-day-base.calendar-day-heading, .calendar .calendar-day-base {
.calendar .calendar-day {
font-weight: 400;
font-size: 8pt; }
.unlock-dialog-clock .unlock-dialog-clock-time, #panel, .weather-button .weather-forecast-time, .world-clocks-button .world-clocks-timezone, .world-clocks-button .world-clocks-time, .events-button .event-time, .calendar .calendar-day-base {
.unlock-dialog-clock .unlock-dialog-clock-time, #panel, .weather-button .weather-forecast-time, .world-clocks-button .world-clocks-timezone, .world-clocks-button .world-clocks-time, .events-button .event-time, .calendar .calendar-day {
font-feature-settings: "tnum"; }
/* OSD Elements */
@ -267,7 +304,7 @@ StEntry {
#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button {
transition-duration: 100ms;
color: white;
background-color: #424651; }
background-color: rgba(255, 255, 255, 0.1); }
#LookingGlassDialog .notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .lg-toolbar-button:insensitive, .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive {
transition-duration: 100ms;
color: rgba(255, 255, 255, 0.5);
@ -275,30 +312,30 @@ StEntry {
#LookingGlassDialog .notebook-tab:focus, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus, .screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus {
transition-duration: 100ms;
color: white;
background-color: #4c3f59;
background-color: rgba(193, 82, 193, 0.19);
box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; }
#LookingGlassDialog .notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:hover, .screenshot-ui-show-pointer-button:focus:hover, .screenshot-ui-type-button:focus:hover {
background-color: #524661;
background-color: rgba(193, 82, 193, 0.19);
box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; }
#LookingGlassDialog .notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:active, .screenshot-ui-show-pointer-button:focus:active, .screenshot-ui-type-button:focus:active {
background-color: #584c68;
background-color: rgba(193, 82, 193, 0.19);
box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; }
#LookingGlassDialog .notebook-tab:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:hover, .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover {
transition-duration: 100ms;
color: white;
background-color: #494d59; }
background-color: rgba(255, 255, 255, 0.1); }
#LookingGlassDialog .notebook-tab:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:active, .screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active {
transition-duration: 100ms;
color: white;
background-color: #505562; }
background-color: rgba(255, 255, 255, 0.1); }
#LookingGlassDialog .notebook-tab:outlined, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined, .screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, #LookingGlassDialog .notebook-tab:checked, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked {
transition-duration: 100ms;
color: white;
background-color: #575c6a; }
background-color: rgba(255, 255, 255, 0.1); }
#LookingGlassDialog .notebook-tab:outlined:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:hover, .screenshot-ui-show-pointer-button:outlined:hover, .screenshot-ui-type-button:outlined:hover, #LookingGlassDialog .notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:hover, .screenshot-ui-show-pointer-button:checked:hover, .screenshot-ui-type-button:checked:hover {
background-color: #5d6373; }
background-color: rgba(255, 255, 255, 0.1); }
#LookingGlassDialog .notebook-tab:outlined:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:active, .screenshot-ui-show-pointer-button:outlined:active, .screenshot-ui-type-button:outlined:active, #LookingGlassDialog .notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:active, .screenshot-ui-show-pointer-button:checked:active, .screenshot-ui-type-button:checked:active {
background-color: #646a7b; }
background-color: rgba(255, 255, 255, 0.1); }
.screenshot-ui-show-pointer-button, .screenshot-ui-type-button {
transition-duration: 100ms;
@ -309,8 +346,7 @@ StEntry {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
.screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive {
transition-duration: 100ms;
background-color: transparent;
@ -320,8 +356,7 @@ StEntry {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
/* System Elements */
.login-dialog-prompt-entry, .search-entry {
@ -405,7 +440,7 @@ StEntry StLabel.hint-text {
margin-left: 2px; }
/* Buttons */
.button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
.button, .calendar .calendar-day.calendar-today, .calendar .calendar-day, .calendar .calendar-month-header .pager-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
min-height: 22px; }
.icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button {
@ -512,16 +547,11 @@ StScrollBar {
box-shadow: none;
box-shadow: none !important;
border-radius: 12px; }
.popup-menu-item:ltr {
padding-left: 6px; }
.popup-menu-item:rtl {
padding-right: 6px; }
.popup-menu-item:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
.popup-menu-item:focus, .popup-menu-item:hover {
transition-duration: 100ms;
color: #eeeeec;
@ -545,6 +575,12 @@ StScrollBar {
.popup-menu-item .toggle-switch:rtl {
margin-right: 4px; }
.popup-ornamented-menu-item:ltr {
padding-left: 6px; }
.popup-ornamented-menu-item:rtl {
padding-right: 6px; }
.popup-inactive-menu-item {
color: #eeeeec; }
.popup-inactive-menu-item:insensitive {
@ -557,8 +593,6 @@ StScrollBar {
.popup-sub-menu {
border-radius: 0 0 13px 13px;
margin-bottom: 6px; }
.popup-sub-menu .popup-menu-ornament {
min-width: 1.09em !important; }
.popup-sub-menu .popup-menu-item {
border-radius: 0;
font-weight: normal;
@ -569,10 +603,6 @@ StScrollBar {
color: #eeeeec;
background-color: #4d515f;
border-top-width: 0; }
.popup-sub-menu .popup-menu-item:ltr {
padding-left: 6px; }
.popup-sub-menu .popup-menu-item:rtl {
padding-right: 6px; }
.popup-sub-menu .popup-menu-item:focus, .popup-sub-menu .popup-menu-item:hover {
transition-duration: 100ms;
color: #eeeeec;
@ -598,20 +628,14 @@ StScrollBar {
border-radius: 0 0 12px 12px; }
.popup-menu-ornament {
width: 1.2em;
text-align: center !important; }
.popup-menu-ornament:ltr {
text-align: right; }
.popup-menu-ornament:rtl {
text-align: left; }
icon-size: 1.09em !important;
width: 1.09em; }
.popup-separator-menu-item {
border: none !important; }
.popup-separator-menu-item .popup-separator-menu-item-separator {
height: 1px;
background-color: #0d0e11; }
.popup-separator-menu-item .popup-menu-ornament {
width: 0 !important; }
.popup-sub-menu .popup-separator-menu-item {
background-color: transparent; }
.popup-sub-menu .popup-separator-menu-item:ltr {
@ -627,8 +651,6 @@ StScrollBar {
.app-menu {
max-width: 27.25em; }
.app-menu .popup-menu-ornament {
width: 0 !important; }
.app-menu .popup-inactive-menu-item:first-child > StLabel:ltr {
margin-right: 8px; }
.app-menu .popup-inactive-menu-item:first-child > StLabel:rtl {
@ -661,8 +683,7 @@ StScrollBar {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
.datemenu-today-button:hover {
transition-duration: 100ms;
color: #eeeeec;
@ -702,8 +723,7 @@ StScrollBar {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
.calendar:hover {
transition-duration: 100ms;
color: #eeeeec;
@ -734,67 +754,44 @@ StScrollBar {
.calendar .calendar-month-header .calendar-month-label {
padding: 8px 0; }
.calendar .calendar-month-header .pager-button {
background-color: transparent;
padding: 0 !important;
height: 32px;
width: 32px;
margin: 2px;
border-radius: 8px; }
.calendar .calendar-month-header .pager-button:hover, .calendar .calendar-month-header .pager-button:focus {
background-color: #383d4b; }
.calendar .calendar-month-header .pager-button:active {
background-color: #3d4251; }
.calendar .calendar-day-base {
text-align: center;
margin: 2px;
padding: 0 !important;
border-radius: 8px;
transition-duration: 100ms; }
.calendar .calendar-day {
border-radius: 99px;
height: 3em !important;
width: 3em !important;
border-radius: 99px;
margin: 2px;
padding: 0 !important;
font-weight: 600;
text-align: center;
transition-duration: 100ms; }
.calendar .calendar-day-base:hover {
background-color: #383d4b; }
.calendar .calendar-day-base:focus {
background-color: #3d1e46;
color: inherit;
box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6); }
.calendar .calendar-day-base:active, .calendar .calendar-day-base:selected {
color: white;
background-color: #3d4251; }
.calendar .calendar-day-base:active:focus, .calendar .calendar-day-base:selected:focus {
background-color: #513462; }
.calendar .calendar-day-base.calendar-day-heading {
.calendar .calendar-day.calendar-day-heading {
background-color: transparent;
color: #888a8d;
padding-top: 6px;
height: 1.1em !important;
font-weight: 600; }
.calendar .calendar-day {
font-weight: 600; }
.calendar .calendar-nonwork-day {
color: #888a8d; }
.calendar .calendar-other-month-day {
color: rgba(238, 238, 236, 0.5); }
.calendar .calendar-other-month-day.calendar-nonwork-day {
color: rgba(136, 138, 141, 0.5); }
.calendar .calendar-today {
background-color: #a400a4;
font-weight: 800;
color: #ffffff !important; }
.calendar .calendar-today:hover, .calendar .calendar-today:focus {
background-color: #b300b3;
color: inherit; }
.calendar .calendar-today:active, .calendar .calendar-today:selected {
background-color: #a400a4;
color: inherit; }
.calendar .calendar-today:active:hover, .calendar .calendar-today:active:focus, .calendar .calendar-today:selected:hover, .calendar .calendar-today:selected:focus {
background-color: #b300b3;
color: inherit; }
.calendar .calendar-day-with-events {
background-image: url("assets/calendar-today.svg");
background-size: contain; }
height: 0.93em !important;
padding-top: 6px !important;
margin-bottom: 0;
border-radius: 9px; }
.calendar .calendar-day.calendar-weekend {
color: #888a8d; }
.calendar .calendar-day.calendar-other-month {
color: rgba(136, 138, 141, 0.3) !important;
font-weight: normal; }
.calendar .calendar-day.calendar-today {
color: #ffffff;
/* override weekends */ }
.calendar .calendar-day.calendar-day-with-events {
background-image: url("assets/calendar-today.svg");
background-size: contain; }
.calendar .calendar-week-number {
font-size: 6pt;
font-weight: bold;
font-feature-settings: "tnum";
text-align: center;
margin: 6px;
padding: 0 6px;
border-radius: 3px;
@ -1138,7 +1135,7 @@ StScrollBar {
min-height: 64px;
width: 34em;
box-shadow: 0 2px 4px 2px rgba(0, 0, 0, 0.3);
border-radius: 12px;
border-radius: 16px;
margin: 4px; }
.notification-banner .notification-actions {
spacing: 0; }
@ -1384,21 +1381,21 @@ StScrollBar {
.switcher-list .item-box {
background-color: transparent; }
.switcher-list .item-box:hover {
background-color: rgba(238, 238, 236, 0.1); }
background-color: rgba(255, 255, 255, 0.1); }
.switcher-list .item-box:selected, .switcher-list .item-box:focus {
background-color: rgba(238, 238, 236, 0.13); }
background-color: rgba(255, 255, 255, 0.13); }
.switcher-list .item-box:selected:hover, .switcher-list .item-box:focus:hover {
background-color: rgba(238, 238, 236, 0.16); }
background-color: rgba(255, 255, 255, 0.16); }
.switcher-list .item-box:selected:active, .switcher-list .item-box:focus:active {
background-color: rgba(238, 238, 236, 0.13); }
background-color: rgba(255, 255, 255, 0.13); }
.switcher-list .item-box:active {
background-color: rgba(238, 238, 236, 0.16); }
background-color: rgba(255, 255, 255, 0.16); }
.switcher-list .item-box:outlined, .switcher-list .item-box:checked {
background-color: rgba(238, 238, 236, 0.19); }
background-color: rgba(255, 255, 255, 0.19); }
.switcher-list .item-box:outlined:active, .switcher-list .item-box:checked:active {
background-color: rgba(238, 238, 236, 0.22); }
background-color: rgba(255, 255, 255, 0.22); }
.switcher-list .item-box:outlined:hover, .switcher-list .item-box:checked:hover {
background-color: rgba(238, 238, 236, 0.25); }
background-color: rgba(255, 255, 255, 0.25); }
.switcher-list .item-box:drop {
border: 2px solid rgba(164, 0, 164, 0.8);
background-color: rgba(164, 0, 164, 0.2); }
@ -1495,7 +1492,7 @@ StScrollBar {
background-color: #9f1313; }
.screenshot-ui-shot-cast-container {
background-color: #3b3f4e;
background-color: rgba(255, 255, 255, 0.1);
border-radius: 16px;
padding: 3px;
spacing: 3px; }
@ -1509,12 +1506,12 @@ StScrollBar {
background-color: transparent;
border-radius: 13px; }
.screenshot-ui-shot-cast-button:hover, .screenshot-ui-shot-cast-button:focus {
background-color: #464b5d; }
background-color: rgba(255, 255, 255, 0.2); }
.screenshot-ui-shot-cast-button:active {
background-color: #484d60; }
background-color: rgba(255, 255, 255, 0.5); }
.screenshot-ui-shot-cast-button:checked {
background-color: white;
color: black; }
color: #303340; }
.screenshot-ui-shot-cast-button:insensitive {
color: rgba(255, 255, 255, 0.5); }
.screenshot-ui-shot-cast-button StIcon {
@ -1584,10 +1581,6 @@ StScrollBar {
border: 2px white; }
.screenshot-ui-tooltip {
color: white;
background-color: #303340;
border-radius: 99px;
padding: 6px 12px;
text-align: center;
-y-offset: 24px; }
@ -1598,63 +1591,22 @@ StScrollBar {
height: 2.2em;
transition-duration: 250ms;
box-shadow: inset 0 -1px 0 0 black; }
#panel.unlock-screen, #panel.login-screen, #panel:overview {
background-color: transparent;
box-shadow: none; }
#panel.unlock-screen .panel-button, #panel.login-screen .panel-button, #panel:overview .panel-button {
color: white !important; }
#panel .panel-button {
font-weight: bold;
color: #e2e2df;
-natural-hpadding: 12px;
-minimum-hpadding: 6px;
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px; }
#panel .panel-button.clock-display .clock {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px; }
#panel .panel-button.screen-recording-indicator {
box-shadow: inset 0 0 0 100px #bf1717; }
#panel .panel-button.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px #fd7d00; }
#panel .panel-button.screen-sharing-indicator StBoxLayout {
margin: 0 6px; }
#panel .panel-button.screen-recording-indicator StBoxLayout, #panel .panel-button.screen-sharing-indicator StBoxLayout {
spacing: 6px; }
#panel .panel-button.screen-recording-indicator StIcon, #panel .panel-button.screen-sharing-indicator StIcon {
icon-size: 1.09em; }
#panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.2); }
#panel .panel-button:active.clock-display, #panel .panel-button:overview.clock-display, #panel .panel-button:focus.clock-display, #panel .panel-button:checked.clock-display {
box-shadow: none; }
#panel .panel-button:active.clock-display .clock, #panel .panel-button:overview.clock-display .clock, #panel .panel-button:focus.clock-display .clock, #panel .panel-button:checked.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.2); }
#panel .panel-button:active.screen-recording-indicator, #panel .panel-button:overview.screen-recording-indicator, #panel .panel-button:focus.screen-recording-indicator, #panel .panel-button:checked.screen-recording-indicator {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.85); }
#panel .panel-button:active.screen-sharing-indicator, #panel .panel-button:overview.screen-sharing-indicator, #panel .panel-button:focus.screen-sharing-indicator, #panel .panel-button:checked.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.85); }
#panel .panel-button:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.15); }
#panel .panel-button:hover.clock-display {
box-shadow: none; }
#panel .panel-button:hover.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.15); }
#panel .panel-button:hover.screen-recording-indicator {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.9); }
#panel .panel-button:hover.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.9); }
#panel .panel-button:active:hover, #panel .panel-button:overview:hover, #panel .panel-button:focus:hover, #panel .panel-button:checked:hover {
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: none;
-natural-hpadding: 12px;
-minimum-hpadding: 6px; }
#panel .panel-button:active, #panel .panel-button:focus, #panel .panel-button:checked {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.25); }
#panel .panel-button:active:hover.clock-display, #panel .panel-button:overview:hover.clock-display, #panel .panel-button:focus:hover.clock-display, #panel .panel-button:checked:hover.clock-display {
box-shadow: none; }
#panel .panel-button:active:hover.clock-display .clock, #panel .panel-button:overview:hover.clock-display .clock, #panel .panel-button:focus:hover.clock-display .clock, #panel .panel-button:checked:hover.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.25); }
#panel .panel-button:active:hover.screen-recording-indicator, #panel .panel-button:overview:hover.screen-recording-indicator, #panel .panel-button:focus:hover.screen-recording-indicator, #panel .panel-button:checked:hover.screen-recording-indicator {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.8); }
#panel .panel-button:active:hover.screen-sharing-indicator, #panel .panel-button:overview:hover.screen-sharing-indicator, #panel .panel-button:focus:hover.screen-sharing-indicator, #panel .panel-button:checked:hover.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.8); }
#panel .panel-button:active:hover, #panel .panel-button:focus:hover, #panel .panel-button:checked:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.35); }
#panel .panel-button:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.2); }
#panel .panel-button .system-status-icon {
icon-size: 1.09em;
padding: 5px;
@ -1665,44 +1617,157 @@ StScrollBar {
#panel .panel-button .app-menu-icon {
-st-icon-style: symbolic; }
#panel .panel-button#panelActivities {
-natural-hpadding: 18px; }
#panel.unlock-screen .panel-button:active, #panel.unlock-screen .panel-button:overview, #panel.unlock-screen .panel-button:focus, #panel.unlock-screen .panel-button:checked, #panel.login-screen .panel-button:active, #panel.login-screen .panel-button:overview, #panel.login-screen .panel-button:focus, #panel.login-screen .panel-button:checked, #panel:overview .panel-button:active, #panel:overview .panel-button:overview, #panel:overview .panel-button:focus, #panel:overview .panel-button:checked {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.15); }
#panel.unlock-screen .panel-button:active.clock-display, #panel.unlock-screen .panel-button:overview.clock-display, #panel.unlock-screen .panel-button:focus.clock-display, #panel.unlock-screen .panel-button:checked.clock-display, #panel.login-screen .panel-button:active.clock-display, #panel.login-screen .panel-button:overview.clock-display, #panel.login-screen .panel-button:focus.clock-display, #panel.login-screen .panel-button:checked.clock-display, #panel:overview .panel-button:active.clock-display, #panel:overview .panel-button:overview.clock-display, #panel:overview .panel-button:focus.clock-display, #panel:overview .panel-button:checked.clock-display {
box-shadow: none; }
#panel.unlock-screen .panel-button:active.clock-display .clock, #panel.unlock-screen .panel-button:overview.clock-display .clock, #panel.unlock-screen .panel-button:focus.clock-display .clock, #panel.unlock-screen .panel-button:checked.clock-display .clock, #panel.login-screen .panel-button:active.clock-display .clock, #panel.login-screen .panel-button:overview.clock-display .clock, #panel.login-screen .panel-button:focus.clock-display .clock, #panel.login-screen .panel-button:checked.clock-display .clock, #panel:overview .panel-button:active.clock-display .clock, #panel:overview .panel-button:overview.clock-display .clock, #panel:overview .panel-button:focus.clock-display .clock, #panel:overview .panel-button:checked.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.15); }
#panel.unlock-screen .panel-button:active.screen-recording-indicator, #panel.unlock-screen .panel-button:overview.screen-recording-indicator, #panel.unlock-screen .panel-button:focus.screen-recording-indicator, #panel.unlock-screen .panel-button:checked.screen-recording-indicator, #panel.login-screen .panel-button:active.screen-recording-indicator, #panel.login-screen .panel-button:overview.screen-recording-indicator, #panel.login-screen .panel-button:focus.screen-recording-indicator, #panel.login-screen .panel-button:checked.screen-recording-indicator, #panel:overview .panel-button:active.screen-recording-indicator, #panel:overview .panel-button:overview.screen-recording-indicator, #panel:overview .panel-button:focus.screen-recording-indicator, #panel:overview .panel-button:checked.screen-recording-indicator {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.85); }
#panel.unlock-screen .panel-button:active.screen-sharing-indicator, #panel.unlock-screen .panel-button:overview.screen-sharing-indicator, #panel.unlock-screen .panel-button:focus.screen-sharing-indicator, #panel.unlock-screen .panel-button:checked.screen-sharing-indicator, #panel.login-screen .panel-button:active.screen-sharing-indicator, #panel.login-screen .panel-button:overview.screen-sharing-indicator, #panel.login-screen .panel-button:focus.screen-sharing-indicator, #panel.login-screen .panel-button:checked.screen-sharing-indicator, #panel:overview .panel-button:active.screen-sharing-indicator, #panel:overview .panel-button:overview.screen-sharing-indicator, #panel:overview .panel-button:focus.screen-sharing-indicator, #panel:overview .panel-button:checked.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.85); }
#panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel:overview .panel-button:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.1); }
#panel.unlock-screen .panel-button:hover.clock-display, #panel.login-screen .panel-button:hover.clock-display, #panel:overview .panel-button:hover.clock-display {
box-shadow: none; }
#panel.unlock-screen .panel-button:hover.clock-display .clock, #panel.login-screen .panel-button:hover.clock-display .clock, #panel:overview .panel-button:hover.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.1); }
#panel.unlock-screen .panel-button:hover.screen-recording-indicator, #panel.login-screen .panel-button:hover.screen-recording-indicator, #panel:overview .panel-button:hover.screen-recording-indicator {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.9); }
#panel.unlock-screen .panel-button:hover.screen-sharing-indicator, #panel.login-screen .panel-button:hover.screen-sharing-indicator, #panel:overview .panel-button:hover.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.9); }
#panel.unlock-screen .panel-button:active:hover, #panel.unlock-screen .panel-button:overview:hover, #panel.unlock-screen .panel-button:focus:hover, #panel.unlock-screen .panel-button:checked:hover, #panel.login-screen .panel-button:active:hover, #panel.login-screen .panel-button:overview:hover, #panel.login-screen .panel-button:focus:hover, #panel.login-screen .panel-button:checked:hover, #panel:overview .panel-button:active:hover, #panel:overview .panel-button:overview:hover, #panel:overview .panel-button:focus:hover, #panel:overview .panel-button:checked:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel.unlock-screen .panel-button:active:hover.clock-display, #panel.unlock-screen .panel-button:overview:hover.clock-display, #panel.unlock-screen .panel-button:focus:hover.clock-display, #panel.unlock-screen .panel-button:checked:hover.clock-display, #panel.login-screen .panel-button:active:hover.clock-display, #panel.login-screen .panel-button:overview:hover.clock-display, #panel.login-screen .panel-button:focus:hover.clock-display, #panel.login-screen .panel-button:checked:hover.clock-display, #panel:overview .panel-button:active:hover.clock-display, #panel:overview .panel-button:overview:hover.clock-display, #panel:overview .panel-button:focus:hover.clock-display, #panel:overview .panel-button:checked:hover.clock-display {
box-shadow: none; }
#panel.unlock-screen .panel-button:active:hover.clock-display .clock, #panel.unlock-screen .panel-button:overview:hover.clock-display .clock, #panel.unlock-screen .panel-button:focus:hover.clock-display .clock, #panel.unlock-screen .panel-button:checked:hover.clock-display .clock, #panel.login-screen .panel-button:active:hover.clock-display .clock, #panel.login-screen .panel-button:overview:hover.clock-display .clock, #panel.login-screen .panel-button:focus:hover.clock-display .clock, #panel.login-screen .panel-button:checked:hover.clock-display .clock, #panel:overview .panel-button:active:hover.clock-display .clock, #panel:overview .panel-button:overview:hover.clock-display .clock, #panel:overview .panel-button:focus:hover.clock-display .clock, #panel:overview .panel-button:checked:hover.clock-display .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel.unlock-screen .panel-button:active:hover.screen-recording-indicator, #panel.unlock-screen .panel-button:overview:hover.screen-recording-indicator, #panel.unlock-screen .panel-button:focus:hover.screen-recording-indicator, #panel.unlock-screen .panel-button:checked:hover.screen-recording-indicator, #panel.login-screen .panel-button:active:hover.screen-recording-indicator, #panel.login-screen .panel-button:overview:hover.screen-recording-indicator, #panel.login-screen .panel-button:focus:hover.screen-recording-indicator, #panel.login-screen .panel-button:checked:hover.screen-recording-indicator, #panel:overview .panel-button:active:hover.screen-recording-indicator, #panel:overview .panel-button:overview:hover.screen-recording-indicator, #panel:overview .panel-button:focus:hover.screen-recording-indicator, #panel:overview .panel-button:checked:hover.screen-recording-indicator {
-natural-hpadding: 15px; }
#panel .panel-button#panelActivities StBoxLayout {
spacing: 5px; }
#panel .panel-button#panelActivities .workspace-dot {
border-radius: 999px;
min-width: 8px;
min-height: 8px;
background-color: #e2e2df; }
#panel .panel-button.screen-recording-indicator StBoxLayout, #panel .panel-button.screen-sharing-indicator StBoxLayout {
spacing: 6px; }
#panel .panel-button.screen-recording-indicator StIcon, #panel .panel-button.screen-sharing-indicator StIcon {
icon-size: 1.09em; }
#panel .panel-button.screen-recording-indicator {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.8); }
#panel.unlock-screen .panel-button:active:hover.screen-sharing-indicator, #panel.unlock-screen .panel-button:overview:hover.screen-sharing-indicator, #panel.unlock-screen .panel-button:focus:hover.screen-sharing-indicator, #panel.unlock-screen .panel-button:checked:hover.screen-sharing-indicator, #panel.login-screen .panel-button:active:hover.screen-sharing-indicator, #panel.login-screen .panel-button:overview:hover.screen-sharing-indicator, #panel.login-screen .panel-button:focus:hover.screen-sharing-indicator, #panel.login-screen .panel-button:checked:hover.screen-sharing-indicator, #panel:overview .panel-button:active:hover.screen-sharing-indicator, #panel:overview .panel-button:overview:hover.screen-sharing-indicator, #panel:overview .panel-button:focus:hover.screen-sharing-indicator, #panel:overview .panel-button:checked:hover.screen-sharing-indicator {
#panel .panel-button.screen-recording-indicator:active, #panel .panel-button.screen-recording-indicator:focus, #panel .panel-button.screen-recording-indicator:checked {
box-shadow: inset 0 0 0 100px #bf1717; }
#panel .panel-button.screen-recording-indicator:active:hover, #panel .panel-button.screen-recording-indicator:focus:hover, #panel .panel-button.screen-recording-indicator:checked:hover {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.95); }
#panel .panel-button.screen-recording-indicator:hover {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.9); }
#panel .panel-button.screen-sharing-indicator {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.8); }
#panel .panel-button.screen-sharing-indicator:active, #panel .panel-button.screen-sharing-indicator:focus, #panel .panel-button.screen-sharing-indicator:checked {
box-shadow: inset 0 0 0 100px #fd7d00; }
#panel .panel-button.screen-sharing-indicator:active:hover, #panel .panel-button.screen-sharing-indicator:focus:hover, #panel .panel-button.screen-sharing-indicator:checked:hover {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.95); }
#panel .panel-button.screen-sharing-indicator:hover {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.9); }
#panel .panel-button.clock-display {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: none;
box-shadow: none !important; }
#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:focus, #panel .panel-button.clock-display:checked {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.25); }
#panel .panel-button.clock-display:active:hover, #panel .panel-button.clock-display:focus:hover, #panel .panel-button.clock-display:checked:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.35); }
#panel .panel-button.clock-display:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.2); }
#panel .panel-button.clock-display .clock {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px; }
#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:focus, #panel .panel-button.clock-display:checked {
box-shadow: none !important; }
#panel .panel-button.clock-display:active .clock, #panel .panel-button.clock-display:focus .clock, #panel .panel-button.clock-display:checked .clock {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.25); }
#panel .panel-button.clock-display:active .clock:hover, #panel .panel-button.clock-display:focus .clock:hover, #panel .panel-button.clock-display:checked .clock:hover {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.35) !important; }
#panel .panel-button.clock-display:hover {
box-shadow: none !important; }
#panel .panel-button.clock-display:hover .clock {
box-shadow: inset 0 0 0 100px rgba(226, 226, 223, 0.2); }
#panel.unlock-screen, #panel.login-screen, #panel:overview {
background-color: transparent;
box-shadow: none; }
#panel.unlock-screen .panel-button, #panel.login-screen .panel-button, #panel:overview .panel-button {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: white;
box-shadow: none; }
#panel.unlock-screen .panel-button:active, #panel.unlock-screen .panel-button:focus, #panel.unlock-screen .panel-button:checked, #panel.login-screen .panel-button:active, #panel.login-screen .panel-button:focus, #panel.login-screen .panel-button:checked, #panel:overview .panel-button:active, #panel:overview .panel-button:focus, #panel:overview .panel-button:checked {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); }
#panel.unlock-screen .panel-button:active:hover, #panel.unlock-screen .panel-button:focus:hover, #panel.unlock-screen .panel-button:checked:hover, #panel.login-screen .panel-button:active:hover, #panel.login-screen .panel-button:focus:hover, #panel.login-screen .panel-button:checked:hover, #panel:overview .panel-button:active:hover, #panel:overview .panel-button:focus:hover, #panel:overview .panel-button:checked:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.35); }
#panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel:overview .panel-button:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel.unlock-screen .panel-button#panelActivities .workspace-dot, #panel.login-screen .panel-button#panelActivities .workspace-dot, #panel:overview .panel-button#panelActivities .workspace-dot {
background-color: white; }
#panel.unlock-screen .panel-button.clock-display, #panel.login-screen .panel-button.clock-display, #panel:overview .panel-button.clock-display {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: white;
box-shadow: none;
box-shadow: none !important; }
#panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:focus, #panel.unlock-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:checked {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); }
#panel.unlock-screen .panel-button.clock-display:active:hover, #panel.unlock-screen .panel-button.clock-display:focus:hover, #panel.unlock-screen .panel-button.clock-display:checked:hover, #panel.login-screen .panel-button.clock-display:active:hover, #panel.login-screen .panel-button.clock-display:focus:hover, #panel.login-screen .panel-button.clock-display:checked:hover, #panel:overview .panel-button.clock-display:active:hover, #panel:overview .panel-button.clock-display:focus:hover, #panel:overview .panel-button.clock-display:checked:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.35); }
#panel.unlock-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px; }
#panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:focus, #panel.unlock-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:checked {
box-shadow: none !important; }
#panel.unlock-screen .panel-button.clock-display:active .clock, #panel.unlock-screen .panel-button.clock-display:focus .clock, #panel.unlock-screen .panel-button.clock-display:checked .clock, #panel.login-screen .panel-button.clock-display:active .clock, #panel.login-screen .panel-button.clock-display:focus .clock, #panel.login-screen .panel-button.clock-display:checked .clock, #panel:overview .panel-button.clock-display:active .clock, #panel:overview .panel-button.clock-display:focus .clock, #panel:overview .panel-button.clock-display:checked .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); }
#panel.unlock-screen .panel-button.clock-display:active .clock:hover, #panel.unlock-screen .panel-button.clock-display:focus .clock:hover, #panel.unlock-screen .panel-button.clock-display:checked .clock:hover, #panel.login-screen .panel-button.clock-display:active .clock:hover, #panel.login-screen .panel-button.clock-display:focus .clock:hover, #panel.login-screen .panel-button.clock-display:checked .clock:hover, #panel:overview .panel-button.clock-display:active .clock:hover, #panel:overview .panel-button.clock-display:focus .clock:hover, #panel:overview .panel-button.clock-display:checked .clock:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.35) !important; }
#panel.unlock-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:hover {
box-shadow: none !important; }
#panel.unlock-screen .panel-button.clock-display:hover .clock, #panel.login-screen .panel-button.clock-display:hover .clock, #panel:overview .panel-button.clock-display:hover .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel.unlock-screen .panel-button.screen-recording-indicator, #panel.login-screen .panel-button.screen-recording-indicator, #panel:overview .panel-button.screen-recording-indicator {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.8); }
#panel.unlock-screen .panel-button.screen-recording-indicator:active, #panel.unlock-screen .panel-button.screen-recording-indicator:focus, #panel.unlock-screen .panel-button.screen-recording-indicator:checked, #panel.login-screen .panel-button.screen-recording-indicator:active, #panel.login-screen .panel-button.screen-recording-indicator:focus, #panel.login-screen .panel-button.screen-recording-indicator:checked, #panel:overview .panel-button.screen-recording-indicator:active, #panel:overview .panel-button.screen-recording-indicator:focus, #panel:overview .panel-button.screen-recording-indicator:checked {
box-shadow: inset 0 0 0 100px #bf1717; }
#panel.unlock-screen .panel-button.screen-recording-indicator:active:hover, #panel.unlock-screen .panel-button.screen-recording-indicator:focus:hover, #panel.unlock-screen .panel-button.screen-recording-indicator:checked:hover, #panel.login-screen .panel-button.screen-recording-indicator:active:hover, #panel.login-screen .panel-button.screen-recording-indicator:focus:hover, #panel.login-screen .panel-button.screen-recording-indicator:checked:hover, #panel:overview .panel-button.screen-recording-indicator:active:hover, #panel:overview .panel-button.screen-recording-indicator:focus:hover, #panel:overview .panel-button.screen-recording-indicator:checked:hover {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.95); }
#panel.unlock-screen .panel-button.screen-recording-indicator:hover, #panel.login-screen .panel-button.screen-recording-indicator:hover, #panel:overview .panel-button.screen-recording-indicator:hover {
box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.9); }
#panel.unlock-screen .panel-button.screen-sharing-indicator, #panel.login-screen .panel-button.screen-sharing-indicator, #panel:overview .panel-button.screen-sharing-indicator {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: #e2e2df;
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.8); }
#panel.unlock-screen .panel-button.screen-sharing-indicator:active, #panel.unlock-screen .panel-button.screen-sharing-indicator:focus, #panel.unlock-screen .panel-button.screen-sharing-indicator:checked, #panel.login-screen .panel-button.screen-sharing-indicator:active, #panel.login-screen .panel-button.screen-sharing-indicator:focus, #panel.login-screen .panel-button.screen-sharing-indicator:checked, #panel:overview .panel-button.screen-sharing-indicator:active, #panel:overview .panel-button.screen-sharing-indicator:focus, #panel:overview .panel-button.screen-sharing-indicator:checked {
box-shadow: inset 0 0 0 100px #fd7d00; }
#panel.unlock-screen .panel-button.screen-sharing-indicator:active:hover, #panel.unlock-screen .panel-button.screen-sharing-indicator:focus:hover, #panel.unlock-screen .panel-button.screen-sharing-indicator:checked:hover, #panel.login-screen .panel-button.screen-sharing-indicator:active:hover, #panel.login-screen .panel-button.screen-sharing-indicator:focus:hover, #panel.login-screen .panel-button.screen-sharing-indicator:checked:hover, #panel:overview .panel-button.screen-sharing-indicator:active:hover, #panel:overview .panel-button.screen-sharing-indicator:focus:hover, #panel:overview .panel-button.screen-sharing-indicator:checked:hover {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.95); }
#panel.unlock-screen .panel-button.screen-sharing-indicator:hover, #panel.login-screen .panel-button.screen-sharing-indicator:hover, #panel:overview .panel-button.screen-sharing-indicator:hover {
box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.9); }
#panel .panel-status-indicators-box,
#panel .panel-status-menu-box {
spacing: 2px; }
#panel .power-status.panel-status-indicators-box {
spacing: 0; }
#panel .screencast-indicator,
#panel .remote-access-indicator {
#panel .privacy-indicator {
color: #fd7d00; }
#appMenu {
@ -1733,7 +1798,7 @@ StScrollBar {
.quick-settings {
padding: 18px;
border-radius: 36px; }
.quick-settings .icon-button, .quick-settings .login-dialog-button.cancel-button, .quick-settings .login-dialog-button.switch-user-button, .quick-settings .login-dialog-button.login-dialog-session-list-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button {
.quick-settings .icon-button, .quick-settings .login-dialog-button.cancel-button, .quick-settings .login-dialog-button.switch-user-button, .quick-settings .login-dialog-button.login-dialog-session-list-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button, .quick-settings .calendar .calendar-month-header .pager-button, .calendar .calendar-month-header .quick-settings .pager-button, .quick-settings .calendar .calendar-day, .calendar .quick-settings .calendar-day {
padding: 10.5px; }
.quick-settings-grid {
@ -1770,7 +1835,7 @@ StScrollBar {
color: rgba(255, 255, 255, 0.5); }
.quick-toggle > StBoxLayout {
spacing: 9px; }
.quick-toggle.button, .quick-toggle.icon-button, .quick-toggle.login-dialog-button.cancel-button, .quick-toggle.login-dialog-button.switch-user-button, .quick-toggle.login-dialog-button.login-dialog-session-list-button, .background-app-item .quick-toggle.close-button {
.quick-toggle.button, .quick-toggle.icon-button, .quick-toggle.login-dialog-button.cancel-button, .quick-toggle.login-dialog-button.switch-user-button, .quick-toggle.login-dialog-button.login-dialog-session-list-button, .background-app-item .quick-toggle.close-button, .calendar .calendar-month-header .quick-toggle.pager-button, .calendar .quick-toggle.calendar-day {
padding: 0; }
.quick-toggle > StBoxLayout {
padding: 0 12px; }
@ -1804,7 +1869,8 @@ StScrollBar {
.quick-menu-toggle .quick-toggle-arrow {
padding: 6px 10.5px;
border-width: 0; }
border-width: 0;
border-color: rgba(238, 238, 236, 0.25); }
.quick-menu-toggle .quick-toggle-arrow:checked {
transition-duration: 100ms;
background-color: #a400a4;
@ -1927,6 +1993,30 @@ StScrollBar {
.device-subtitle {
color: rgba(238, 238, 236, 0.5); }
.keyboard-brightness-item .slider {
min-height: 16px; }
.keyboard-brightness-level {
spacing: 6px; }
.keyboard-brightness-level .button:checked, .keyboard-brightness-level .icon-button:checked, .keyboard-brightness-level .login-dialog-button.cancel-button:checked, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked, .keyboard-brightness-level .background-app-item .close-button:checked, .background-app-item .keyboard-brightness-level .close-button:checked, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked, .keyboard-brightness-level .calendar .calendar-day:checked, .calendar .keyboard-brightness-level .calendar-day:checked {
transition-duration: 100ms;
background-color: #a400a4;
color: #ffffff; }
.keyboard-brightness-level .button:checked:focus, .keyboard-brightness-level .icon-button:checked:focus, .keyboard-brightness-level .login-dialog-button.cancel-button:checked:focus, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked:focus, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked:focus, .keyboard-brightness-level .background-app-item .close-button:checked:focus, .background-app-item .keyboard-brightness-level .close-button:checked:focus, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked:focus, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked:focus, .keyboard-brightness-level .calendar .calendar-day:checked:focus, .calendar .keyboard-brightness-level .calendar-day:checked:focus {
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.6) !important; }
.keyboard-brightness-level .button:checked:hover, .keyboard-brightness-level .icon-button:checked:hover, .keyboard-brightness-level .login-dialog-button.cancel-button:checked:hover, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked:hover, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked:hover, .keyboard-brightness-level .background-app-item .close-button:checked:hover, .background-app-item .keyboard-brightness-level .close-button:checked:hover, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked:hover, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked:hover, .keyboard-brightness-level .calendar .calendar-day:checked:hover, .calendar .keyboard-brightness-level .calendar-day:checked:hover, .keyboard-brightness-level .button:checked:focus, .keyboard-brightness-level .icon-button:checked:focus, .keyboard-brightness-level .login-dialog-button.cancel-button:checked:focus, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked:focus, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked:focus, .keyboard-brightness-level .background-app-item .close-button:checked:focus, .background-app-item .keyboard-brightness-level .close-button:checked:focus, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked:focus, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked:focus, .keyboard-brightness-level .calendar .calendar-day:checked:focus, .calendar .keyboard-brightness-level .calendar-day:checked:focus {
background-color: #be00be;
color: white; }
.keyboard-brightness-level .button:checked:active, .keyboard-brightness-level .icon-button:checked:active, .keyboard-brightness-level .login-dialog-button.cancel-button:checked:active, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked:active, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked:active, .keyboard-brightness-level .background-app-item .close-button:checked:active, .background-app-item .keyboard-brightness-level .close-button:checked:active, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked:active, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked:active, .keyboard-brightness-level .calendar .calendar-day:checked:active, .calendar .keyboard-brightness-level .calendar-day:checked:active {
background-color: purple;
color: #ededed; }
.keyboard-brightness-level .button:checked:insensitive, .keyboard-brightness-level .icon-button:checked:insensitive, .keyboard-brightness-level .login-dialog-button.cancel-button:checked:insensitive, .keyboard-brightness-level .login-dialog-button.switch-user-button:checked:insensitive, .keyboard-brightness-level .login-dialog-button.login-dialog-session-list-button:checked:insensitive, .keyboard-brightness-level .background-app-item .close-button:checked:insensitive, .background-app-item .keyboard-brightness-level .close-button:checked:insensitive, .keyboard-brightness-level .calendar .calendar-month-header .pager-button:checked:insensitive, .calendar .calendar-month-header .keyboard-brightness-level .pager-button:checked:insensitive, .keyboard-brightness-level .calendar .calendar-day:checked:insensitive, .calendar .keyboard-brightness-level .calendar-day:checked:insensitive {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: rgba(164, 0, 164, 0.5);
color: rgba(255, 255, 255, 0.5); }
.background-apps-quick-toggle {
min-height: 40px;
background-color: transparent; }
@ -1940,6 +2030,9 @@ StScrollBar {
.background-app-item .close-button {
padding: 6px; }
.background-app-item .spinner {
padding: 6px; }
.background-app-item.popup-inactive-menu-item {
color: #eeeeec; }
@ -2200,16 +2293,16 @@ StScrollBar {
.app-folder-dialog {
border-radius: 64px;
background-color: #23252e;
background-color: #3d3f48;
padding: 12px;
box-shadow: inset 0 0 0 1px rgba(238, 238, 236, 0.07); }
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1); }
.app-folder-dialog .folder-name-container {
padding: 24px 36px 0;
spacing: 12px;
/* FIXME: this is to keep the label in sync with the entry */ }
.app-folder-dialog .folder-name-container .folder-name-entry {
width: 12em;
border-radius: 16px; }
color: white !important; }
.app-folder-dialog .folder-name-container .folder-name-label {
padding: 5px 7px;
color: white; }
@ -2254,7 +2347,8 @@ StScrollBar {
width: 10px;
height: 10px;
border-radius: 10px;
background-color: white; }
background-color: white;
transition-duration: 400ms; }
.apps-scroll-view {
padding: 0; }
@ -2285,7 +2379,8 @@ StScrollBar {
padding: 18px;
width: 24px;
height: 24px;
border-radius: 99px; }
border-radius: 99px;
transition-duration: 100ms; }
.page-navigation-arrow > StIcon {
color: white; }
.page-navigation-arrow:insensitive {
@ -2297,8 +2392,7 @@ StScrollBar {
transition-duration: 100ms;
color: rgba(238, 238, 236, 0.5);
background-color: rgba(238, 238, 236, 0.05);
background-color: transparent;
color: rgba(255, 255, 255, 0.5); }
background-color: transparent; }
.page-navigation-arrow:hover {
transition-duration: 100ms;
color: white;
@ -2553,7 +2647,8 @@ StScrollBar {
#LookingGlassDialog {
background-color: rgba(48, 51, 64, 0.98);
color: white;
border-radius: 0 0 16px 16px;
border-radius: 16px;
margin-top: 4px;
border-top-width: 0;
padding: 6px;
spacing: 6px;
@ -2785,6 +2880,11 @@ StScrollBar {
/* Screen Shield */
.unlock-dialog {
background-color: transparent; }
.unlock-dialog .login-dialog-prompt-entry:focus {
transition-duration: 100ms;
background-color: rgba(255, 255, 255, 0.2625);
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.2);
color: white; }
.screen-shield-background {
background: black;
@ -2878,6 +2978,12 @@ StScrollBar {
.icon-dropshadow {
icon-shadow: 0 1px 5px rgba(0, 0, 0, 0.3); }
/* Slider */
.slider {
-barlevel-border-width: 0;
-barlevel-height: 6px;
-slider-handle-radius: 0; }
/* Message List */
.message-list-controls {
spacing: 12px;
@ -2936,39 +3042,28 @@ StScrollBar {
box-shadow: none; }
#panel StIcon {
icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); }
#panel.unlock-screen, #panel.login-screen, #panel.lock-screen, #panel:overview {
background-color: transparent; }
#panel.unlock-screen .panel-button, #panel.unlock-screen .panel-button:hover, #panel.unlock-screen .panel-button:active, #panel.unlock-screen .panel-button:focus, #panel.unlock-screen .panel-button:overview, #panel.unlock-screen .panel-button:checked, #panel.login-screen .panel-button, #panel.login-screen .panel-button:hover, #panel.login-screen .panel-button:active, #panel.login-screen .panel-button:focus, #panel.login-screen .panel-button:overview, #panel.login-screen .panel-button:checked, #panel.lock-screen .panel-button, #panel.lock-screen .panel-button:hover, #panel.lock-screen .panel-button:active, #panel.lock-screen .panel-button:focus, #panel.lock-screen .panel-button:overview, #panel.lock-screen .panel-button:checked, #panel:overview .panel-button, #panel:overview .panel-button:hover, #panel:overview .panel-button:active, #panel:overview .panel-button:focus, #panel:overview .panel-button:overview, #panel:overview .panel-button:checked {
color: white; }
#panel .panel-button {
color: white; }
#panel .panel-button:hover, #panel .panel-button:active, #panel .panel-button:focus, #panel .panel-button:overview, #panel .panel-button:checked {
color: white;
#panel .panel-button:active, #panel .panel-button:focus, #panel .panel-button:checked {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); }
#panel .panel-button:active:hover, #panel .panel-button:focus:hover, #panel .panel-button:checked:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.35); }
#panel .panel-button:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel .panel-button.screen-recording-indicator {
#panel .panel-button.clock-display {
color: white; }
#panel .panel-button.clock-display:active .clock, #panel .panel-button.clock-display:focus .clock, #panel .panel-button.clock-display:checked .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); }
#panel .panel-button.clock-display:active .clock:hover, #panel .panel-button.clock-display:focus .clock:hover, #panel .panel-button.clock-display:checked .clock:hover {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.35); }
#panel .panel-button.clock-display:hover {
box-shadow: none !important; }
#panel .panel-button.clock-display:hover .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel .panel-button#panelActivities .workspace-dot {
background-color: white; }
#panel .panel-button.screen-recording-indicator, #panel .panel-button.screen-sharing-indicator {
color: white; }
#panel .panel-button.clock-display:hover, #panel .panel-button.clock-display:active, #panel .panel-button.clock-display:overview, #panel .panel-button.clock-display:focus, #panel .panel-button.clock-display:checked {
box-shadow: none; }
#panel .panel-button.clock-display:hover .clock, #panel .panel-button.clock-display:active .clock, #panel .panel-button.clock-display:overview .clock, #panel .panel-button.clock-display:focus .clock, #panel .panel-button.clock-display:checked .clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
#panel #panelActivities.panel-button {
margin-left: .4em; }
#panel #panelActivities.panel-button StLabel {
background-image: url("assets/view-grid-symbolic-dark.svg");
background-size: contain;
width: 1.5em;
height: 1.5em;
color: transparent; }
#panel #panelActivities.panel-button:overview StLabel {
background-image: url("assets/view-grid-symbolic-dark.svg"); }
/* Date/Time Menu */
.datemenu-today-button:insensitive {
color: inherit; }
/* Quick Settings */
.quick-toggle-menu .header .icon.active {
color: #ffffff; }
/* Search */
.search-entry {
@ -3037,10 +3132,7 @@ StScrollBar {
.app-folder-dialog {
background: black;
color: white;
box-shadow: 0 0 100px #0a0a0a; }
.app-folder-dialog .folder-name-container .folder-name-entry {
color: white; }
/* OSD */
.osd-window, .workspace-switcher {

File diff suppressed because it is too large Load Diff

View File

@ -129,5 +129,6 @@ $dim_label_opacity: 0.55;
// Gnome's color palette
$light_1: white;
$light_3: red;
$light_3: red; // not used after theme tweaks
$dark_5: black;
$orange_3: $warning_color;

View File

@ -12,6 +12,13 @@ $dialog_box_shadow: 0 2px 6px -2px transparentize(black, .8);
icon-shadow: 0 1px 5px $shadow_color;
}
/* Slider */
.slider {
-barlevel-border-width: 0;
-barlevel-height: 6px;
-slider-handle-radius: 0;
}
/* Message List */
.message-list-controls {
spacing: $base_padding * 2;
@ -84,62 +91,49 @@ $dialog_box_shadow: 0 2px 6px -2px transparentize(black, .8);
StIcon { icon-shadow: $_panel_text_shadow; }
&.unlock-screen,
&.login-screen,
&.lock-screen,
&:overview {
background-color: transparent;
.panel-button {
&, &:hover, &:active, &:focus, &:overview, &:checked { color: white; }
}
}
.panel-button {
color: $_panel_fg;
&:hover, &:active, &:focus, &:overview, &:checked {
color: $_panel_fg;
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, if($variant == 'light', 1, .2));
}
&.screen-recording-indicator { color: white; }
}
.panel-button.clock-display {
// Move highlight from .panel-button to .clock
&:hover, &:active, &:overview, &:focus, &:checked {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, if($variant == 'light', 1, .2));
&:active, &:focus, &:checked {
box-shadow: inset 0 0 0 100px transparentize(white, if($variant == 'light', .25, .75));
&:hover {
box-shadow: inset 0 0 0 100px transparentize(white, if($variant == 'light', .15, .65));
}
}
}
#panelActivities.panel-button {
margin-left: .4em;
StLabel {
background-image: if($variant == 'light', url("assets/view-grid-symbolic.svg"),
url("assets/view-grid-symbolic-dark.svg"));
background-size: contain;
width: 1.5em;
height: 1.5em;
color: transparent;
&:hover {
box-shadow: inset 0 0 0 100px transparentize(white, if($variant == 'light', 0, .8));
}
&:overview StLabel {
background-image: url("assets/view-grid-symbolic-dark.svg");
}
}
}
&.clock-display {
color: $_panel_fg;
/* Date/Time Menu */
.datemenu-today-button {
&:insensitive { color: inherit; }
}
/* Quick Settings */
.quick-toggle-menu {
& .header {
& .icon {
&.active { color: $selected_fg_color; }
&:active, &:focus, &:checked {
.clock {
box-shadow: inset 0 0 0 100px transparentize(white, if($variant == 'light', .25, .75));
&:hover {
box-shadow: inset 0 0 0 100px transparentize(white, if($variant == 'light', .15, .65));
}
}
}
&:hover {
box-shadow: none !important;
.clock {
box-shadow: inset 0 0 0 100px transparentize(white, if($variant == 'light', 0, .8));
}
}
}
&#panelActivities {
& .workspace-dot {
background-color: $_panel_fg;
}
}
&.screen-recording-indicator,
&.screen-sharing-indicator {
color: white;
}
}
}
@ -219,10 +213,7 @@ $dialog_box_shadow: 0 2px 6px -2px transparentize(black, .8);
.app-folder-dialog {
background: black;
color: $osd_fg_color;
box-shadow: 0 0 100px lighten(black, 4%);
& .folder-name-container .folder-name-entry { color: white; }
}
/* OSD */

View File

@ -22,14 +22,14 @@ $outer_borders_color: if($variant == 'light', darken($bg_color, 7%), lighten($bg
$link_color: if($variant == 'light', darken($selected_bg_color, 10%), lighten($selected_bg_color, 20%));
$link_visited_color: if($variant == 'light', darken($selected_bg_color, 20%), lighten($selected_bg_color, 10%));
$warning_color: if($variant == 'light', $yellow_5, $yellow_3);
$error_color: if($variant == 'light', $red_3, $red_4);
$warning_color: if($variant == 'light', $yellow_4, $yellow_3);
$error_color: if($variant == 'light', $red_4, $red_3);
$success_color: if($variant == 'light', $green_4, $green_5);
$destructive_color: $error_color;
// color definitions for OSD elements
$osd_fg_color: if($variant == 'light', $_dark_base_color, $light_1);
$osd_bg_color: if($variant == 'light', $light_3, lighten($_dark_base_color, 5%));
$osd_fg_color: $light_1;
$osd_bg_color: lighten($_dark_base_color, 5%);
// derived osd colors
$osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_color, 1), 10%), 0.5);

View File

@ -90,6 +90,7 @@ stage {
&:selected,
&:active { @include button(active);}
&:checked { @include button(checked);}
&.default { @include button(default);}
&.flat {
@include button(normal, $flat:true);
@ -99,6 +100,7 @@ stage {
&:selected,
&:active { @include button(active, $flat:true);}
&:checked { @include button(checked, $flat:true);}
&.default { @include button(default, $flat:false);}
}
}
@ -167,6 +169,7 @@ stage {
// tooltip
%tooltip {
background-color: transparentize(black, 0.1);
border: 1px solid transparentize($light_1, 0.9);
color: $light_1;
border-radius: 99px;
@ -174,6 +177,7 @@ stage {
text-align: center;
@if $is_highcontrast {
background-color: black;
border-color: $hc_inset_color;
}
}
@ -245,9 +249,9 @@ stage {
%osd_entry {
@extend %entry_common;
@include entry(normal, $c:$osd_fg_color,);
&:hover { @include entry(hover, $c:$osd_fg_color,);}
&:focus { @include entry(focus, $c:$osd_fg_color,);}
&:insensitive { @include entry(insensitive, $c:$osd_fg_color,);}
&:hover { @include entry(hover, $c:$osd_fg_color);}
&:focus { @include entry(focus, $c:$osd_fg_color);}
&:insensitive { @include entry(insensitive, $c:$osd_fg_color);}
StLabel.hint-text {color: transparentize($osd_fg_color, 0.3); }
}
@ -255,18 +259,18 @@ stage {
// buttons on OSD elements
%osd_button {
@extend %button_common;
@include button(normal, $tc:$osd_fg_color, $c:$osd_bg_color);
&:insensitive { @include button(insensitive, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:focus { @include button(focus, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:hover { @include button(hover, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:active { @include button(active, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:outlined,&:checked { @include button(checked, $tc:$osd_fg_color, $c:$osd_bg_color);}
@include button(normal, $tc:$osd_fg_color, $c:$osd_bg_color, $osd:true);
&:insensitive { @include button(insensitive, $tc:$osd_fg_color, $c:$osd_bg_color, $osd:true);}
&:focus { @include button(focus, $tc:$osd_fg_color, $c:$osd_bg_color, $osd:true);}
&:hover { @include button(hover, $tc:$osd_fg_color, $c:$osd_bg_color, $osd:true);}
&:active { @include button(active, $tc:$osd_fg_color, $c:$osd_bg_color, $osd:true);}
&:outlined,&:checked { @include button(checked, $tc:$osd_fg_color, $c:$osd_bg_color, $osd:true);}
}
%osd_button_flat {
@extend %osd_button;
@include button(undecorated);
&:insensitive { @include button(undecorated, $tc:$osd_fg_color, $c:$osd_bg_color);}
@include button(undecorated, $osd:true);
&:insensitive { @include button(undecorated, $tc:$osd_fg_color, $c:$osd_bg_color, $osd:true);}
}
/* System Elements */
@ -275,13 +279,14 @@ stage {
%system_entry {
@extend %entry_common;
@include entry(normal, $c:$system_fg_color,);
&:hover { @include entry(hover, $c:$system_fg_color,);}
&:focus { @include entry(focus, $c:$system_fg_color,);}
&:insensitive { @include entry(insensitive, $c:$system_fg_color,);}
&:hover { @include entry(hover, $c:$system_fg_color);}
&:focus { @include entry(focus, $c:$system_fg_color, $fc:$selected_bg_color);}
&:insensitive { @include entry(insensitive, $c:$system_fg_color);}
StLabel.hint-text { color: transparentize($system_fg_color, 0.3);}
}
// buttons
%system_button {
@include button(normal, $tc:$system_fg_color, $c:$system_bg_color);

View File

@ -25,7 +25,7 @@
// Text entries
@mixin entry($t, $c) {
@mixin entry($t, $c, $fc:$selected_bg_color) {
//
// Entries drawing function
//
@ -46,8 +46,8 @@
}
@if $t==focus {
background-color: mix(transparentize($c, 0.75), $selected_bg_color, 95%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.3);
background-color: mix(transparentize($c, 0.75), $fc, 95%);
box-shadow: inset 0 0 0 2px transparentize($fc, 0.3);
color: $c;
&:hover {}
}
@ -143,11 +143,15 @@
//
// since buttons are all flat an borderless now the mixin is simpler
@mixin button($t, $tc:$fg_color, $c:$bg_color, $flat: false) {
@mixin button($t, $tc:$fg_color, $c:$bg_color, $flat: false, $osd: false) {
$button_bg_color: mix($tc, $c, $button_mix_factor);
transition-duration: 100ms;
@if $osd {
$button_bg_color: transparentize($tc, 0.9);
}
// normal button
@if $t==normal {
color: $tc;
@ -210,8 +214,8 @@
// insensitive button
@else if $t==insensitive {
color: transparentize($tc, 0.5);
background-color: transparentize($tc, .95);
color: if($variant == 'light', transparentize($tc, .6), transparentize($tc, .5));
background-color: if($variant == 'light', transparentize($tc, .9), transparentize($tc, .95));
}
// default/suggested button
@ -245,7 +249,6 @@
&:insensitive {
@include button(insensitive);
background-color: transparent;
color: transparentize($selected_fg_color, .5);
}
}
}
@ -344,9 +347,6 @@
transition-duration: 100ms;
padding: $base_padding*1.5 $base_padding*2;
&:ltr {padding-left: $base_padding;}
&:rtl {padding-right: $base_padding;}
@if $flat {
@include button(undecorated);
box-shadow: none !important;
@ -360,3 +360,85 @@
&:active {@include button(active, $c:$bg);}
&:checked {@include button(checked, $c:$bg);}
}
//
// Panel menu/button drawing function
//
// $bg: background color, derived from $panel_fg_color
// $fg: foreground color, also derived from $panel_fg_color
//
// $flat: if true, the button is filled instead of transparent
// $highlighted_child: if true, applies some special overrides for to a
// child element, see _panel.scss for details
// $child_class: class name of the child element
//
@mixin panel_button($bg:$panel_fg_color, $fg:$panel_fg_color, $flat: true, $highlighted_child: false, $child_class:"") {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
font-weight: bold;
background-color: transparent;
color: $fg;
@if $flat {
box-shadow: none;
&:active, &:focus, &:checked {
box-shadow: inset 0 0 0 100px transparentize($fg, 0.75);
&:hover {
box-shadow: inset 0 0 0 100px transparentize($fg, 0.65);
}
}
&:hover {
box-shadow: inset 0 0 0 100px transparentize($fg, 0.8);
}
} @else {
box-shadow: inset 0 0 0 100px transparentize($bg, 0.2);
&:active, &:focus, &:checked {
box-shadow: inset 0 0 0 100px $bg;
&:hover {
box-shadow: inset 0 0 0 100px transparentize($bg, 0.05);
}
}
&:hover {
box-shadow: inset 0 0 0 100px transparentize($bg, 0.1);
}
}
// some overrides to style a child element
@if $highlighted_child {
box-shadow: none !important;
#{$child_class} {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
}
&:active, &:focus, &:checked {
box-shadow: none !important;
#{$child_class} {
box-shadow: inset 0 0 0 100px transparentize($fg, 0.75);
&:hover {
box-shadow: inset 0 0 0 100px transparentize($fg, 0.65) !important;
}
}
}
&:hover {
box-shadow: none !important;
#{$child_class} {
box-shadow: inset 0 0 0 100px transparentize($fg, 0.8);
}
}
}
}

View File

@ -40,9 +40,9 @@ $app_icon_size: 96px;
// expanded folder
.app-folder-dialog {
border-radius: $modal_radius*4;
background-color: $bg_color;
background-color: $system_overlay_bg_color;
padding: $base_padding*2;
box-shadow:inset 0 0 0 1px $outer_borders_color;
box-shadow:inset 0 0 0 1px $system_borders_color;
@if $is_highcontrast {
box-shadow:inset 0 0 0 2px $hc_inset_color;
@ -59,7 +59,7 @@ $app_icon_size: 96px;
& .folder-name-entry {
width: 12em;
border-radius: $base_border_radius*2;
color: $system_fg_color !important;
}
/* FIXME: this is to keep the label in sync with the entry */
@ -122,6 +122,7 @@ $app_icon_size: 96px;
height: 10px;
border-radius: 10px; // the same as height&width
background-color: white;
transition-duration: 400ms;
}
}
@ -168,6 +169,7 @@ $app_icon_size: 96px;
width: 24px;
height: 24px;
border-radius: 99px;
transition-duration: 100ms;
> StIcon { color: $system_fg_color;}

View File

@ -48,110 +48,80 @@
@extend %heading;
padding: 8px 0;
}
.pager-button {
background-color: transparent;
@extend .button, .flat;
padding: 0 !important;
height: 32px;
width: 32px;
margin: 2px;
border-radius: $base_border_radius;
&:hover, &:focus {background-color: $hover_bg_color;}
&:active {background-color: $active_bg_color;}
@if $is_highcontrast {
border:1px solid $hc_inset_color;
}
transition-duration: 100ms;
}
}
$calendar_day_size: 3em;
.calendar-day-base {
text-align: center;
margin: 2px;
padding: 0 !important;
height: $calendar_day_size !important;
width: $calendar_day_size !important;
border-radius: 99px;
transition-duration: 100ms;
// day style
.calendar-day {
@extend %numeric;
@extend %smaller;
@extend .button, .flat;
&:hover {background-color: $hover_bg_color;}
&:focus {
background-color: mix($bg_color, $selected_bg_color, 80%);
color: inherit;
box-shadow:inset 0 0 0 2px transparentize($selected_bg_color, 0.4);
}
&:active,&:selected {
color: $active_fg_color;
background-color: $active_bg_color;
&:focus {
background-color: mix($active_bg_color, $selected_bg_color, 80%);
}
}
border-radius: 99px;
height: 3em !important;
width: 3em !important;
margin: 2px;
padding: 0 !important;
font-weight: 600;
text-align: center;
transition-duration: 100ms;
// day of week heading
&.calendar-day-heading {
background-color: transparent;
color: $insensitive_fg_color;
padding-top: $base_padding;
height: 1.1em !important; // force heading to be smaller height
font-weight: 600;
@extend %smaller;
}
}
.calendar-day {
font-weight: 600;
@if $is_highcontrast {
border:1px solid $hc_inset_color;
height: 0.93em !important; // force heading to be smaller height
padding-top: $base_padding !important;
margin-bottom: 0;
border-radius: 9px;
}
}
.calendar-work-day {}
.calendar-nonwork-day {color: $insensitive_fg_color;}
.calendar-other-month-day {
color: transparentize($fg_color, 0.5);
&.calendar-nonwork-day {
color: transparentize($insensitive_fg_color, 0.5);
&.calendar-weekday {}
&.calendar-weekend {
color: $insensitive_fg_color;
}
&.calendar-other-month {
color: transparentize($insensitive_fg_color, 0.7) !important;
font-weight: normal;
}
&.calendar-today {
@extend .button, .default;
color: $selected_fg_color; /* override weekends */
}
&.calendar-day-with-events {
background-image: if($variant == 'light', url("assets/calendar-today-light.svg"),url("assets/calendar-today.svg"));
background-size: contain;
}
}
// Today
.calendar-today {
background-color: $selected_bg_color;
font-weight: 800;
color: $selected_fg_color !important;
&:hover,&:focus {
background-color:lighten($selected_bg_color, 3%);
color: inherit;
}
&:active,&:selected {
background-color: $selected_bg_color;
color: inherit;
&:hover,&:focus {
background-color:lighten($selected_bg_color, 3%);
color: inherit;
}
}
}
.calendar-day-with-events {
background-image: if($variant == 'light', url("assets/calendar-today-light.svg"),url("assets/calendar-today.svg"));
background-size: contain;
}
// week number style
.calendar-week-number {
@include fontsize($base_font_size - 4);
font-weight: bold;
font-feature-settings: "tnum";
text-align: center;
margin: 6px;
padding: 0 $base_padding;
border-radius: 3px;
background-color: transparentize($fg_color, 0.9);
color: $insensitive_fg_color
color: $insensitive_fg_color;
@if $is_highcontrast {
border:1px solid $hc_inset_color;
}
}
}

View File

@ -155,6 +155,11 @@ $_gdm_dialog_width: 23em;
.unlock-dialog {
background-color: transparent;
// %system_entry style override to have neutral focus color with wallpaper background
.login-dialog-prompt-entry {
&:focus { @include entry(focus, $c:$system_fg_color, $fc:transparentize($system_fg_color, 0.5));}
}
}
.screen-shield-background { // just the shadow, really

View File

@ -7,8 +7,8 @@
background-color: transparentize($osd_bg_color,0.02);
color: $osd_fg_color;
border-radius: 0 0 $modal_radius $modal_radius;
border-radius: $modal_radius;
margin-top: $base_margin;
border-top-width: 0;
padding: $base_padding;
spacing: $base_padding;

View File

@ -2,14 +2,13 @@
$notification_banner_height: 64px;
$notification_banner_width: 34em;
$notification_banner_radius: $base_border_radius*1.5;
// Banner notifications
.notification-banner {
min-height: $notification_banner_height;
width: $notification_banner_width;
box-shadow: 0 2px 4px 2px $shadow_color;
border-radius: $notification_banner_radius;
border-radius: $modal_radius;
margin: $base_margin;
.notification-actions {

View File

@ -1,6 +1,8 @@
/* Top Bar */
// a.k.a. the panel
$privacy_indicator_color: $orange_3;
$panel_bg_color: if($variant == 'light', $light_3, $dark_5);
$panel_fg_color: if($variant == 'light', $fg_color, darken($fg_color, 5%));
$panel_border_color: if($variant == 'light', darken($panel_bg_color, 2%), $panel_bg_color);
@ -17,109 +19,11 @@ $panel_transition_duration: 250ms; // same as the overview transition duration
transition-duration: $panel_transition_duration;
box-shadow: inset 0 -1px 0 0 $panel_border_color;
// transparent panel on lock & login screens
&.unlock-screen,
&.login-screen,
&:overview {
background-color: transparent;
box-shadow: none;
.panel-button {
color: $panel_system_fg_color !important;
}
}
// panel menus
.panel-button {
font-weight: bold;
color: $panel_fg_color;
@include panel_button($panel_fg_color);
-natural-hpadding: $base_padding * 2;
-minimum-hpadding: $base_padding;
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
&.clock-display {
.clock {
transition-duration: 150ms;
border: 3px solid transparent;
border-radius: 99px;
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px $screenshot_ui_button_red;
}
&.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px $warning_color;
StBoxLayout { margin: 0 $base_padding; }
}
&.screen-recording-indicator,
&.screen-sharing-indicator {
StBoxLayout {
spacing: $base_padding;
}
StIcon {
icon-size: $base_icon_size;
}
}
&:active, &:overview, &:focus, &:checked {
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.8);
// The clock display needs to have the background on .clock because
// we want to exclude the do-not-disturb indicator from the background
&.clock-display {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.8);
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.15);
}
&.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px transparentize($warning_color, 0.15);
}
}
&:hover {
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.85);
&.clock-display {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.85);
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.1);
}
&.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px transparentize($warning_color, 0.1);
}
}
&:active:hover, &:overview:hover, &:focus:hover, &:checked:hover {
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.75);
&.clock-display {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.75);
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.2);
}
&.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px transparentize($warning_color, 0.2);
}
}
// status area icons
.system-status-icon {
@ -140,65 +44,79 @@ $panel_transition_duration: 250ms; // same as the overview transition duration
}
&#panelActivities {
-natural-hpadding: $base_padding * 3;
-natural-hpadding: $base_padding * 2.5;
& StBoxLayout {
spacing: 5px;
}
& .workspace-dot {
border-radius: 999px;
min-width: 8px;
min-height: 8px;
background-color: $panel_fg_color;
}
}
// screen activity indicators
&.screen-recording-indicator,
&.screen-sharing-indicator {
StBoxLayout {
spacing: $base_padding;
}
StIcon {
icon-size: $base_icon_size;
}
}
&.screen-recording-indicator {
@include panel_button($screenshot_ui_button_red, $flat: false);
}
&.screen-sharing-indicator {
@include panel_button($privacy_indicator_color, $flat: false);
}
// clock
&.clock-display {
// The clock display needs to have the background on .clock because
// we want to exclude the do-not-disturb indicator from the background
// see _drawing.scss for override details
@include panel_button($highlighted_child: true, $child_class:".clock");
.clock {
// the highlighted child
}
}
}
// transparent panel on lock & login screens
&.unlock-screen,
&.login-screen,
&:overview {
background-color: transparent;
box-shadow: none;
.panel-button {
&:active, &:overview, &:focus, &:checked {
box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.85);
@include panel_button($panel_system_fg_color, $fg:$panel_system_fg_color);
&.clock-display {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.85);
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.15);
}
&.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px transparentize($warning_color, 0.15);
}
&#panelActivities .workspace-dot {
background-color: $panel_system_fg_color;
}
&:hover {
box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.90);
&.clock-display {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.90);
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.1);
}
&.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px transparentize($warning_color, 0.1);
}
// clock
&.clock-display {
@include panel_button($panel_system_fg_color, $fg:$panel_system_fg_color, $highlighted_child: true, $child_class:".clock");
}
&:active:hover, &:overview:hover, &:focus:hover, &:checked:hover {
box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.8);
&.clock-display {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.8);
}
}
// unfortunate duplication so these indicators have styles
&.screen-recording-indicator {
@include panel_button($screenshot_ui_button_red, $flat: false);
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.2);
}
&.screen-sharing-indicator {
box-shadow: inset 0 0 0 100px transparentize($warning_color, 0.2);
}
&.screen-sharing-indicator {
@include panel_button($privacy_indicator_color, $flat: false);
}
}
}
@ -213,9 +131,8 @@ $panel_transition_duration: 250ms; // same as the overview transition duration
spacing: 0;
}
// indicator for active
.screencast-indicator,
.remote-access-indicator { color: $warning_color; }
// important privacy related indicators
.privacy-indicator { color: $privacy_indicator_color; }
}
// App Menu
@ -231,10 +148,8 @@ $panel_transition_duration: 250ms; // same as the overview transition duration
// Clock
.clock-display-box {
spacing: 2px;
.clock {
padding-left: $base_padding * 2;
padding-right: $base_padding * 2;

View File

@ -53,6 +53,10 @@ $submenu_bg_color: lighten($menu_bg_color, 7%);
}
}
.popup-ornamented-menu-item {
&:ltr {padding-left: $base_padding;}
&:rtl {padding-right: $base_padding;}
}
// all other graphical elements (sliders)
.popup-inactive-menu-item {
@ -75,10 +79,6 @@ $submenu_bg_color: lighten($menu_bg_color, 7%);
border: 1px solid $hc_inset_color;
}
.popup-menu-ornament {
min-width: $base_icon_size !important;
}
// submenu specific styles
.popup-menu-item {
border-radius: 0;
@ -103,12 +103,8 @@ $submenu_bg_color: lighten($menu_bg_color, 7%);
// container for radio and check boxes
.popup-menu-ornament {
@extend %heading;
width: 1.2em;
text-align: center !important;
&:ltr { text-align: right;}
&:rtl { text-align: left;}
icon-size: $base_icon_size !important;
width: $base_icon_size;
}
// separator
@ -120,10 +116,6 @@ $submenu_bg_color: lighten($menu_bg_color, 7%);
background-color: $borders_color;
}
.popup-menu-ornament {
width: 0 !important;
}
// separators in submenus
.popup-sub-menu & {
background-color: transparent;
@ -148,9 +140,6 @@ $submenu_bg_color: lighten($menu_bg_color, 7%);
.app-menu {
max-width: 27.25em;
// this is unneeded at the top-level in this menu, hide it
.popup-menu-ornament { width: 0 !important; }
.popup-inactive-menu-item:first-child {
// "Open Windows" label
> StLabel {

View File

@ -59,6 +59,7 @@
& .quick-toggle-arrow {
padding: $base_padding $base_padding*1.75;
border-width: 0;
border-color: transparentize($fg_color, .75);
&:checked {
@include button(default, $c:$selected_bg_color);
@ -163,6 +164,16 @@
.device-subtitle { color: transparentize($fg_color, 0.5); }
.keyboard-brightness-item .slider {
min-height: 16px;
}
.keyboard-brightness-level {
spacing: $base_padding;
.button:checked { @include button(default, $c:$selected_bg_color); }
}
// background apps
.background-apps-quick-toggle {
@ -183,6 +194,9 @@
@extend .icon-button;
padding: $base_padding;
}
& .spinner {
padding: $base_padding;
}
&.popup-inactive-menu-item { color: $fg_color; }
}

View File

@ -83,7 +83,7 @@ $screenshot_ui_button_red: $error_color;
}
.screenshot-ui-shot-cast-container {
background-color: lighten($osd_bg_color,5%);
background-color: transparentize($osd_fg_color,0.9);
border-radius: $modal_radius;
padding: $screenshot_ui_shot_cast_spacing;
spacing: $screenshot_ui_shot_cast_spacing;
@ -95,9 +95,9 @@ $screenshot_ui_button_red: $error_color;
.screenshot-ui-shot-cast-button {
padding: $base_padding $base_padding*2;
background-color: transparent;
&:hover, &:focus { background-color: lighten($osd_bg_color, 10%);}
&:active { background-color: lighten($active_bg_color,5%);}
&:checked { background-color: white;color: black;}
&:hover, &:focus { background-color: transparentize($osd_fg_color, 0.8);}
&:active { background-color: transparentize($osd_fg_color, .5);}
&:checked { background-color: $osd_fg_color; color: $osd_bg_color;}
&:insensitive { color: transparentize($osd_fg_color, 0.5);}
border-radius: $modal_radius - $screenshot_ui_shot_cast_spacing;
@ -195,10 +195,7 @@ $screenshot_ui_button_red: $error_color;
}
.screenshot-ui-tooltip {
color: $osd_fg_color;
background-color: $osd_bg_color;
border-radius: 99px;
padding: $base_padding $base_padding * 2;
@extend %tooltip;
text-align: center;
-y-offset: 24px;
}

View File

@ -24,7 +24,7 @@ $switcher_padding: $base_padding*2;
// each item in the list
.item-box {
@include tile_button($fg_color);
@include tile_button($osd_fg_color);
// override over style so mouse doesn't steal focus
&:hover {background: none;}
@if $is_highcontrast {

View File

@ -4,7 +4,7 @@ GREEN='\033[0;32m'
YELLOW='\033[0;33m'
RESET='\033[0m'
VERSION=44.2
VERSION=45.0
echo
printf " $YELLOW[ i ]$RESET Upstream version $VERSION\n"