From 7ad7afda3d14408102e5f11c8b7ab3048b18d741 Mon Sep 17 00:00:00 2001 From: vinceliuice Date: Wed, 30 Oct 2024 18:41:44 +0800 Subject: [PATCH] update --- src/main/gnome-shell/gnome-shell-Light.css | 5190 -------------------- src/sass/gtk/_common-4.0.scss | 168 +- 2 files changed, 97 insertions(+), 5261 deletions(-) delete mode 100644 src/main/gnome-shell/gnome-shell-Light.css diff --git a/src/main/gnome-shell/gnome-shell-Light.css b/src/main/gnome-shell/gnome-shell-Light.css deleted file mode 100644 index 0b8eb6a1..00000000 --- a/src/main/gnome-shell/gnome-shell-Light.css +++ /dev/null @@ -1,5190 +0,0 @@ -/* This stylesheet is generated, DO NOT EDIT */ -/* Copyright 2009, 2015 Red Hat, Inc. - * - * Portions adapted from Mx's data/style/default.css - * Copyright 2009 Intel Corporation - * - * This program is free software; you can redistribute it and/or modify it - * under the terms and conditions of the GNU Lesser General Public License, - * version 2.1, as published by the Free Software Foundation. - * - * This program is distributed in the hope it will be useful, but WITHOUT ANY - * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS - * FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for - * more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin St - Fifth Floor, Boston, MA 02110-1301 USA. - */ -stage { - font-size: 1em; - color: #242424; -} - -/* General Typography */ -.message-list .message-list-placeholder, .message-dialog-content .message-dialog-title, .datemenu-today-button .date-label { - font-weight: 800; - font-size: 1.364em; -} - -.quick-toggle-menu .header .title { - font-weight: 700; - font-size: 1.364em; -} - -.bt-menu-placeholder.popup-menu-item, .message-dialog-content .message-dialog-title.lightweight, .headline { - font-weight: 700; - font-size: 1.182em; -} - -.background-app-item .title, .message-list-controls, .dialog-list .dialog-list-title, .weather-button .weather-header, .world-clocks-button .world-clocks-header, .events-button .event-summary, .events-button .events-title, -.events-button .events-section-title, .calendar .calendar-month-label { - font-weight: 700; - font-size: 1em; -} - -.quick-toggle-menu .header .subtitle { - font-weight: 700; - font-size: 0.818em; -} - -.background-app-item .subtitle, .quick-toggle StBoxLayout > .quick-toggle-subtitle, .message .message-header .message-header-content .event-time, .prompt-dialog-error-label, -.prompt-dialog-info-label, -.prompt-dialog-null-label, .run-dialog .run-dialog-description, .dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-description, .caps-lock-warning-label, .world-clocks-button .world-clocks-timezone, .events-button .event-time { - font-weight: 400; - font-size: 0.818em; -} - -.calendar .calendar-day-heading, .calendar .calendar-week-number { - font-weight: 400; - font-size: 0.727em; -} - -#panel, .weather-button .weather-forecast-temp, .weather-button .weather-forecast-time, .world-clocks-button .world-clocks-timezone, .world-clocks-button .world-clocks-time, .events-button .event-time, .calendar .calendar-day-heading, .calendar .calendar-day, -.calendar .calendar-day-base { - font-feature-settings: "tnum"; -} - -.ripple-pointer-location { - width: 48px; - height: 48px; - border-radius: 24px; - background-color: st-lighten(st-transparentize(-st-accent-color, 0.7), 30%); - box-shadow: 0 0 2px 2px st-lighten(-st-accent-color, 20%); -} - -.pie-timer { - width: 60px; - height: 60px; - -pie-border-width: 3px; - -pie-border-color: -st-accent-color; - -pie-background-color: st-lighten(st-transparentize(-st-accent-color, 0.7), 40%); -} - -.magnifier-zoom-region { - border: 2px solid -st-accent-color; -} - -.magnifier-zoom-region.full-screen { - border-width: 0; -} - -/* App Icons */ -.grid-search-result .overview-icon { - color: white; - border-radius: 18px; - padding: 12px; - border: none; - transition-duration: 100ms; - text-align: center; - text-shadow: none; - background-color: transparent; -} - -.grid-search-result:hover .overview-icon, .grid-search-result:focus .overview-icon, .grid-search-result:selected .overview-icon { - background-color: rgba(255, 255, 255, 0.12); - border-image: none; - background-image: none; -} - -.grid-search-result:active .overview-icon, .grid-search-result:checked .overview-icon { - background-color: rgba(255, 255, 255, 0.2); - box-shadow: none; -} - -.app-folder-dialog { - border-radius: 32px; - border: none; - box-shadow: none; - background-color: rgba(38, 38, 38, 0.9); - color: rgba(255, 255, 255, 0.85); -} - -.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-label, -.app-folder-dialog .folder-name-container .folder-name-entry { - font-size: 16pt; - font-weight: bold; -} - -.app-folder-dialog .folder-name-container .folder-name-entry { - width: 240px !important; -} - -.app-folder-dialog .folder-name-container .folder-name-label { - padding: 4px; - color: rgba(255, 255, 255, 0.85); -} - -.app-folder-dialog .folder-name-container .edit-folder-button { - background-color: rgba(255, 255, 255, 0.06); - color: rgba(255, 255, 255, 0.85); - border: none; - padding: 0; - width: 36px; - height: 36px; - border-radius: 9999px; -} - -.app-folder-dialog .folder-name-container .edit-folder-button > StIcon { - icon-size: 16px; -} - -.app-folder-dialog .folder-name-container .edit-folder-button:hover { - background-color: rgba(255, 255, 255, 0.12); -} - -.app-folder-dialog .folder-name-container .edit-folder-button:checked, .app-folder-dialog .folder-name-container .edit-folder-button:active { - background-color: rgba(255, 255, 255, 0.2); -} - -.app-folder-dialog .icon-grid { - row-spacing: 12px; - column-spacing: 12px; - page-padding-top: 0; - page-padding-bottom: 0; - page-padding-left: 0; - page-padding-right: 0; -} - -.app-folder-dialog .page-indicators { - margin-bottom: 18px; -} - -.app-folder-dialog-container { - padding: 6px !important; - width: 580px; - height: 580px; -} - -.app-well-app-running-dot { - width: 5px; - height: 5px; - border-radius: 5px; - background-color: rgba(255, 255, 255, 0.85); - margin-bottom: 6px; -} - -StWidget.focused .app-well-app-running-dot { - background-color: -st-accent-color; -} - -.page-indicator { - padding: 4px 8px; -} - -.page-indicator .page-indicator-icon { - width: 12px; - height: 12px; - border-radius: 12px; - margin: 0; - padding: 0; - background-image: none; - color: transparent; - border: none; - box-shadow: none; - background-color: rgba(255, 255, 255, 0.35); -} - -.page-indicator:hover .page-indicator-icon { - background-image: none; - background-color: rgba(255, 255, 255, 0.45); -} - -.page-indicator:active .page-indicator-icon { - margin: 0; - padding: 0; - background-image: none; - color: transparent; - border: none; - box-shadow: none; - background-color: rgba(255, 255, 255, 0.85); -} - -.page-indicator:checked .page-indicator-icon { - background-image: none; - background-color: rgba(255, 255, 255, 0.85); -} - -.page-indicator:checked:active { - background-image: none; -} - -.system-action-icon { - box-shadow: 0 4px 4px rgba(0, 0, 0, 0.2); - background-color: rgba(0, 0, 0, 0.6); - color: white; - border-radius: 100px; - icon-size: 48px; -} - -.shell-link { - border-radius: 6px; - color: #3484e2; -} - -.shell-link:hover { - color: #3484e2; - background-color: rgba(52, 132, 226, 0.15); -} - -.shell-link:active { - color: #3484e2; - background-color: rgba(52, 132, 226, 0.3); -} - -.lowres-icon { - icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); -} - -.icon-dropshadow { - icon-shadow: 0 2px 5px rgba(0, 0, 0, 0.15); -} - -/* Buttons */ -.icon-button, .background-app-item .close-button, .message .message-header .message-expand-button, -.message .message-header .message-close-button, .button { - color: #242424; - background-color: transparent; - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.icon-button:hover, .background-app-item .close-button:hover, .message .message-header .message-expand-button:hover, -.message .message-header .message-close-button:hover, .button:hover { - color: #242424; - background-color: rgba(0, 0, 0, 0.12); - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.icon-button:selected, .background-app-item .close-button:selected, .message .message-header .message-expand-button:selected, -.message .message-header .message-close-button:selected, .button:selected, .icon-button:active, .background-app-item .close-button:active, .message .message-header .message-expand-button:active, -.message .message-header .message-close-button:active, .button:active { - color: #242424; - background-color: rgba(0, 0, 0, 0.2); - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.icon-button:checked, .background-app-item .close-button:checked, .message .message-header .message-expand-button:checked, -.message .message-header .message-close-button:checked, .button:checked { - color: white; - background-color: -st-accent-color; - border: none; - text-shadow: none; - icon-shadow: none; -} - -.icon-button:insensitive, .background-app-item .close-button:insensitive, .message .message-header .message-expand-button:insensitive, -.message .message-header .message-close-button:insensitive, .button:insensitive { - color: rgba(36, 36, 36, 0.45); - background-color: transparent; - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.icon-button:focus, .background-app-item .close-button:focus, .message .message-header .message-expand-button:focus, -.message .message-header .message-close-button:focus, .button:focus { - color: #242424; - text-shadow: none; - icon-shadow: none; -} - -.icon-button:focus, .background-app-item .close-button:focus, .message .message-header .message-expand-button:focus, -.message .message-header .message-close-button:focus, .button:focus { - box-shadow: none !important; -} - -.icon-button.flat, .background-app-item .flat.close-button, .message .message-header .flat.message-expand-button, -.message .message-header .flat.message-close-button, .button.flat { - color: #242424; - background-color: transparent; - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.icon-button.flat:hover, .background-app-item .flat.close-button:hover, .message .message-header .flat.message-expand-button:hover, -.message .message-header .flat.message-close-button:hover, .button.flat:hover { - color: #242424; - background-color: rgba(0, 0, 0, 0.12); - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.icon-button.flat:selected, .background-app-item .flat.close-button:selected, .message .message-header .flat.message-expand-button:selected, -.message .message-header .flat.message-close-button:selected, .button.flat:selected, .icon-button.flat:active, .background-app-item .flat.close-button:active, .message .message-header .flat.message-expand-button:active, -.message .message-header .flat.message-close-button:active, .button.flat:active { - color: #242424; - background-color: rgba(0, 0, 0, 0.2); - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.icon-button.flat:checked, .background-app-item .flat.close-button:checked, .message .message-header .flat.message-expand-button:checked, -.message .message-header .flat.message-close-button:checked, .button.flat:checked { - color: #242424; - background-color: rgba(0, 0, 0, 0.12); - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.icon-button.flat:insensitive, .background-app-item .flat.close-button:insensitive, .message .message-header .flat.message-expand-button:insensitive, -.message .message-header .flat.message-close-button:insensitive, .button.flat:insensitive { - color: rgba(36, 36, 36, 0.45); - background-color: transparent; - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.icon-button.flat:focus, .background-app-item .flat.close-button:focus, .message .message-header .flat.message-expand-button:focus, -.message .message-header .flat.message-close-button:focus, .button.flat:focus { - color: #242424; - text-shadow: none; - icon-shadow: none; -} - -.icon-button.flat:focus, .background-app-item .flat.close-button:focus, .message .message-header .flat.message-expand-button:focus, -.message .message-header .flat.message-close-button:focus, .button.flat:focus { - box-shadow: none !important; -} - -.keyboard-brightness-level .button:checked, .icon-button.default, .background-app-item .default.close-button, .message .message-header .default.message-expand-button, -.message .message-header .default.message-close-button, .button.default { - color: white; - background-color: -st-accent-color; - border: none; - text-shadow: none; - icon-shadow: none; -} - -.keyboard-brightness-level .button:hover:checked, .icon-button.default:hover, .background-app-item .default.close-button:hover, .message .message-header .default.message-expand-button:hover, -.message .message-header .default.message-close-button:hover, .button.default:hover { - color: white; - border: none; - text-shadow: none; - icon-shadow: none; - background-color: st-mix(white, -st-accent-color, 6%); -} - -.keyboard-brightness-level .button:active:checked, .icon-button.default:active, .background-app-item .default.close-button:active, .message .message-header .default.message-expand-button:active, -.message .message-header .default.message-close-button:active, .button.default:active { - color: white; - border: none; - text-shadow: none; - icon-shadow: none; - background-color: st-mix(white, -st-accent-color, 12%); -} - -.keyboard-brightness-level .button:insensitive:checked, .icon-button.default:insensitive, .background-app-item .default.close-button:insensitive, .message .message-header .default.message-expand-button:insensitive, -.message .message-header .default.message-close-button:insensitive, .button.default:insensitive { - color: white; - background-color: -st-accent-color; - border: none; - text-shadow: none; - icon-shadow: none; -} - -.keyboard-brightness-level .button:focus:checked, .icon-button.default:focus, .background-app-item .default.close-button:focus, .message .message-header .default.message-expand-button:focus, -.message .message-header .default.message-close-button:focus, .button.default:focus { - color: white; - text-shadow: none; - icon-shadow: none; - box-shadow: none !important; -} - -.button { - min-height: 1.5em; - padding: 6px 12px; - border-radius: 6px; - border: none; -} - -.icon-button, .background-app-item .close-button, .message .message-header .message-expand-button, -.message .message-header .message-close-button { - min-height: 1.091em; - min-width: 1.091em; - padding: 0.818em; - border-radius: 9999px; - border: none; -} - -.icon-button StIcon, .background-app-item .close-button StIcon, .message .message-header .message-expand-button StIcon, -.message .message-header .message-close-button StIcon { - icon-size: 1.091em; - -st-icon-style: symbolic; -} - -.place-menu-item:focus .button, .place-menu-item:hover .button, .place-menu-item:selected .button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button, #LookingGlassDialog > #Toolbar .lg-toolbar-button { - background-color: transparent; - border: none; - box-shadow: none; - outline: none; - color: rgba(255, 255, 255, 0.75); -} - -.place-menu-item:focus .button:hover, .place-menu-item:hover .button:hover, .place-menu-item:selected .button:hover, .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:hover { - background-color: rgba(255, 255, 255, 0.1); - color: white; -} - -.place-menu-item:focus .button:active, .place-menu-item:hover .button:active, .place-menu-item:selected .button:active, .screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:active { - background-color: rgba(255, 255, 255, 0.25); - color: white; -} - -.place-menu-item:focus .button:checked, .place-menu-item:hover .button:checked, .place-menu-item:selected .button:checked, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked { - background-color: -st-accent-color; - color: white; -} - -.place-menu-item:focus .button:insensitive, .place-menu-item:hover .button:insensitive, .place-menu-item:selected .button:insensitive, .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive, #LookingGlassDialog > #Toolbar .lg-toolbar-button:insensitive { - background-color: transparent; - color: rgba(255, 255, 255, 0.35); -} - -/* Date/Time Menu */ -.world-clocks-button, -.weather-button, -.events-button { - color: #424242; - background-color: rgba(255, 255, 255, 0.95); - border-radius: 8px !important; - border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) !important; - text-shadow: none; -} - -.world-clocks-button:hover, -.weather-button:hover, -.events-button:hover, .world-clocks-button:focus, -.weather-button:focus, -.events-button:focus { - color: #242424; - background-color: white; - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important; -} - -.world-clocks-button:active, -.weather-button:active, -.events-button:active { - color: #242424; - background-color: rgba(252, 252, 252, 0.95); - box-shadow: none !important; -} - -#calendarArea { - padding: 3px 0; -} - -.datemenu-popover { - border-radius: 18px !important; -} - -.datemenu-calendar-column { - spacing: 4px; - border: none; -} - -.datemenu-calendar-column:ltr { - margin-right: 0; - padding-left: 4px; - border-left-width: 0; -} - -.datemenu-calendar-column:rtl { - margin-left: 0; - padding-right: 4px; - border-right-width: 0; -} - -.datemenu-calendar-column .datemenu-displays-section { - padding: 0; -} - -.datemenu-calendar-column .datemenu-displays-box { - spacing: 4px; -} - -/* today button (the date) */ -.datemenu-today-button { - border: none; - box-shadow: none; - background: none; - padding: 4px 8px; - margin: 3px 6px; - text-shadow: none; - color: #424242; - border-radius: 8px; -} - -.datemenu-today-button:hover, .datemenu-today-button:focus { - color: #242424; - background-color: white; -} - -.datemenu-today-button:active { - color: #242424; - background-color: rgba(252, 252, 252, 0.95); -} - -.datemenu-today-button .day-label { - font-weight: bold; -} - -/* Calendar */ -.calendar { - border: none; - box-shadow: none !important; - background-color: transparent; - padding: 4px !important; - margin: 0 !important; - text-shadow: none; -} - -.calendar .calendar-month-label { - margin: 0; - padding: 4px 0; - color: #242424 !important; - background-color: transparent !important; - text-align: center; - text-shadow: none; -} - -.calendar .calendar-month-label:focus { - background-color: rgba(0, 0, 0, 0.12); -} - -.calendar .calendar-change-month-back, -.calendar .calendar-change-month-forward { - padding: 2px !important; - margin: 0 !important; -} - -.calendar .calendar-change-month-back StIcon, -.calendar .calendar-change-month-forward StIcon { - icon-size: 16px !important; -} - -.calendar .pager-button { - width: 28px; - height: 28px; - margin: 2px; - border-radius: 9999px; - background-color: transparent; - color: #242424; -} - -.calendar .pager-button:hover, .calendar .pager-button:focus { - background-color: rgba(0, 0, 0, 0.12); -} - -.calendar .pager-button:active { - background-color: rgba(0, 0, 0, 0.2); -} - -.calendar .calendar-day, -.calendar .calendar-day-base { - text-align: center; - width: 2.8em; - height: 2.8em; - padding: 0; - margin: 2px; - border-radius: 9999px; - color: #424242; - font-feature-settings: "tnum"; - background-color: transparent; -} - -.calendar .calendar-day:hover, .calendar .calendar-day:focus, -.calendar .calendar-day-base:hover, -.calendar .calendar-day-base:focus { - background-color: rgba(0, 0, 0, 0.12); - box-shadow: none !important; -} - -.calendar .calendar-day:active, -.calendar .calendar-day-base:active { - color: #424242; - background-color: rgba(0, 0, 0, 0.2); - border-color: transparent; -} - -.calendar .calendar-day:selected, -.calendar .calendar-day-base:selected { - color: #242424; - background-color: rgba(0, 0, 0, 0.2); - border-color: transparent; - box-shadow: none !important; -} - -.calendar .calendar-day { - border-width: 0; -} - -.calendar .calendar-day-top { - border-top-width: 0; -} - -.calendar .calendar-day-left { - border-left-width: 0; -} - -.calendar .calendar-nonwork-day { - color: rgba(36, 36, 36, 0.45); -} - -.calendar .calendar-today { - font-weight: bold; - color: #424242 !important; - background-color: rgba(36, 36, 36, 0.1); - border: none; - background-gradient-direction: none !important; -} - -.calendar .calendar-today:hover, .calendar .calendar-today:focus { - background-color: rgba(36, 36, 36, 0.15); - color: #242424 !important; - background-gradient-direction: none !important; -} - -.calendar .calendar-today:active { - background-color: st-darken(-st-accent-color, 5%); - color: white !important; - background-gradient-direction: none !important; -} - -.calendar .calendar-today:selected { - background-color: -st-accent-color; - color: white !important; - background-gradient-direction: none !important; -} - -.calendar .calendar-today:selected:hover, .calendar .calendar-today:selected:focus { - color: white !important; - background-color: st-lighten(-st-accent-color, 8%); -} - -.calendar .calendar-day-with-events { - color: #565656; - background-image: url("assets/calendar-today.svg"); -} - -.calendar .calendar-day-with-events.calendar-work-day { - color: #565656; - font-weight: bold; -} - -.calendar .calendar-other-month, -.calendar .calendar-other-month-day { - color: rgba(36, 36, 36, 0.45) !important; - opacity: 1; -} - -.calendar .calendar-other-month.calendar-weekend, -.calendar .calendar-other-month-day.calendar-weekend { - color: rgba(66, 66, 66, 0.45) !important; -} - -.calendar .calendar-week-number { - width: 2.4em; - height: 2.4em; - margin: 6px; - padding: 0; - border-radius: 6px; - background-color: rgba(0, 0, 0, 0.05); - color: #565656; - font-weight: bold; - text-align: center; - font-feature-settings: "tnum"; -} - -.calendar .calendar-day-heading { - width: 28px !important; - height: 22px !important; - margin: 3px; - padding: 0 !important; - background-color: transparent !important; - color: #565656 !important; - font-weight: bold; - text-align: center; -} - -.world-clocks-button, -.weather-button, -.events-button { - padding: 12px !important; - margin: 4px 7px !important; -} - -.events-button .events-box { - color: #565656; - spacing: 4px; -} - -.events-button .events-list { - color: #565656; - spacing: 8px; - text-shadow: none; -} - -.events-button .events-title, -.events-button .events-section-title { - color: #424242; - text-shadow: none; -} - -.events-button .event-time { - color: #565656; -} - -.events-button .event-placeholder { - color: rgba(36, 36, 36, 0.45); - font-style: italic; -} - -.world-clocks-button .world-clocks-header { - color: #424242; -} - -.world-clocks-button .world-clocks-header.no-world-clocks { - color: #242424; -} - -.world-clocks-button .world-clocks-city { - color: #565656; - font-weight: bold; -} - -.world-clocks-button .world-clocks-time { - font-weight: bold; - color: #565656; -} - -.world-clocks-button .world-clocks-time:ltr { - text-align: right; -} - -.world-clocks-button .world-clocks-time:rtl { - text-align: left; -} - -.world-clocks-button .world-clocks-timezone { - color: #565656; -} - -.world-clocks-grid, -.weather-grid { - spacing-rows: 0.4em; - spacing-columns: 0.8em; -} - -.weather-button .weather-box { - spacing: 7px; -} - -.weather-button .weather-header-box { - spacing: 4px; -} - -.weather-button .weather-header { - color: #424242; -} - -.weather-button .weather-header.location { - font-weight: normal; - color: #565656; -} - -.weather-button .weather-grid { - spacing-rows: 4px; - spacing-columns: 8px; -} - -.weather-button .weather-forecast-time { - font-size: 0.909em; - color: #424242; - font-weight: normal; - padding-top: 0.2em; - padding-bottom: 0.4em; -} - -.weather-button .weather-forecast-icon { - icon-size: 32px; -} - -.weather-button .weather-forecast-temp { - font-weight: bold; -} - -/* Activities Ripple */ -.ripple-box { - width: 52px; - height: 52px; - border-radius: 0 0 52px 0; - background-color: st-transparentize(-st-accent-color, 0.65); - box-shadow: 0 0 2px 2px st-lighten(-st-accent-color, 20%); -} - -.ripple-box:rtl { - border-radius: 0 0 0 52px; -} - -/* Dash */ -#dash .empty-dash-drop-target { - width: 32px; - height: 32px; -} - -.dash-label { - color: rgba(255, 255, 255, 0.85); - background-color: rgba(0, 0, 0, 0.75); - border-radius: 6px; - padding: 4px 8px; - margin: 4px; - box-shadow: none !important; - border: none !important; - text-align: center; - -y-offset: 6px; - -x-offset: 8px; - font-size: 9.75pt; - font-weight: 400; -} - -.show-apps .show-apps-icon { - color: transparent !important; - background-image: url("assets/view-app-grid.svg"); - background-size: contain; -} - -.show-apps .overview-icon, .show-apps .show-apps-icon { - color: transparent !important; -} - -/* Entries */ -StEntry { - min-height: 28px; - padding: 2px 8px !important; - color: #242424; - caret-color: #242424; - selection-background-color: -st-accent-color !important; - selected-color: white !important; - background-color: rgba(0, 0, 0, 0.1); - border-radius: 9999px; - border: 2px solid transparent !important; - box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0) !important; - outline: none; -} - -StEntry:hover { - box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1) !important; - border: 2px solid transparent !important; -} - -StEntry:focus { - box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0) !important; - border: 2px solid st-lighten(-st-accent-color, 15%) !important; -} - -StEntry:insensitive { - background-color: rgba(0, 0, 0, 0.05); - color: rgba(36, 36, 36, 0.45); -} - -StEntry StIcon { - icon-size: 16px !important; -} - -StEntry StIcon.capslock-warning { - icon-size: 16px !important; - warning-color: #E9873A; - padding: 0 0; -} - -StEntry StIcon.peek-password { - icon-size: 16px !important; - padding: 0 4px; -} - -StEntry StLabel.hint-text { - margin-left: 2px; - color: #424242; -} - -.hotplug-notification-item { - color: #242424; - background-color: #e6e6e6; - border: none; - text-shadow: none; - icon-shadow: none; - padding: 12px; - border-style: solid; - border-width: 0; - border-left-width: 0; - border-bottom-width: 0; -} - -.hotplug-notification-item:insensitive { - color: rgba(36, 36, 36, 0.45); - background-color: #e6e6e6; - border: none; - text-shadow: none; - icon-shadow: none; -} - -.hotplug-notification-item:hover { - color: #242424; - border: none; - text-shadow: none; - icon-shadow: none; - background-color: st-mix(#242424, #e6e6e6, 6%); -} - -.hotplug-notification-item:focus { - color: #242424; - text-shadow: none; - icon-shadow: none; - box-shadow: none !important; -} - -.hotplug-notification-item:active { - color: #242424; - border: none; - text-shadow: none; - icon-shadow: none; - background-color: st-mix(#242424, #e6e6e6, 12%); -} - -.hotplug-notification-item:first-child { - border-radius: 0 0 0 6px; -} - -.hotplug-notification-item:last-child { - border-right-width: 0; - border-radius: 0 0 6px 0; -} - -.hotplug-notification-item:first-child:last-child { - border-radius: 0 0 6px 6px; -} - -.hotplug-notification-item-icon { - icon-size: 24px; - padding: 0 4px; -} - -.candidate-popup-boxpointer { - -arrow-border-radius: 2px; - -arrow-background-color: transparent; - -arrow-border-width: 0; - -arrow-border-color: transparent; - -arrow-base: 64px; - -arrow-rise: 12px; - background-color: transparent; - color: #565656; -} - -.candidate-popup-content { - color: #565656; - box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.15); - border: 1px solid rgba(0, 0, 0, 0); - margin: 3px 12px 17px 12px; - padding: 8px; - spacing: 6px; -} - -.candidate-index { - padding: 0 0.5em 0 0; - color: #565656; -} - -.candidate-box:selected .candidate-index { - color: rgba(255, 255, 255, 0.5); -} - -.candidate-box { - padding: 0.3em 0.5em 0.3em 0.5em; - margin-right: 2px; - border-radius: 6px; - color: #565656; -} - -.candidate-box:hover { - background-color: rgba(0, 0, 0, 0.12); - color: #242424; -} - -.candidate-box:active { - background-color: rgba(0, 0, 0, 0.2); - color: #242424; -} - -.candidate-box:selected { - background-color: -st-accent-color; - color: rgba(255, 255, 255, 0.85); -} - -.candidate-box:last-child { - margin-right: 0; -} - -.candidate-page-button-box { - height: 2em; -} - -.vertical .candidate-page-button-box { - padding-top: 0.5em; -} - -.horizontal .candidate-page-button-box { - padding-left: 0.5em; -} - -.candidate-page-button { - padding: 4px 6px !important; -} - -.candidate-page-button-previous, -.candidate-page-button-next { - border-radius: 6px; -} - -.candidate-page-button-icon { - icon-size: 1em; -} - -/* On-screen Keyboard */ -#keyboard { - background-color: rgba(0, 0, 0, 0.25); - box-shadow: none; -} - -#keyboard .page-indicator { - padding: 4px; -} - -#keyboard .page-indicator .page-indicator-icon { - width: 8px; - height: 8px; -} - -.key-container, -.keyboard-layout { - padding: 3px; - spacing: 3px; -} - -.keyboard-key { - font-size: 16pt; - font-weight: bold; - min-height: 1.2em; - min-width: 1.2em; - border-radius: 12px; - border: none; - color: #424242; - background-color: #eeeeee; - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15); -} - -.keyboard-key:focus, .keyboard-key:hover { - color: #242424; - background-color: white; -} - -.keyboard-key:checked, .keyboard-key:active { - color: #242424; - background-color: #d5d5d5; -} - -.keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.3); - color: rgba(255, 255, 255, 0.85); - border-color: rgba(0, 0, 0, 0.3); -} - -.keyboard-key.default-key { - background-color: #c0c0c0; - box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15); -} - -.keyboard-key.default-key:focus, .keyboard-key.default-key:hover { - color: #242424; - background-color: #dadada; -} - -.keyboard-key.default-key:checked, .keyboard-key.default-key:active { - color: #242424; - background-color: #a7a7a7; -} - -.keyboard-key.enter-key { - color: white; - background-color: -st-accent-color; - box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15); -} - -.keyboard-key.enter-key:focus, .keyboard-key.enter-key:hover { - color: white; - background-color: st-lighten(-st-accent-color, 5%); -} - -.keyboard-key.enter-key:checked, .keyboard-key.enter-key:active { - color: white; - background-color: st-darken(-st-accent-color, 10%); -} - -.keyboard-key.shift-key-uppercase, .keyboard-key.shift-key-uppercase:focus, .keyboard-key.shift-key-uppercase:hover, .keyboard-key.shift-key-uppercase:checked, .keyboard-key.shift-key-uppercase:active { - color: -st-accent-color; -} - -.keyboard-key StIcon { - icon-size: 1.125em; -} - -.keyboard-subkeys { - color: inherit; - -arrow-border-radius: 6px; - -arrow-background-color: rgba(0, 0, 0, 0.45); - -arrow-border-width: 0; - -arrow-border-color: transparent; - -arrow-base: 20px; - -arrow-rise: 10px; - -boxpointer-gap: 5px; - box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); -} - -.emoji-page .keyboard-key { - background-color: transparent; - border: none; - color: initial; -} - -.emoji-panel .keyboard-key:latched { - background-color: -st-accent-color; - border-color: st-lighten(-st-accent-color, 5%); -} - -.word-suggestions { - font-size: 14pt; - spacing: 12px; - min-height: 20pt; -} - -/* Login Dialog */ -#lockDialogGroup { - background-color: #2a2a2a; - background-image: url("assets/background.png"); - background-size: cover; -} - -.login-dialog-banner-view { - padding-top: 24px; - max-width: 23em; -} - -.unlock-dialog StEntry { - font-size: 0.909em; - padding: 0 8px !important; -} - -.unlock-dialog StEntry StIcon.peek-password { - padding: 0 4px !important; -} - -.unlock-dialog StEntry StLabel.hint-text { - margin-left: 2px !important; -} - -.unlock-dialog .modal-dialog-button-box { - spacing: 3px !important; -} - -.unlock-dialog .modal-dialog-button { - padding: 2px 12px !important; -} - -.unlock-dialog .cancel-button, -.unlock-dialog .switch-user-button, -.unlock-dialog .login-dialog-session-list-button { - width: 32px !important; - height: 32px !important; - padding: 0 !important; -} - -.unlock-dialog .cancel-button StIcon, -.unlock-dialog .switch-user-button StIcon, -.unlock-dialog .login-dialog-session-list-button StIcon { - icon-size: 16px !important; -} - -.unlock-dialog .login-dialog-logo-bin { - padding: 24px 0; -} - -.unlock-dialog .login-dialog-button-box { - spacing: 6px; -} - -.unlock-dialog .login-dialog-message-hint { - padding-top: 0; - padding-bottom: 18px; -} - -.unlock-dialog .login-dialog-user-selection-box { - padding: 100px 0px; -} - -.unlock-dialog .login-dialog-not-listed-label { - padding-left: 2px; -} - -.unlock-dialog .login-dialog-not-listed-label { - font-size: 1em; - padding-top: 1em; -} - -.unlock-dialog .login-dialog-user-list-view { - -st-vfade-offset: 1em; -} - -.unlock-dialog .login-dialog-user-list { - spacing: 12px; - padding: .2em; - width: 23em; -} - -.unlock-dialog .login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in { - border-right: 2px solid -st-accent-color; -} - -.unlock-dialog .login-dialog-user-list-item { - border-radius: 12px; - padding: 6px; -} - -.unlock-dialog .login-dialog-user-list-item:ltr .user-widget { - padding-right: 1em; -} - -.unlock-dialog .login-dialog-user-list-item:rtl .user-widget { - padding-left: 1em; -} - -.unlock-dialog .login-dialog-user-list-item .login-dialog-timed-login-indicator { - height: 2px; - margin: 6px 0 0 0; - background-color: rgba(0, 0, 0, 0.16) !important; -} - -.unlock-dialog .user-widget.horizontal .user-widget-label { - font-size: 1.182em; - padding-left: 12px; -} - -.unlock-dialog .user-widget.horizontal .user-widget-label:ltr { - padding-left: 12px; - text-align: left; -} - -.unlock-dialog .user-widget.horizontal .user-widget-label:rtl { - padding-right: 12px; - text-align: right; -} - -.unlock-dialog .user-widget.vertical .user-widget-label { - font-size: 1.455em; - padding-top: 18px; -} - -.unlock-dialog .login-dialog-prompt-layout { - padding-top: 24px; - padding-bottom: 12px; - spacing: 8px; - width: 23em; -} - -.unlock-dialog .login-dialog-prompt-entry { - height: 1.5em; -} - -.unlock-dialog .login-dialog-prompt-label { - font-size: 1.091em; - padding-top: 1em; -} - -.login-dialog StEntry StIcon { - icon-size: 16px; - padding: 0; - margin: 0; -} - -.login-dialog .modal-dialog-button-box { - spacing: 3px; -} - -.login-dialog .modal-dialog-button { - padding: 2px 12px; -} - -.login-dialog .cancel-button, -.login-dialog .switch-user-button, -.login-dialog .login-dialog-session-list-button { - width: 32px; - height: 32px; -} - -.login-dialog .cancel-button StIcon, -.login-dialog .switch-user-button StIcon, -.login-dialog .login-dialog-session-list-button StIcon { - icon-size: 16px; -} - -.login-dialog .login-dialog-logo-bin { - padding: 24px 0; -} - -.login-dialog .login-dialog-button-box { - spacing: 6px; -} - -.login-dialog .login-dialog-message-hint { - padding-top: 0; - padding-bottom: 18px; -} - -.login-dialog .login-dialog-user-selection-box { - padding: 100px 0px; -} - -.login-dialog .login-dialog-not-listed-label { - padding-left: 4px; -} - -.login-dialog .login-dialog-not-listed-label { - font-size: 1em; - padding-top: 1em; -} - -.login-dialog .login-dialog-user-list-view { - -st-vfade-offset: 1em; -} - -.login-dialog .login-dialog-user-list { - spacing: 12px; - padding: .2em; - width: 23em; -} - -.login-dialog .login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in { - border-right: 2px solid -st-accent-color; -} - -.login-dialog .login-dialog-user-list-item { - border-radius: 12px; - padding: 6px; -} - -.login-dialog .login-dialog-user-list-item:ltr .user-widget { - padding-right: 1em; -} - -.login-dialog .login-dialog-user-list-item:rtl .user-widget { - padding-left: 1em; -} - -.login-dialog .login-dialog-user-list-item .login-dialog-timed-login-indicator { - height: 2px; - margin: 6px 0 0 0; -} - -.login-dialog .user-widget.horizontal .user-widget-label { - font-size: 1.182em; - padding-left: 12px; -} - -.login-dialog .user-widget.horizontal .user-widget-label:ltr { - padding-left: 12px; - text-align: left; -} - -.login-dialog .user-widget.horizontal .user-widget-label:rtl { - padding-right: 12px; - text-align: right; -} - -.login-dialog .user-widget.vertical .user-widget-label { - font-size: 1.455em; - padding-top: 10px; - padding-bottom: 14px; -} - -.login-dialog .login-dialog-prompt-layout { - padding-top: 24px; - padding-bottom: 12px; - spacing: 8px; - width: 23em; -} - -.login-dialog .login-dialog-prompt-entry { - height: 1.5em; -} - -.login-dialog .login-dialog-prompt-label { - font-size: 1.091em; - padding-top: 1em; -} - -.login-dialog, -.unlock-dialog { - border: none; - background-color: transparent; -} - -.login-dialog StEntry, -.unlock-dialog StEntry { - selection-background-color: -st-accent-color; - selected-background-color: -st-accent-color; - selected-color: white; - border-radius: 9999px; - caret-color: white; - background-color: rgba(0, 0, 0, 0.1); - border-radius: 9999px; - border: none !important; - box-shadow: none !important; - color: white; -} - -.login-dialog StEntry:focus, -.unlock-dialog StEntry:focus { - border: none !important; - background-color: rgba(0, 0, 0, 0.2); - color: white; -} - -.login-dialog StEntry:insensitive, -.unlock-dialog StEntry:insensitive { - border: none !important; - background-color: rgba(0, 0, 0, 0.05); - color: rgba(255, 255, 255, 0.45); -} - -.login-dialog StEntry StLabel.hint-text, -.unlock-dialog StEntry StLabel.hint-text { - color: rgba(255, 255, 255, 0.45); -} - -.login-dialog .modal-dialog-button, -.unlock-dialog .modal-dialog-button { - border: none; - color: white; - background-color: transparent; - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.login-dialog .modal-dialog-button:hover, .login-dialog .modal-dialog-button:focus, -.unlock-dialog .modal-dialog-button:hover, -.unlock-dialog .modal-dialog-button:focus { - color: white; - background-color: rgba(0, 0, 0, 0.12); - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.login-dialog .modal-dialog-button:active, -.unlock-dialog .modal-dialog-button:active { - color: white; - background-color: rgba(0, 0, 0, 0.2); - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.login-dialog .modal-dialog-button:insensitive, -.unlock-dialog .modal-dialog-button:insensitive { - color: rgba(255, 255, 255, 0.45); - background-color: transparent; - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.login-dialog .modal-dialog-button:default, -.unlock-dialog .modal-dialog-button:default { - color: white; - background-color: #e6e6e6; - border: none; - text-shadow: none; - icon-shadow: none; -} - -.login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus, -.unlock-dialog .modal-dialog-button:default:hover, -.unlock-dialog .modal-dialog-button:default:focus { - color: white; - border: none; - text-shadow: none; - icon-shadow: none; - background-color: st-mix(white, #e6e6e6, 6%); -} - -.login-dialog .modal-dialog-button:default:active, -.unlock-dialog .modal-dialog-button:default:active { - color: white; - border: none; - text-shadow: none; - icon-shadow: none; - background-color: st-mix(white, #e6e6e6, 12%); -} - -.login-dialog .modal-dialog-button:default:insensitive, -.unlock-dialog .modal-dialog-button:default:insensitive { - color: rgba(255, 255, 255, 0.45); - background-color: #e6e6e6; - border: none; - text-shadow: none; - icon-shadow: none; -} - -.login-dialog .cancel-button, -.login-dialog .switch-user-button, -.login-dialog .login-dialog-session-list-button, -.unlock-dialog .cancel-button, -.unlock-dialog .switch-user-button, -.unlock-dialog .login-dialog-session-list-button { - padding: 0 !important; - border-radius: 9999px; - border: none; - background-color: rgba(0, 0, 0, 0.1); - color: white; -} - -.login-dialog-message-warning { - color: rgba(255, 255, 255, 0.85); -} - -.login-dialog-banner { - color: rgba(255, 255, 255, 0.85); -} - -.login-dialog-message { - text-align: center; -} - -.login-dialog-message-warning { - color: #E9873A; -} - -.login-dialog-not-listed-button:focus .login-dialog-not-listed-label, .login-dialog-not-listed-button:hover .login-dialog-not-listed-label { - color: white; -} - -.login-dialog-not-listed-label { - font-weight: normal; - color: rgba(255, 255, 255, 0.85); -} - -.login-dialog-not-listed-label:hover { - color: rgba(255, 255, 255, 0.85); -} - -.login-dialog-not-listed-label:focus { - background-color: rgba(255, 255, 255, 0.12); -} - -.login-dialog-user-list:expanded .login-dialog-user-list-item:selected { - background-color: rgba(255, 255, 255, 0.12); - color: rgba(255, 255, 255, 0.85); -} - -.login-dialog-user-list:expanded .login-dialog-user-list-item:hover { - background-color: rgba(255, 255, 255, 0.12); - color: rgba(255, 255, 255, 0.85); -} - -.login-dialog-user-list:expanded .login-dialog-user-list-item:active { - background-color: rgba(255, 255, 255, 0.2); - color: rgba(255, 255, 255, 0.85); -} - -.login-dialog-user-list-item { - color: rgba(255, 255, 255, 0.85); -} - -.login-dialog-user-list-item:focus { - background-color: rgba(0, 0, 0, 0.05) !important; -} - -.login-dialog-user-list-item:hover, .login-dialog-user-list-item:focus:hover { - background-color: rgba(0, 0, 0, 0.12) !important; - color: rgba(255, 255, 255, 0.85); -} - -.login-dialog-user-list-item:active, .login-dialog-user-list-item:focus:active { - background-color: rgba(0, 0, 0, 0.2) !important; - color: rgba(255, 255, 255, 0.85); -} - -.login-dialog-user-list-item .login-dialog-timed-login-indicator { - background-color: rgba(0, 0, 0, 0.16) !important; -} - -.user-widget-label { - color: rgba(255, 255, 255, 0.85); -} - -.user-widget.horizontal .user-widget-label { - font-weight: normal; -} - -.user-widget.vertical .user-widget-label { - text-align: center; - font-weight: normal; -} - -.login-dialog-prompt-label { - color: rgba(255, 255, 255, 0.5); -} - -/* Looking Glass */ -#LookingGlassDialog { - background-color: #2a2a2a; - spacing: 4px; - margin: 4px; - padding: 0; - border: 1px solid black; - border-radius: 12px; - box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); - color: #d3d7df; -} - -#LookingGlassDialog > #Toolbar { - padding: 0 8px; - spacing: 4px; - border: none; - border-radius: 0; - background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); -} - -#LookingGlassDialog > #Toolbar .lg-toolbar-button { - padding: 4px 8px; - border-radius: 6px; - margin: 2px; -} - -#LookingGlassDialog > #Toolbar .lg-toolbar-button > StIcon { - icon-size: 16px; -} - -#LookingGlassDialog .labels { - spacing: 4px; - color: #d3d7df; -} - -#LookingGlassDialog .notebook-tab { - -natural-hpadding: 8px; - -minimum-hpadding: 8px; - font-weight: bold; - color: rgba(255, 255, 255, 0.5); - padding: 0 16px; - min-height: 32px; - border-radius: 0; - transition-duration: 100ms; - border: L none; - box-shadow: none; - border-bottom: 2px solid transparent; - background-color: transparent; -} - -#LookingGlassDialog .notebook-tab:hover { - color: white; - text-shadow: none; - border-color: rgba(255, 255, 255, 0.2); -} - -#LookingGlassDialog .notebook-tab:selected { - background-color: rgba(255, 255, 255, 0.01); - border-color: -st-accent-color; - color: white; - text-shadow: none; - box-shadow: none; -} - -#LookingGlassDialog StBoxLayout#EvalBox, -#LookingGlassDialog StBoxLayout#ResultsArea { - padding: 4px; - spacing: 4px; -} - -.lg-dialog StEntry { - min-height: 22px; - selection-background-color: -st-accent-color; - selected-color: rgba(255, 255, 255, 0.85); - caret-color: white; - color: white; - background-color: rgba(255, 255, 255, 0.12); -} - -.lg-dialog .shell-link { - color: #3484e2; -} - -.lg-dialog .shell-link:hover { - color: #619fe8; -} - -.lg-dialog .shell-link:active { - color: #1c6bc7; -} - -.lg-dialog .actor-link { - color: #3484e2; -} - -.lg-dialog .actor-link:hover { - color: #8dbaef; -} - -.lg-dialog .actor-link:active { - color: #16539a; -} - -.lg-dialog .actor-link StIcon { - icon-size: 12px; -} - -.lg-completions-text { - font-size: .9em; - font-style: italic; -} - -.lg-obj-inspector-title { - spacing: 4px; -} - -.lg-obj-inspector-button { - padding: 0 16px; - border: none; - border-radius: 6px; - font-size: 9.75pt; - font-weight: 500; -} - -.lg-obj-inspector-button:hover { - border: none; -} - -#lookingGlassExtensions { - padding: 4px; -} - -.lg-extensions-list { - padding: 4px; - spacing: 4px; -} - -.lg-extension { - border: none; - border-radius: 6px; - padding: 8px; - spacing: 4px; - background-color: rgba(255, 255, 255, 0.12); - color: rgba(255, 255, 255, 0.85); - box-shadow: none; -} - -.lg-extension-name { - font-weight: bold; - color: rgba(255, 255, 255, 0.45); -} - -.lg-extension-meta { - spacing: 4px; -} - -#LookingGlassPropertyInspector { - background: #373737; - border: 1px solid black; - border-radius: 12px; - padding: 8px; - box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.15); - color: #d3d7df; -} - -.lg-debug-flag-button { - color: white; - spacing: 4px; -} - -.lg-debug-flag-button StLabel { - padding: 8px; -} - -.lg-debug-flag-button:hover { - color: white; -} - -.lg-debug-flag-button:active { - color: #cccccc; -} - -.lg-debug-flags-header { - color: rgba(255, 255, 255, 0.45); - padding-top: 8px; - padding: 4px; -} - -.select-area-rubberband { - border: 1px solid -st-accent-color; - border-radius: 3px; - background-color: st-transparentize(-st-accent-color, 0.3); -} - -.user-icon { - background-size: contain; - color: rgba(255, 255, 255, 0.85); - border-radius: 9999px; - border: none; - icon-size: 64px; -} - -.user-icon:hover { - color: white; -} - -.user-icon StIcon { - background-color: rgba(255, 255, 255, 0.2); - border-radius: 9999px; - padding: 8px; - width: 40px; - height: 40px; -} - -.user-icon.user-avatar { - border: none; - box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0); -} - -.popup-menu .user-icon { - color: #424242; -} - -.popup-menu .user-icon StIcon { - background-color: rgba(0, 0, 0, 0.2); -} - -.user-widget.vertical .user-icon { - icon-size: 96px; -} - -.user-widget.vertical .user-icon StIcon { - padding: 14px; - padding-top: 12px; - padding-bottom: 16px; - width: 88px; - height: 88px; -} - -.lightbox { - background-color: black; -} - -.flashspot { - background-color: white; -} - -.hidden { - color: rgba(0, 0, 0, 0); -} - -.caps-lock-warning-label { - text-align: center; - padding-bottom: 8px; - color: #E9873A; -} - -/* Workspace animation */ -.workspace-animation { - background-color: #2a2a2a; -} - -/* Network Dialogs */ -.nm-dialog { - max-height: 34em; - min-height: 31em; - min-width: 32em; -} - -.nm-dialog-content { - spacing: 20px; - padding: 24px; -} - -.nm-dialog-header-hbox { - spacing: 10px; -} - -.nm-dialog-airplane-box { - spacing: 12px; -} - -.nm-dialog-airplane-headline { - font-weight: bold; - text-align: center; -} - -.nm-dialog-airplane-text { - color: #242424; -} - -.nm-dialog-header { - font-weight: bold; -} - -.nm-dialog-header-icon { - icon-size: 32px; -} - -.nm-dialog-header-hbox { - spacing: 10px; -} - -.nm-dialog-scroll-view { - border: 1px solid rgba(0, 0, 0, 0.12); - padding: 0; - background-color: rgba(0, 0, 0, 0.05); - border-radius: 6px; -} - -.nm-dialog-item { - font-size: 1em; - border-bottom: 1px solid rgba(0, 0, 0, 0.12); - padding: 8px; - spacing: 0px; -} - -.nm-dialog-item:selected { - background-color: -st-accent-color; - color: rgba(255, 255, 255, 0.85); -} - -.nm-dialog-item:hover, .nm-dialog-item:focus { - background-color: rgba(0, 0, 0, 0.12); -} - -.nm-dialog-item:active { - background-color: rgba(0, 0, 0, 0.2); -} - -.nm-dialog-icon { - icon-size: 16px; -} - -.nm-dialog-icons { - spacing: 8px; -} - -.no-networks-label { - color: #565656; -} - -.no-networks-box { - spacing: 4px; -} - -/* OSD */ -.workspace-switcher-container, .switcher-list, .resize-popup, .osd-window { - color: #242424; - background-color: #ffffff; - border-radius: 12px; - border: solid rgba(0, 0, 0, 0.75); - border-width: 0; - box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.25); - padding: 8px; -} - -.osd-window { - text-align: center; - font-weight: bold; -} - -.osd-window .osd-monitor-label { - font-size: 3em; -} - -.osd-window .level { - height: 4px; - border-radius: 3px; - background-color: rgba(0, 0, 0, 0.12); - color: #242424; - -barlevel-height: 4px; - -barlevel-background-color: rgba(0, 0, 0, 0.12); - -barlevel-active-background-color: -st-accent-color; - -barlevel-overdrive-color: #ED5F5D; - -barlevel-overdrive-separator-width: 2px; - -barlevel-border-width: 0; - -barlevel-border-color: transparent; -} - -.osd-window .level-bar { - background-color: white; - border-radius: 16px; -} - -.pad-osd-window { - padding: 32px; - background-color: rgba(0, 0, 0, 0.6); -} - -.pad-osd-window .pad-osd-title-box { - spacing: 12px; -} - -.pad-osd-window .pad-osd-title-menu-box { - spacing: 6px; -} - -.combo-box-label { - width: 15em; -} - -.overview-controls { - padding-bottom: 32px; -} - -#overview StScrollBar StBin#trough { - background-color: rgba(255, 255, 255, 0.12); -} - -#overview StScrollBar StButton#vhandle, #overview StScrollBar StButton#hhandle { - background-color: rgba(255, 255, 255, 0.5); -} - -#overview StScrollBar StButton#vhandle:hover, #overview StScrollBar StButton#hhandle:hover { - background-color: rgba(255, 255, 255, 0.85); -} - -#overview StScrollBar StButton#vhandle:active, #overview StScrollBar StButton#hhandle:active { - background-color: white; -} - -/* Top Bar */ -#panel .panel-button#panelActivities { - -natural-hpadding: 12px; - color: #363636; -} - -#panel .panel-button#panelActivities StBoxLayout { - padding: 0 0.2045em; - spacing: 6px; -} - -#panel .panel-button#panelActivities .workspace-dot { - border-radius: 9999px; - min-width: 0.5455em; - min-height: 0.5455em; - background-color: #363636; -} - -#panel .panel-button#panelActivities:overview .workspace-dot { - background-color: white; -} - -#panel { - background-color: #f1f1f1; - font-weight: 500; - color: #363636; - transition-duration: 250ms; - height: 28px !important; - box-shadow: 0 5px 16px rgba(0, 0, 0, 0.05); -} - -#panel .panel-corner { - -panel-corner-radius: 0; - -panel-corner-background-color: #f1f1f1; - -panel-corner-border-width: 2px; - -panel-corner-border-color: transparent; - -panel-corner-opacity: 1; - transition-duration: 250ms; -} - -#panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 12px; - color: #363636; - transition-duration: 150ms; - border-radius: 6px; -} - -#panel .panel-button StLabel { - padding: 0; - margin: 0; -} - -#panel .panel-button .popup-menu-arrow { - width: 0; - height: 0; -} - -#panel .panel-button, #panel .panel-button:hover, #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { - text-shadow: none; -} - -#panel .panel-button .system-status-icon, -#panel .panel-button .app-menu-icon > StIcon, -#panel .panel-button .popup-menu-arrow, #panel .panel-button:hover .system-status-icon, -#panel .panel-button:hover .app-menu-icon > StIcon, -#panel .panel-button:hover .popup-menu-arrow, #panel .panel-button:active .system-status-icon, -#panel .panel-button:active .app-menu-icon > StIcon, -#panel .panel-button:active .popup-menu-arrow, #panel .panel-button:overview .system-status-icon, -#panel .panel-button:overview .app-menu-icon > StIcon, -#panel .panel-button:overview .popup-menu-arrow, #panel .panel-button:focus .system-status-icon, -#panel .panel-button:focus .app-menu-icon > StIcon, -#panel .panel-button:focus .popup-menu-arrow, #panel .panel-button:checked .system-status-icon, -#panel .panel-button:checked .app-menu-icon > StIcon, -#panel .panel-button:checked .popup-menu-arrow { - icon-shadow: none; -} - -#panel .panel-button:hover { - color: #363636; - background-color: rgba(0, 0, 0, 0.08); -} - -#panel .panel-button:hover.clock-display { - background: none; -} - -#panel .panel-button:hover.clock-display .clock { - background-color: rgba(0, 0, 0, 0.08); -} - -#panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { - background-color: rgba(0, 0, 0, 0.15); - color: #363636; - box-shadow: none; -} - -#panel .panel-button:active.clock-display, #panel .panel-button:overview.clock-display, #panel .panel-button:focus.clock-display, #panel .panel-button:checked.clock-display { - background: 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 { - background-color: rgba(0, 0, 0, 0.15); -} - -.unlock-screen #panel .panel-button, .unlock-screen #panel .panel-button:focus, .unlock-screen #panel .panel-button:hover, .unlock-screen #panel .panel-button:active, .login-screen #panel .panel-button, .login-screen #panel .panel-button:focus, .login-screen #panel .panel-button:hover, .login-screen #panel .panel-button:active, .lock-screen #panel .panel-button, .lock-screen #panel .panel-button:focus, .lock-screen #panel .panel-button:hover, .lock-screen #panel .panel-button:active { - color: #363636; -} - -.login-screen #panel .panel-button, .lock-screen #panel .panel-button { - box-shadow: none; -} - -#panel .panel-button.clock-display { - background-color: transparent; -} - -#panel .panel-button.clock-display, #panel .panel-button.clock-display .clock-display-box { - spacing: 0 !important; - padding: 0 !important; - margin: 0 !important; -} - -#panel .panel-button.clock-display .clock { - border: none; - border-radius: 6px; - background-color: transparent; - box-shadow: none; - padding: 0 16px !important; - margin: 0 !important; -} - -#panel .panel-button.clock-display .messages-indicator { - icon-size: 1.091em; -} - -#panel .panel-button:hover, #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { - box-shadow: none !important; -} - -#panel .panel-button:hover.clock-display, #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 !important; - background-color: transparent !important; -} - -#panel .panel-button:hover.clock-display .clock, #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: none !important; -} - -#panel .panel-button .system-status-icon { - icon-size: 16px; - padding: 4px; - margin: 0; -} - -#panel .panel-button .panel-status-menu-box StLabel { - padding: 0 0 0 2px; -} - -#panel .panel-button .appindicator-trayicons-box { - margin: 0 4px; -} - -#panel .panel-button .app-menu-icon { - -st-icon-style: symbolic; -} - -#panel .panel-button#panelActivities { - background-gradient-direction: none; - border: none; -} - -#panel .panel-button.screen-recording-indicator, #panel .panel-button.screen-sharing-indicator { - border: 3px solid transparent; - background-color: transparent; -} - -#panel .panel-button.screen-recording-indicator StBoxLayout, #panel .panel-button.screen-sharing-indicator StBoxLayout { - spacing: 0.409em; -} - -#panel .panel-button.screen-recording-indicator StIcon, #panel .panel-button.screen-sharing-indicator StIcon { - icon-size: 1.091em; -} - -#panel .panel-button.screen-recording-indicator { - box-shadow: inset 0 0 0 1000px #ED5F5D !important; -} - -#panel .panel-button.screen-recording-indicator:hover { - box-shadow: inset 0 0 0 1000px #d75a58 !important; -} - -#panel .panel-button.screen-recording-indicator:active { - box-shadow: inset 0 0 0 1000px #c15554 !important; -} - -#panel .panel-button.screen-sharing-indicator { - box-shadow: inset 0 0 0 1000px #E9873A !important; -} - -#panel .panel-button.screen-sharing-indicator:hover { - box-shadow: inset 0 0 0 1000px #d47d3a !important; -} - -#panel .panel-button.screen-sharing-indicator:active { - box-shadow: inset 0 0 0 1000px #be7439 !important; -} - -#panel Gjs_AggregateMenu.panel-button .system-status-icon, -#panel Gjs_ui_panel_AggregateMenu.panel-button .system-status-icon, -#panel Gjs_ui_panel_QuickSettings.panel-button .system-status-icon { - margin: 0 2px !important; -} - -#panel Gjs_ui_panel_AppMenuButton.panel-button, -#panel .desktop-name-label { - font-weight: bold !important; -} - -#panel Gjs_status_keyboard_InputSourceIndicator.panel-button, -#panel Gjs_appindicatorsupport_rgcjonas_gmail_com_indicatorStatusIcon_IndicatorStatusIcon.panel-button, -#panel Gjs_appindicatorsupport_rgcjonas_gmail_com_indicatorStatusIcon_AppIndicatorsIndicatorStatusIcon.panel-button { - -natural-hpadding: 16px !important; - -minimum-hpadding: 16px !important; -} - -#panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { - background-color: transparent; - box-shadow: none; -} - -#panel:overview StLabel, #panel:overview StIcon, #panel.unlock-screen StLabel, #panel.unlock-screen StIcon, #panel.login-screen StLabel, #panel.login-screen StIcon, #panel.lock-screen StLabel, #panel.lock-screen StIcon { - color: rgba(255, 255, 255, 0.85); -} - -#panel:overview .panel-button:hover, #panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel.lock-screen .panel-button:hover { - color: white; - background-color: rgba(255, 255, 255, 0.12); -} - -#panel:overview .panel-button:hover.clock-display .clock, #panel.unlock-screen .panel-button:hover.clock-display .clock, #panel.login-screen .panel-button:hover.clock-display .clock, #panel.lock-screen .panel-button:hover.clock-display .clock { - background-color: rgba(255, 255, 255, 0.12); -} - -#panel:overview .panel-button:active, #panel:overview .panel-button:active:hover, #panel:overview .panel-button:overview, #panel:overview .panel-button:overview:hover, #panel:overview .panel-button:focus, #panel:overview .panel-button:focus:hover, #panel:overview .panel-button:checked, #panel:overview .panel-button:checked:hover, #panel.unlock-screen .panel-button:active, #panel.unlock-screen .panel-button:active:hover, #panel.unlock-screen .panel-button:overview, #panel.unlock-screen .panel-button:overview:hover, #panel.unlock-screen .panel-button:focus, #panel.unlock-screen .panel-button:focus:hover, #panel.unlock-screen .panel-button:checked, #panel.unlock-screen .panel-button:checked:hover, #panel.login-screen .panel-button:active, #panel.login-screen .panel-button:active:hover, #panel.login-screen .panel-button:overview, #panel.login-screen .panel-button:overview:hover, #panel.login-screen .panel-button:focus, #panel.login-screen .panel-button:focus:hover, #panel.login-screen .panel-button:checked, #panel.login-screen .panel-button:checked:hover, #panel.lock-screen .panel-button:active, #panel.lock-screen .panel-button:active:hover, #panel.lock-screen .panel-button:overview, #panel.lock-screen .panel-button:overview:hover, #panel.lock-screen .panel-button:focus, #panel.lock-screen .panel-button:focus:hover, #panel.lock-screen .panel-button:checked, #panel.lock-screen .panel-button:checked:hover { - color: white; - background-color: rgba(255, 255, 255, 0.2); -} - -#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, #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.lock-screen .panel-button:active.clock-display .clock, #panel.lock-screen .panel-button:overview.clock-display .clock, #panel.lock-screen .panel-button:focus.clock-display .clock, #panel.lock-screen .panel-button:checked.clock-display .clock { - background-color: rgba(255, 255, 255, 0.2); -} - -#panel:overview .panel-button:hover, #panel:overview .panel-button:active, #panel:overview .panel-button:overview, #panel:overview .panel-button:focus, #panel:overview .panel-button:checked, #panel.unlock-screen .panel-button:hover, #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:hover, #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.lock-screen .panel-button:hover, #panel.lock-screen .panel-button:active, #panel.lock-screen .panel-button:overview, #panel.lock-screen .panel-button:focus, #panel.lock-screen .panel-button:checked { - box-shadow: none; -} - -#panel:overview .panel-button:hover.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, #panel.unlock-screen .panel-button:hover.clock-display, #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:hover.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.lock-screen .panel-button:hover.clock-display, #panel.lock-screen .panel-button:active.clock-display, #panel.lock-screen .panel-button:overview.clock-display, #panel.lock-screen .panel-button:focus.clock-display, #panel.lock-screen .panel-button:checked.clock-display { - box-shadow: none; -} - -#panel:overview .panel-button:hover.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, #panel.unlock-screen .panel-button:hover.clock-display .clock, #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:hover.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.lock-screen .panel-button:hover.clock-display .clock, #panel.lock-screen .panel-button:active.clock-display .clock, #panel.lock-screen .panel-button:overview.clock-display .clock, #panel.lock-screen .panel-button:focus.clock-display .clock, #panel.lock-screen .panel-button:checked.clock-display .clock { - box-shadow: none; -} - -#panel:overview .panel-button#panelActivities, #panel.unlock-screen .panel-button#panelActivities, #panel.login-screen .panel-button#panelActivities, #panel.lock-screen .panel-button#panelActivities { - color: white; -} - -#panel:overview .panel-button#panelActivities .workspace-dot, #panel.unlock-screen .panel-button#panelActivities .workspace-dot, #panel.login-screen .panel-button#panelActivities .workspace-dot, #panel.lock-screen .panel-button#panelActivities .workspace-dot { - background-color: white; -} - -#panel:overview .panel-corner, #panel.unlock-screen .panel-corner, #panel.login-screen .panel-corner, #panel.lock-screen .panel-corner { - -panel-corner-radius: 0; - -panel-corner-background-color: transparent; - -panel-corner-border-color: transparent; -} - -#panel .screencast-indicator, -#panel .remote-access-indicator { - color: #E9873A; -} - -#panel .privacy-indicator { - color: #E9873A; -} - -/* Popovers/Menus */ -.popup-menu-boxpointer { - -arrow-border-radius: 14px; - -arrow-background-color: transparent; - -arrow-border-width: 0; - -arrow-border-color: transparent; - -arrow-base: 32px; - -arrow-rise: 0; - -arrow-box-shadow: none; -} - -.arcmenu-menu { - -arrow-base: 0; -} - -.popup-menu { - min-width: 12em; - color: #424242; -} - -.popup-menu.panel-menu { - -boxpointer-gap: 3px; - margin-bottom: 1.75em; -} - -.popup-menu StEntry { - selection-background-color: rgba(255, 255, 255, 0.85); - selected-background-color: rgba(255, 255, 255, 0.85); - selected-color: -st-accent-color; - caret-color: #242424; -} - -.popup-menu StEntry StLabel.hint-text { - margin-left: 2px; - color: rgba(36, 36, 36, 0.7); -} - -.popup-menu-content { - padding: 4px; - box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.18); - margin: 4px 12px 17px 12px; - background-color: #f5f5f5; - border-radius: 14px; - border: solid rgba(0, 0, 0, 0); - border-width: 0; -} - -.popup-menu-item { - spacing: 4px; - padding: 6px 8px; - color: #424242; - text-shadow: none !important; - icon-shadow: none !important; - border-radius: 10px !important; - font-weight: normal; - transition: none; -} - -.popup-menu-item:checked { - font-weight: normal; - border-radius: 10px 10px 0 0 !important; - border: none; - box-shadow: none; - color: #424242 !important; - background-color: white !important; - background-gradient-direction: none !important; -} - -.popup-menu-item:checked:focus, .popup-menu-item:checked:hover, .popup-menu-item:checked:selected { - color: white !important; - background-color: -st-accent-color !important; - background-gradient-direction: none !important; -} - -.popup-menu-item:checked:active { - color: white !important; - background-color: st-mix(#242424, -st-accent-color, 5%) !important; -} - -.popup-menu-item:checked:insensitive { - color: rgba(36, 36, 36, 0.45) !important; -} - -.popup-menu-item:focus, .popup-menu-item:hover, .popup-menu-item:selected { - color: white !important; - background-color: -st-accent-color !important; - transition-duration: 0ms !important; -} - -.popup-menu-item:active, .popup-menu-item.selected:active { - color: white !important; - background-color: st-mix(#242424, -st-accent-color, 5%) !important; -} - -.popup-menu-item:insensitive { - color: rgba(36, 36, 36, 0.45) !important; -} - -.popup-menu-item .toggle-switch:ltr { - margin-left: 3px; -} - -.popup-menu-item .toggle-switch:rtl { - margin-right: 3px; -} - -.popup-sub-menu { - background-color: white !important; - border-radius: 0 0 10px 10px !important; - border: none; - box-shadow: none; -} - -.popup-sub-menu .popup-menu-item { - margin: 0; - border-radius: 10px !important; - background-color: transparent !important; -} - -.popup-sub-menu .popup-menu-item:focus, .popup-sub-menu .popup-menu-item:hover, .popup-sub-menu .popup-menu-item:selected { - color: white !important; - background-color: -st-accent-color !important; -} - -.popup-sub-menu .popup-menu-item:active { - color: white !important; - background-color: st-mix(#242424, -st-accent-color, 5%) !important; -} - -.popup-ornamented-menu-item:ltr { - padding-left: 4px; -} - -.popup-ornamented-menu-item:rtl { - padding-right: 4px; -} - -.popup-inactive-menu-item { - color: #424242 !important; -} - -.popup-inactive-menu-item:insensitive { - color: rgba(36, 36, 36, 0.45) !important; -} - -.popup-menu-arrow, -.popup-menu-icon { - icon-size: 16px; - icon-shadow: none !important; -} - -.popup-menu-ornament { - icon-size: 1.091em !important; - width: 1.091em; -} - -.background-menu { - -boxpointer-gap: 3px; - -arrow-rise: 0px; -} - -.aggregate-menu { - min-width: 21em; -} - -.aggregate-menu .popup-menu-icon { - padding: 0 !important; - -st-icon-style: symbolic; -} - -.aggregate-menu .popup-menu-icon:ltr { - margin-right: 6px !important; -} - -.aggregate-menu .popup-menu-icon:rtl { - margin-left: 6px !important; -} - -.app-menu, -.app-well-menu { - max-width: 27.25em; -} - -.rename-folder-popup .rename-folder-popup-item { - spacing: 4px; -} - -.rename-folder-popup .rename-folder-popup-item:ltr, .rename-folder-popup .rename-folder-popup-item:rtl { - padding: 0 8px; -} - -/* Screen Shield */ -.unlock-dialog-clock { - color: white; - font-weight: 300; - text-align: center; - spacing: 24px; - padding-bottom: 2.5em; -} - -.unlock-dialog-clock-time { - font-size: 64pt; - padding-top: 42px; - font-feature-settings: "tnum"; -} - -.unlock-dialog-clock-date { - font-size: 16pt; - font-weight: normal; -} - -.unlock-dialog-clock-hint { - font-weight: normal; - padding-top: 48px; -} - -.unlock-dialog-notifications-container { - margin: 12px 0; - spacing: 6px; - width: 23em; - background-color: transparent; -} - -.unlock-dialog-notifications-container .summary-notification-stack-scrollview { - padding-top: 0; - padding-bottom: 0; -} - -.unlock-dialog-notifications-container .notification, -.unlock-dialog-notifications-container .unlock-dialog-notification-source { - padding: 12px 6px; - border: none; - background-color: rgba(0, 0, 0, 0.6); - color: white; - border-radius: 6px; -} - -.unlock-dialog-notifications-container .notification.critical, -.unlock-dialog-notifications-container .unlock-dialog-notification-source.critical { - background-color: rgba(0, 0, 0, 0.3); -} - -.unlock-dialog-notification-label { - padding: 0px 0px 0px 12px; -} - -.unlock-dialog-notification-count-text { - weight: bold; - padding: 0 6px; - color: white; - background-color: -st-accent-color; - border-radius: 99px; - margin-right: 12px; -} - -.screen-shield-background { - background: black; - box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.15); -} - -#unlockDialogNotifications StButton#vhandle, #unlockDialogNotifications StButton#hhandle { - background-color: rgba(245, 245, 245, 0.3); -} - -#unlockDialogNotifications StButton#vhandle:hover, #unlockDialogNotifications StButton#vhandle:focus, #unlockDialogNotifications StButton#hhandle:hover, #unlockDialogNotifications StButton#hhandle:focus { - background-color: rgba(245, 245, 245, 0.5); -} - -#unlockDialogNotifications StButton#vhandle:active, #unlockDialogNotifications StButton#hhandle:active { - background-color: st-transparentize(-st-accent-color, 0.5); -} - -/* Scrollbars */ -StScrollView.vfade { - -st-vfade-offset: 68px; -} - -StScrollView.hfade { - -st-hfade-offset: 68px; -} - -StScrollBar { - padding: 0; - margin: 6px; -} - -StScrollView StScrollBar { - min-width: 8px; - min-height: 8px; -} - -StScrollBar StBin#trough { - border-radius: 9999px; - background-color: rgba(0, 0, 0, 0.12); -} - -StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 9999px; - background-color: #565656; - border: 4px solid transparent; -} - -StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: #424242; -} - -StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { - background-color: #242424; -} - -.app-folder-dialog .folder-name-container .folder-name-entry, #overview .search-entry { - width: 320px; - min-height: 28px; - padding: 0 10px !important; - background-clip: padding-box; - color: rgba(255, 255, 255, 0.5); - caret-color: rgba(255, 255, 255, 0.85); - selection-background-color: rgba(255, 255, 255, 0.2); - selected-color: rgba(255, 255, 255, 0.85); - background-color: rgba(255, 255, 255, 0.12); - border-radius: 8px; - border-color: transparent !important; - box-shadow: none !important; - box-shadow: none; -} - -.app-folder-dialog .folder-name-container .folder-name-entry:hover, #overview .search-entry:hover { - background-color: rgba(255, 255, 255, 0.2); - border-color: transparent !important; - box-shadow: none !important; - color: rgba(255, 255, 255, 0.85); - box-shadow: none; -} - -.app-folder-dialog .folder-name-container .folder-name-entry:focus, #overview .search-entry:focus { - border-color: transparent !important; - background-color: rgba(255, 255, 255, 0.18); - box-shadow: none !important; - color: rgba(255, 255, 255, 0.85); - box-shadow: none; -} - -.app-folder-dialog .folder-name-container .folder-name-entry .search-entry-icon, #overview .search-entry .search-entry-icon { - icon-size: 16px; - padding: 0 0; - color: rgba(255, 255, 255, 0.5); -} - -.app-folder-dialog .folder-name-container .folder-name-entry:hover .search-entry-icon, .app-folder-dialog .folder-name-container .folder-name-entry:focus .search-entry-icon, #overview .search-entry:hover .search-entry-icon, #overview .search-entry:focus .search-entry-icon { - color: rgba(255, 255, 255, 0.85); -} - -.app-folder-dialog .folder-name-container .folder-name-entry:insensitive, #overview .search-entry:insensitive { - color: rgba(255, 255, 255, 0.45); -} - -.app-folder-dialog .folder-name-container .folder-name-entry StLabel.hint-text, #overview .search-entry StLabel.hint-text { - color: rgba(255, 255, 255, 0.5); -} - -/* Search */ -.list-search-result, .search-provider-icon { - border-radius: 6px; - padding: 8px; - transition-duration: 0; - text-align: center; - background-color: transparent; -} - -.list-search-result:focus, .search-provider-icon:focus, .list-search-result:hover, .search-provider-icon:hover, .list-search-result:selected, .search-provider-icon:selected { - background-color: rgba(255, 255, 255, 0.12); - transition: none; -} - -.list-search-result:active, .search-provider-icon:active, .list-search-result:checked, .search-provider-icon:checked { - background-color: rgba(255, 255, 255, 0.2); - transition-duration: 150ms; -} - -#searchResultsContent { - max-width: 1024px; - spacing: 6px; -} - -.search-section { - spacing: 6px; -} - -.search-section .search-section-separator { - height: 0; - background-color: rgba(255, 255, 255, 0.12); -} - -.search-section-content { - spacing: 6px; - border-radius: 16px; - padding: 12px; - border: none; - box-shadow: none; - background: rgba(255, 255, 255, 0.12); - text-shadow: none; - color: rgba(255, 255, 255, 0.85); -} - -.search-statustext { - font-size: 2em; - font-weight: bold; - color: rgba(255, 255, 255, 0.5); -} - -.grid-search-results { - spacing: 24px; -} - -.search-provider-icon .list-search-provider-content { - spacing: 8px; -} - -.search-provider-icon .list-search-provider-content .list-search-provider-details { - width: 120px; - margin-top: 0; - color: rgba(255, 255, 255, 0.5); -} - -.list-search-results { - spacing: 4px; -} - -.list-search-result .list-search-result-content { - spacing: 4px; -} - -.list-search-result .list-search-result-title { - spacing: 8px; -} - -.list-search-result .list-search-result-description { - color: rgba(255, 255, 255, 0.85); -} - -/* App Switcher */ -.switcher-popup { - padding: 8px; - spacing: 16px; -} - -.switcher-list { - border-radius: 20px; -} - -.switcher-list .item-box { - padding: 8px; - border-radius: 12px; - border: 1px solid transparent; - background-color: transparent; - color: #242424; -} - -.switcher-list .item-box:outlined { - background-color: rgba(0, 0, 0, 0.12); - color: #242424; -} - -.switcher-list .item-box:selected { - background-color: -st-accent-color; - color: rgba(255, 255, 255, 0.85); -} - -.switcher-list .thumbnail-box { - padding: 2px; - spacing: 4px; -} - -.switcher-list .thumbnail { - width: 256px; -} - -.switcher-list .separator { - width: 1px; - background: rgba(0, 0, 0, 0.12); -} - -.switcher-list .switcher-list-item-container { - spacing: 8px; -} - -.switcher-arrow { - border-color: rgba(0, 0, 0, 0); - color: #565656; -} - -.switcher-arrow:highlighted { - color: #242424; -} - -.input-source-switcher-symbol { - font-size: 34pt; - width: 96px; - height: 96px; -} - -.cycler-highlight { - border: 5px solid -st-accent-color; -} - -/* Tiled window previews */ -.tile-preview { - background-color: st-transparentize(-st-accent-color, 0.75); - border: 1px solid -st-accent-color; -} - -.tile-preview-left.on-primary { - border-radius: 9px 0 0 0; -} - -.tile-preview-right.on-primary { - border-radius: 0 9px 0 0; -} - -.tile-preview-left.tile-preview-right.on-primary { - border-radius: 9px 9px 0 0; -} - -/* Workspace Switcher */ -.workspace-switcher-group { - padding: 8px; -} - -.workspace-switcher { - background: transparent; - border: none; - border-radius: 0; - padding: 0; - spacing: 8px; -} - -.ws-switcher-box { - background: transparent; - height: 50px; - background-size: 32px; - background: rgba(0, 0, 0, 0.12); - border-radius: 6px; -} - -.ws-switcher-active-up, -.ws-switcher-active-down, -.ws-switcher-active-left, -.ws-switcher-active-right { - height: 52px; - background-color: -st-accent-color; - color: rgba(255, 255, 255, 0.85); - border-radius: 11px; - border: none; -} - -/* App Grid */ -.icon-grid { - row-spacing: 12px; - column-spacing: 12px; - max-row-spacing: 36px; - max-column-spacing: 36px; - page-padding-top: 24px; - page-padding-bottom: 24px; - page-padding-left: 18px; - page-padding-right: 18px; -} - -/* App Icons */ -.overview-tile { - color: rgba(255, 255, 255, 0.85); - background-color: transparent; - border-radius: 18px; - padding: 12px; - spacing: 4px; - text-align: center; - transition-duration: 100ms; -} - -.overview-tile:focus { - color: white; - background-color: rgba(255, 255, 255, 0.12); -} - -.overview-tile:hover { - color: white; - background-color: rgba(255, 255, 255, 0.12); -} - -.overview-tile:active { - color: white; - background-color: rgba(255, 255, 255, 0.2); -} - -.overview-tile:highlighted, .overview-tile:selected, .overview-tile:checked { - color: white; - background-color: rgba(255, 255, 255, 0.2); -} - -.overview-tile:insensitive { - color: rgba(255, 255, 255, 0.35); - background-color: transparent; -} - -.overview-tile .overview-icon.overview-icon-with-label > StBoxLayout { - spacing: 6px; -} - -.app-grid-running-dot { - width: 5px; - height: 5px; - border-radius: 5px; - background-color: rgba(255, 255, 255, 0.85); - margin-bottom: 0 !important; - offset-y: 6px; -} - -StWidget.focused .app-grid-running-dot { - background-color: -st-accent-color; -} - -.app-folder { - background-color: rgba(255, 255, 255, 0.12); -} - -.app-folder:focus { - background-color: rgba(255, 255, 255, 0.12); -} - -.app-folder:hover { - background-color: rgba(255, 255, 255, 0.2); -} - -.app-folder:active { - background-color: rgba(255, 255, 255, 0.3); -} - -.app-folder:highlighted, .app-folder:selected, .app-folder:checked { - background-color: rgba(255, 255, 255, 0.3); -} - -.app-folder:insensitive { - background-color: transparent; -} - -.app-folder-dialog-container { - padding-top: 28px; -} - -.app-folder-dialog { - width: 720px; - height: 720px; -} - -.app-folder-dialog .page-indicators { - margin-bottom: 16px; -} - -.app-folder-dialog .icon-button, .app-folder-dialog .background-app-item .close-button, .background-app-item .app-folder-dialog .close-button, .app-folder-dialog .message .message-header .message-expand-button, .message .message-header .app-folder-dialog .message-expand-button, -.app-folder-dialog .message .message-header .message-close-button, -.message .message-header .app-folder-dialog .message-close-button, .app-folder-dialog .page-navigation-arrow { - color: rgba(255, 255, 255, 0.85); - background-color: transparent; - border: none !important; -} - -.app-folder-dialog .icon-button:hover, .app-folder-dialog .background-app-item .close-button:hover, .background-app-item .app-folder-dialog .close-button:hover, .app-folder-dialog .message .message-header .message-expand-button:hover, .message .message-header .app-folder-dialog .message-expand-button:hover, -.app-folder-dialog .message .message-header .message-close-button:hover, -.message .message-header .app-folder-dialog .message-close-button:hover, .app-folder-dialog .page-navigation-arrow:hover { - background-color: rgba(255, 255, 255, 0.12); - color: white; -} - -.app-folder-dialog .icon-button:active, .app-folder-dialog .background-app-item .close-button:active, .background-app-item .app-folder-dialog .close-button:active, .app-folder-dialog .message .message-header .message-expand-button:active, .message .message-header .app-folder-dialog .message-expand-button:active, -.app-folder-dialog .message .message-header .message-close-button:active, -.message .message-header .app-folder-dialog .message-close-button:active, .app-folder-dialog .page-navigation-arrow:active { - background-color: rgba(255, 255, 255, 0.2); - color: white; -} - -.apps-scroll-view { - padding: 0; -} - -.system-action-icon { - background-color: rgba(255, 255, 255, 0.06); - color: white; - border-radius: 9999px; - icon-size: 48px; -} - -.page-navigation-hint { - width: 220px; -} - -.page-navigation-hint.dnd { - background: rgba(255, 255, 255, 0.1); -} - -.page-navigation-hint.next:ltr, .page-navigation-hint.previous:rtl { - background-gradient-start: rgba(255, 255, 255, 0.12); - background-gradient-end: transparent; - background-gradient-direction: horizontal; - border-radius: 16px 0px 0px 16px; -} - -.page-navigation-hint.previous:ltr, .page-navigation-hint.next:rtl { - background-gradient-start: transparent; - background-gradient-end: rgba(255, 255, 255, 0.12); - background-gradient-direction: horizontal; - border-radius: 0px 16px 16px 0px; -} - -.page-navigation-arrow { - margin: 4px; - padding: 12px; - width: 24px; - height: 24px; - border-radius: 9999px; - color: rgba(255, 255, 255, 0.85); - background-color: transparent; -} - -.page-navigation-arrow > StIcon { - color: white; -} - -.page-navigation-arrow:insensitive { - background-color: rgba(255, 255, 255, 0.06); - color: rgba(255, 255, 255, 0.35); -} - -.page-navigation-arrow:hover { - background-color: rgba(255, 255, 255, 0.12); - color: white; -} - -.page-navigation-arrow:active { - background-color: rgba(255, 255, 255, 0.2); - color: white; -} - -/* Check Boxes */ -.check-box StBoxLayout { - spacing: .8em; -} - -.check-box StBin { - border-radius: 7px; - padding: 2px; -} - -.check-box:focus StBin { - background-color: rgba(0, 0, 0, 0.01); - box-shadow: inset 0 0 0 2px st-transparentize(-st-accent-color, 0.65); -} - -.check-box StIcon { - icon-size: 14px; - padding: 1px; - color: transparent; - border-radius: 6px; - border: 2px solid rgba(0, 0, 0, 0.15); -} - -.check-box:hover StIcon { - border-color: rgba(0, 0, 0, 0.2); -} - -.check-box:active StIcon { - border-color: rgba(0, 0, 0, 0.3); -} - -.check-box:checked StIcon { - background-color: -st-accent-color; - color: -st-accent-fg-color; - border-color: transparent; -} - -.check-box:checked:hover StIcon { - background-color: st-lighten(-st-accent-color, 5%); - color: st-lighten(-st-accent-fg-color, 5%); -} - -.check-box:checked:active StIcon { - background-color: st-darken(-st-accent-color, 7%); - color: st-darken(-st-accent-fg-color, 7%); -} - -/* Dash */ -#dash { - padding-left: 4px; - padding-right: 4px; -} - -#dash .dash-background { - background-color: rgba(255, 255, 255, 0.12); - border-radius: 28px; - padding-top: 8px; - padding-bottom: 8px; - padding-left: 6.5px; - padding-right: 6.5px; - border: 1px solid rgba(0, 0, 0, 0.08); - box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05); -} - -#dash .dash-item-container .placeholder { - background-image: none; - background-size: contain; - height: 32px; -} - -#dash .dash-item-container .empty-dash-drop-target { - width: 32px; - height: 32px; -} - -#dash .dash-item-container .show-apps, -#dash .dash-item-container .overview-tile { - background: none; - box-shadow: none; - border: none; - border-radius: 0; - padding: 0; - margin: 0 1.5px; - padding-bottom: 9px; -} - -#dash .dash-item-container .show-apps .overview-icon, -#dash .dash-item-container .overview-tile .overview-icon { - border-radius: 20px; - padding: 4px; - spacing: 4px; - text-align: center; - transition-duration: 100ms; - background: none; -} - -#dash .dash-item-container .show-apps:focus .overview-icon, -#dash .dash-item-container .overview-tile:focus .overview-icon { - background-color: rgba(255, 255, 255, 0.12); -} - -#dash .dash-item-container .show-apps:hover .overview-icon, -#dash .dash-item-container .overview-tile:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.12); -} - -#dash .dash-item-container .show-apps:active .overview-icon, -#dash .dash-item-container .overview-tile:active .overview-icon { - background-color: rgba(255, 255, 255, 0.2); -} - -#dash .dash-item-container .show-apps:highlighted .overview-icon, #dash .dash-item-container .show-apps:selected .overview-icon, #dash .dash-item-container .show-apps:checked .overview-icon, -#dash .dash-item-container .overview-tile:highlighted .overview-icon, -#dash .dash-item-container .overview-tile:selected .overview-icon, -#dash .dash-item-container .overview-tile:checked .overview-icon { - background-color: rgba(255, 255, 255, 0.2); -} - -#dash .dash-item-container .show-apps:insensitive .overview-icon, -#dash .dash-item-container .overview-tile:insensitive .overview-icon { - background-color: transparent; -} - -#dash .dash-item-container .app-grid-running-dot { - offset-y: -9px; -} - -#dash .dash-separator { - width: 1px; - margin-left: 3px; - margin-right: 3px; - background-color: rgba(255, 255, 255, 0.15); -} - -#dash .dash-separator, -#dash .dash-background { - margin-bottom: 9px; -} - -.dash-label { - -y-offset: 6px; -} - -/* Modal Dialogs */ -.modal-dialog, .candidate-popup-content { - background-color: #f5f5f5; - border-radius: 16px; - border: solid rgba(0, 0, 0, 0.75); - border-width: 0; - box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.25); -} - -.modal-dialog .modal-dialog-button-box .modal-dialog-button:last-child { - color: white !important; - background-color: -st-accent-color; - background-gradient-direction: none !important; -} - -.modal-dialog .modal-dialog-button-box .modal-dialog-button:hover:last-child { - color: white !important; - background-gradient-direction: none !important; - background-color: st-lighten(-st-accent-color, 9%); -} - -.modal-dialog .modal-dialog-button-box .modal-dialog-button:active:last-child { - color: white !important; - background-gradient-direction: none !important; - background-color: st-darken(-st-accent-color, 5%); -} - -.modal-dialog .modal-dialog-button-box .modal-dialog-button:insensitive:last-child { - background-gradient-direction: none !important; - background-color: st-transparentize(-st-accent-color, 0.9); - color: st-transparentize(-st-accent-color, 0.65) !important; -} - -.modal-dialog { - color: #242424; - padding: 12px; -} - -.modal-dialog .modal-dialog-content-box { - margin: 32px 40px; - spacing: 32px; - max-width: 28em; -} - -.modal-dialog .modal-dialog-button-box { - padding-top: 4px; - spacing: 0; -} - -.modal-dialog .modal-dialog-button-box .modal-dialog-button { - min-height: 40px; - padding: 0 16px; - margin: 0 !important; - border: none !important; - border-radius: 8px; - font-size: 9.75pt; - font-weight: 500; - color: #242424; - background-color: #e6e6e6; - border: none; - text-shadow: none; - icon-shadow: none; -} - -.modal-dialog .modal-dialog-button-box .modal-dialog-button:hover { - color: #242424; - border: none; - text-shadow: none; - icon-shadow: none; - background-color: st-mix(#242424, #e6e6e6, 6%); -} - -.modal-dialog .modal-dialog-button-box .modal-dialog-button:active { - color: #242424; - border: none; - text-shadow: none; - icon-shadow: none; - background-color: st-mix(#242424, #e6e6e6, 12%); -} - -.modal-dialog .modal-dialog-button-box .modal-dialog-button:checked { - color: white; - background-color: -st-accent-color; - border: none; - text-shadow: none; - icon-shadow: none; -} - -.modal-dialog .modal-dialog-button-box .modal-dialog-button:insensitive { - color: rgba(36, 36, 36, 0.45); - background-color: #e6e6e6; - border: none; - text-shadow: none; - icon-shadow: none; -} - -.modal-dialog .modal-dialog-button-box .modal-dialog-button:focus { - color: #242424; - text-shadow: none; - icon-shadow: none; - box-shadow: none !important; -} - -.end-session-dialog { - width: 30em; -} - -.end-session-dialog .end-session-dialog-battery-warning, -.end-session-dialog .dialog-list-title { - color: #E9873A; -} - -.message-dialog-content { - spacing: 18px; -} - -.message-dialog-content .message-dialog-title { - text-align: center; -} - -.message-dialog-content .message-dialog-description { - text-align: center; -} - -.dialog-list { - spacing: 18px; -} - -.dialog-list .dialog-list-title { - text-align: center; -} - -.dialog-list .dialog-list-scrollview { - max-height: 200px; -} - -.dialog-list .dialog-list-box { - spacing: 1em; -} - -.dialog-list .dialog-list-box .dialog-list-item { - spacing: 1em; -} - -.dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-title { - font-weight: bold; -} - -.dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-description { - color: #424242; -} - -.run-dialog .modal-dialog-content-box { - margin-top: 24px; - margin-bottom: 14px; -} - -.run-dialog .run-dialog-entry { - width: 20em; -} - -.run-dialog .run-dialog-description { - text-align: center; - color: #424242; -} - -.prompt-dialog { - width: 28em; -} - -.prompt-dialog .modal-dialog-content-box { - margin-bottom: 24px; -} - -.prompt-dialog-password-grid { - spacing-rows: 8px; - spacing-columns: 4px; -} - -.prompt-dialog-password-grid .prompt-dialog-password-entry { - width: auto; -} - -.prompt-dialog-password-grid .prompt-dialog-password-entry:ltr { - margin-left: 20px; -} - -.prompt-dialog-password-grid .prompt-dialog-password-entry:rtl { - margin-right: 20px; -} - -.prompt-dialog-password-grid { - spacing-rows: 8px; - spacing-columns: 4px; -} - -.prompt-dialog-password-grid .prompt-dialog-password-entry { - width: auto; -} - -.prompt-dialog-password-grid .prompt-dialog-password-entry:ltr { - margin-left: 20px; -} - -.prompt-dialog-password-grid .prompt-dialog-password-entry:rtl { - margin-right: 20px; -} - -.prompt-dialog-password-layout { - spacing: 8px; -} - -.prompt-dialog-password-entry { - width: 20em; -} - -.prompt-dialog-error-label, -.prompt-dialog-info-label, -.prompt-dialog-null-label { - text-align: center; -} - -.prompt-dialog-error-label { - color: #ED5F5D; -} - -.prompt-dialog-info-label, -.prompt-dialog-null-label { - color: #565656; -} - -.polkit-dialog-user-layout { - text-align: center; - spacing: 8px; - margin-bottom: 6px; -} - -.polkit-dialog-user-layout .polkit-dialog-user-root-label { - color: #E9873A; -} - -.audio-device-selection-dialog .modal-dialog-content-box { - margin-bottom: 28px; -} - -.audio-device-selection-dialog .audio-selection-box { - spacing: 20px; -} - -.audio-selection-device { - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 6px; -} - -.audio-selection-device:hover, .audio-selection-device:focus { - background-color: rgba(0, 0, 0, 0.16); -} - -.audio-selection-device:active { - background-color: -st-accent-color; - color: white; -} - -.audio-selection-device-box { - padding: 20px; - spacing: 20px; -} - -.audio-selection-device-icon { - icon-size: 64px; -} - -.welcome-dialog-image { - background-image: url("resource:///org/gnome/shell/theme/gnome-shell-start.svg"); - background-size: contain; - height: 300px; - width: 300px; -} - -/* Access portal dialog */ -.access-dialog { - text-align: center; -} - -/* Message List */ -.message-list { - width: 29em; - padding: 0 3px; - text-shadow: none; - border: none; -} - -.message-list:ltr { - margin-left: 0; - margin-right: 0; - padding-right: 0; - border-right-width: 0; -} - -.message-list:rtl { - margin-right: 0; - margin-left: 0; - padding-left: 0; - border-left-width: 0; -} - -.message-list .message-list-placeholder { - color: rgba(36, 36, 36, 0.45); -} - -.message-list .message-list-placeholder > StIcon { - icon-size: 96px; - margin-bottom: 9px; - -st-icon-style: symbolic; -} - -.message-list-sections { - spacing: 8px; -} - -.message-list-sections:ltr { - margin-right: 9px; -} - -.message-list-sections:rtl { - margin-left: 9px; -} - -.message-list-section, -.message-list-section-list { - spacing: 8px; -} - -.message-list-controls { - padding: 8px; - padding-bottom: 4px; - spacing: 4px; -} - -.message-list-controls .dnd-button { - border-width: 2px; - border-color: transparent; - border-radius: 32px; - border-style: solid; -} - -.message-list-controls .dnd-button:focus { - border-color: st-transparentize(-st-accent-color, 0.4); -} - -.popup-menu .message { - border-radius: 8px; - padding: 0.409em; - margin: 3px; - background-color: rgba(255, 255, 255, 0.95); - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.02); - color: #424242; -} - -.popup-menu .message:hover, .popup-menu .message:focus { - color: #242424; - background-color: white; - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important; -} - -.popup-menu .message:active { - color: #242424; - background-color: rgba(252, 252, 252, 0.95); - box-shadow: none !important; -} - -.popup-menu .message:insensitive { - color: rgba(66, 66, 66, 0.45); - background-color: rgba(255, 255, 255, 0.5); - box-shadow: none !important; -} - -.message { - border: 1px solid transparent; - border-left: none; -} - -.message:ltr { - padding-right: -2px; -} - -.message:rtl { - padding-left: -2px; -} - -.message .message-header { - padding: 0 0.409em; - margin: 4px; - margin-bottom: 0; - spacing: 4px; - color: rgba(36, 36, 36, 0.45); -} - -.message .message-header .message-source-icon { - icon-size: 1.091em; - -st-icon-style: symbolic; -} - -.message .message-header .message-header-content { - spacing: 4px; - min-height: 1.637em; - padding-bottom: 4px; -} - -.message .message-header .message-header-content .message-source-title { - font-weight: bold; -} - -.message .message-header .message-header-content .event-time { - color: rgba(36, 36, 36, 0.45); - padding-bottom: 0.068em; -} - -.message .message-header .message-header-content .event-time:ltr { - text-align: right; -} - -.message .message-header .message-header-content .event-time:rtl { - text-align: left; -} - -.message .message-header .message-expand-button, -.message .message-header .message-close-button { - color: #242424; - background-color: rgba(36, 36, 36, 0.1); - padding: 4px; - border: none; -} - -.message .message-header .message-expand-button:hover, -.message .message-header .message-close-button:hover { - background-color: rgba(36, 36, 36, 0.19); -} - -.message .message-header .message-expand-button:active, .message .message-header .message-expand-button:active:hover, -.message .message-header .message-close-button:active, -.message .message-header .message-close-button:active:hover { - background-color: rgba(36, 36, 36, 0.24); -} - -.message .message-header .message-expand-button:insensitive, -.message .message-header .message-close-button:insensitive { - background-color: rgba(36, 36, 36, 0.07); -} - -.message .message-header .message-expand-button { - padding: 4px; -} - -.message .message-header .message-expand-button:ltr { - margin-right: 4px; -} - -.message .message-header .message-expand-button:rtl { - margin-left: 4px; -} - -.message .message-box { - padding: 4px; - margin: 4px; - margin-top: 0; - spacing: 4px; -} - -.message .message-box .message-icon { - icon-size: 48px; - -st-icon-style: symbolic; -} - -.message .message-box .message-icon:ltr { - margin-right: 4px; -} - -.message .message-box .message-icon:rtl { - margin-left: 4px; -} - -.message .message-box .message-icon.message-themed-icon { - border-radius: 9999px; - background-color: rgba(36, 36, 36, 0.2); - icon-size: 16px; - min-width: 48px; - min-height: 48px; -} - -.message .message-box:first-child { - margin-top: 8px; -} - -.message .message-box .message-content { - spacing: 3px; -} - -.message .message-box .message-content .message-title { - font-weight: bold; -} - -.message .message-secondary-bin { - padding: 0 6px; -} - -.message .message-secondary-bin > .event-time { - color: #565656; - font-size: 1em; - /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ - padding-bottom: 0.13em; -} - -.message .message-secondary-bin > .event-time:ltr { - text-align: right; -} - -.message .message-secondary-bin > .event-time:rtl { - text-align: left; -} - -.url-highlighter { - link-color: #3484e2; -} - -.message-media-control { - margin: 7px 4px !important; - padding: 8px !important; - border-radius: 9999px; - color: #424242; -} - -.message-media-control:hover, .message-media-control:focus { - color: #242424; - background-color: rgba(0, 0, 0, 0.12); -} - -.message-media-control:active { - color: #242424; - background-color: rgba(0, 0, 0, 0.2); -} - -.message-media-control:insensitive { - color: rgba(36, 36, 36, 0.45); -} - -.message-media-control StIcon { - icon-size: 16px; -} - -.media-message .message-icon { - border-radius: 6px !important; -} - -.media-message .message-icon.message-themed-icon { - icon-size: 32px !important; -} - -/* Notifications & Message Tray */ -.notification-banner { - min-height: 64px; - width: 34em; - border-radius: 12px; - margin: 8px; - padding: 0.409em; - color: #242424; - background-color: #ffffff; - border: 1px solid rgba(0, 0, 0, 0); - text-shadow: none; - box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15); -} - -.notification-banner:hover, .notification-banner:active { - background-color: white; -} - -.notification-buttons-bin { - spacing: 0; - padding: 0; -} - -.notification-button { - min-height: 40px; - padding: 0 16px; - background-color: rgba(0, 0, 0, 0.06); - color: #424242; - font-weight: 500; - border: none; - margin-right: 0.409em !important; -} - -.notification-button:focus { - background-color: #ffffff; - color: #242424; - box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.12) !important; -} - -.notification-button:hover { - background-color: rgba(0, 0, 0, 0.12); - color: #242424; - box-shadow: none; -} - -.notification-button:active, .notification-button:checked { - background-color: rgba(0, 0, 0, 0.2); - color: #242424; -} - -.notification-button:insensitive { - background-color: transparent; - color: rgba(66, 66, 66, 0.45); -} - -.notification-button:first-child:ltr { - border-radius: 6px; -} - -.notification-button:last-child:ltr { - border-radius: 6px; - margin-right: 0.409em !important; -} - -.notification-button:first-child:rtl { - border-radius: 6px; -} - -.notification-button:last-child:rtl { - border-radius: 6px; - margin-left: 0 !important; -} - -.notification-button:first-child:last-child { - border-radius: 6px; - margin-left: 0 !important; - margin-right: 0.409em !important; -} - -.controls-manager, .secondary-monitor-workspaces { - spacing: 8px; -} - -#overviewGroup { - background-color: #2a2a2a; -} - -.osd-window { - spacing: 8px; - padding: 8px 12px; - margin-bottom: 4em; -} - -.osd-window > * { - spacing: 8px; -} - -.osd-window StIcon { - icon-size: 32px; -} - -.osd-window StLabel:ltr { - margin-right: 6px; -} - -.osd-window StLabel:rtl { - margin-left: 6px; -} - -.osd-window .level { - margin-bottom: 4px; - min-width: 160px; -} - -.osd-window .level:first-child { - margin-bottom: 0px; -} - -.osd-window .level:ltr { - margin-right: 4px; -} - -.osd-window .level:rtl { - margin-left: 4px; -} - -#appMenu { - spacing: 4px; -} - -#appMenu .label-shadow { - color: transparent; -} - -#appMenu .panel-status-menu-box { - padding: 0 4px; - spacing: 4px; -} - -.popup-menu-item:ltr { - padding-right: 8px; - padding-left: 8px; -} - -.popup-menu-item:rtl { - padding-left: 8px; - padding-right: 8px; -} - -.popup-separator-menu-item { - border: none !important; -} - -.popup-separator-menu-item:ltr { - margin-right: 4px; -} - -.popup-separator-menu-item:rtl { - margin-left: 4px; -} - -.popup-separator-menu-item .popup-separator-menu-item-separator { - height: 1px; - background-color: rgba(0, 0, 0, 0.12); -} - -.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 { - margin-right: 2.5em; -} - -.popup-sub-menu .popup-separator-menu-item:rtl { - margin-left: 2.5em; -} - -.popup-sub-menu .popup-separator-menu-item .popup-separator-menu-item-separator { - background-color: rgba(0, 0, 0, 0.08); -} - -.aggregate-menu .popup-menu-ornament, .aggregate-menu .popup-sub-menu .popup-menu-ornament { - width: 0 !important; -} - -.aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:ltr { - margin-left: 10px; -} - -.aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:rtl { - margin-right: 10px; -} - -.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: 6px; -} - -.app-menu .popup-inactive-menu-item:first-child > StLabel:rtl { - margin-left: 6px; -} - -.quick-settings { - padding: 12px !important; - border-radius: 33px !important; - margin-top: 8px !important; -} - -.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .message .message-header .message-expand-button, .message .message-header .quick-settings .message-expand-button, -.quick-settings .message .message-header .message-close-button, -.message .message-header .quick-settings .message-close-button, .quick-settings .button { - padding: 7px; -} - -.quick-settings .icon-button StIcon, .quick-settings .background-app-item .close-button StIcon, .background-app-item .quick-settings .close-button StIcon, .quick-settings .message .message-header .message-expand-button StIcon, .message .message-header .quick-settings .message-expand-button StIcon, -.quick-settings .message .message-header .message-close-button StIcon, -.message .message-header .quick-settings .message-close-button StIcon, .quick-settings .button StIcon { - icon-size: 16px !important; -} - -.quick-settings-grid { - spacing-rows: 12px; - spacing-columns: 12px; -} - -.quick-toggle, .quick-menu-toggle { - border-radius: 9999px; - min-width: 12em; - max-width: 12em; - min-height: 3.273em; - border: none; -} - -.quick-toggle { - background-color: rgba(0, 0, 0, 0.06) !important; - /* Move padding into the box; this is to allow menu arrows - to extend to the border */ -} - -.quick-toggle:hover { - background-color: rgba(0, 0, 0, 0.12) !important; -} - -.quick-toggle:active { - background-color: rgba(0, 0, 0, 0.16) !important; -} - -.quick-toggle:checked { - background-color: -st-accent-color !important; - color: white; -} - -.quick-toggle:checked:hover { - color: white; - background-color: st-mix(#363636, -st-accent-color, 6%) !important; -} - -.quick-toggle:checked:active { - color: white; - background-color: st-mix(#363636, -st-accent-color, 15%) !important; -} - -.quick-toggle > StBoxLayout { - spacing: 6px; -} - -.quick-toggle.button { - padding: 0; -} - -.quick-toggle > StBoxLayout { - padding: 0 8px; -} - -.quick-toggle:ltr > StBoxLayout { - padding-left: 16px; -} - -.quick-toggle:rtl > StBoxLayout { - padding-right: 16px; -} - -.quick-toggle .quick-toggle-title { - font-weight: bold; -} - -.quick-toggle StBoxLayout > .quick-toggle-subtitle { - font-weight: normal; -} - -.quick-toggle .quick-toggle-icon { - icon-size: 16px !important; -} - -.quick-menu-toggle .quick-toggle { - min-width: auto; - max-width: auto; -} - -.quick-menu-toggle .quick-toggle:ltr { - border-radius: 9999px 0 0 9999px; -} - -.quick-menu-toggle .quick-toggle:ltr > StBoxLayout { - padding-right: 8px; -} - -.quick-menu-toggle .quick-toggle:rtl { - border-radius: 0 9999px 9999px 0; -} - -.quick-menu-toggle .quick-toggle:rtr > StBoxLayout { - padding-left: 8px; -} - -.quick-menu-toggle .quick-toggle:ltr:last-child { - border-radius: 9999px; -} - -.quick-menu-toggle .quick-toggle:rtl:last-child { - border-radius: 9999px; -} - -.quick-menu-toggle .quick-toggle-arrow { - padding: 0.409em 0.818em; - border: none; - background-color: rgba(0, 0, 0, 0.06) !important; -} - -.quick-menu-toggle .quick-toggle-arrow:hover { - background-color: rgba(0, 0, 0, 0.12) !important; -} - -.quick-menu-toggle .quick-toggle-arrow:active { - background-color: rgba(0, 0, 0, 0.16) !important; -} - -.quick-menu-toggle .quick-toggle-arrow:checked { - background-color: -st-accent-color !important; - color: white; -} - -.quick-menu-toggle .quick-toggle-arrow:checked:hover { - color: white; - background-color: st-mix(#363636, -st-accent-color, 6%) !important; -} - -.quick-menu-toggle .quick-toggle-arrow:checked:active { - color: white; - background-color: st-mix(#363636, -st-accent-color, 15%) !important; -} - -.quick-menu-toggle .quick-toggle-arrow:ltr { - border-radius: 0 9999px 9999px 0; - border-left-width: 0; -} - -.quick-menu-toggle .quick-toggle-arrow:rtl { - border-radius: 9999px 0 0 9999px; - border-right-width: 0; -} - -.quick-slider > StBoxLayout { - spacing: 4px; -} - -.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button, .quick-slider .message .message-header .message-expand-button, .message .message-header .quick-slider .message-expand-button, -.quick-slider .message .message-header .message-close-button, -.message .message-header .quick-slider .message-close-button { - padding: 0.6135em; -} - -.quick-slider .slider-bin { - min-height: 16px; - padding: 4px; - border-radius: 9999px; -} - -.quick-slider .slider-bin:focus { - color: #242424; - text-shadow: none; - icon-shadow: none; - box-shadow: none !important; -} - -.quick-toggle-menu { - background-color: #ffffff !important; - color: #363636 !important; - border-radius: 24px; - padding: 12px; - margin: 8px 24px 0; - border: none !important; -} - -.quick-toggle-menu .popup-menu-item { - border-radius: 9999px !important; - min-height: 20px; -} - -.quick-toggle-menu .popup-menu-item:focus, .quick-toggle-menu .popup-menu-item:hover, .quick-toggle-menu .popup-menu-item.selected { - color: #363636 !important; - background-color: rgba(0, 0, 0, 0.12) !important; -} - -.quick-toggle-menu .popup-menu-item > StIcon { - -st-icon-style: symbolic; -} - -.quick-toggle-menu .header { - spacing-rows: 2px; - spacing-columns: 8px; - padding-bottom: 8px; -} - -.quick-toggle-menu .header .icon { - icon-size: 24px; - border-radius: 9999px; - padding: 6px; - background-color: rgba(36, 36, 36, 0.2); -} - -.quick-toggle-menu .header .icon.active { - background-color: -st-accent-color; - color: white; -} - -.quick-settings-system-item > StBoxLayout { - spacing: 8px; -} - -.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button, .quick-settings-system-item .message .message-header .message-expand-button, .message .message-header .quick-settings-system-item .message-expand-button, -.quick-settings-system-item .message .message-header .message-close-button, -.message .message-header .quick-settings-system-item .message-close-button { - background-color: rgba(0, 0, 0, 0.06); - color: #363636; - border-radius: 9999px; - min-height: 28px !important; - min-width: 28px !important; -} - -.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover, .quick-settings-system-item .message .message-header .message-expand-button:hover, .message .message-header .quick-settings-system-item .message-expand-button:hover, -.quick-settings-system-item .message .message-header .message-close-button:hover, -.message .message-header .quick-settings-system-item .message-close-button:hover { - color: #242424; - background-color: rgba(0, 0, 0, 0.12); - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active, .quick-settings-system-item .message .message-header .message-expand-button:active, .message .message-header .quick-settings-system-item .message-expand-button:active, -.quick-settings-system-item .message .message-header .message-close-button:active, -.message .message-header .quick-settings-system-item .message-close-button:active { - color: #242424; - background-color: rgba(0, 0, 0, 0.2); - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon, .quick-settings-system-item .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings-system-item .message-expand-button > StIcon, -.quick-settings-system-item .message .message-header .message-close-button > StIcon, -.message .message-header .quick-settings-system-item .message-close-button > StIcon { - -st-icon-style: symbolic; - icon-size: 16px; -} - -.quick-settings-system-item .power-item { - min-height: 0; - min-width: 0; -} - -.quick-settings-system-item .power-item:insensitive { - color: #242424; - background-color: #e6e6e6; - border: none; - text-shadow: none; - icon-shadow: none; - background-color: transparent; -} - -.nm-network-item .wireless-secure-icon { - icon-size: 8px; -} - -.bt-device-item .popup-menu-icon { - -st-icon-style: symbolic; -} - -.bt-menu-placeholder.popup-menu-item { - text-align: center; - padding: 2em 4em; -} - -.device-subtitle { - color: rgba(36, 36, 36, 0.5); -} - -.keyboard-brightness-level { - spacing: 4px; -} - -.background-apps-quick-toggle { - min-height: 40px; - background-color: transparent; -} - -.background-apps-quick-toggle StIcon { - icon-size: 16px !important; -} - -.background-app-item .popup-menu-icon { - icon-size: 32px !important; - -st-icon-style: regular !important; -} - -.background-app-item .close-button { - padding: 4px; -} - -.background-app-item.popup-inactive-menu-item { - color: #242424; -} - -#unlockDialogNotifications StButton#vhandle, #unlockDialogNotifications StButton#hhandle { - background-color: rgba(245, 245, 245, 0.3); -} - -#unlockDialogNotifications StButton#vhandle:hover, #unlockDialogNotifications StButton#vhandle:focus, #unlockDialogNotifications StButton#hhandle:hover, #unlockDialogNotifications StButton#hhandle:focus { - background-color: rgba(245, 245, 245, 0.5); -} - -#unlockDialogNotifications StButton#vhandle:active, #unlockDialogNotifications StButton#hhandle:active { - background-color: st-transparentize(-st-accent-color, 0.5); -} - -.icon-label-button-container { - spacing: 4px; - font-size: 9pt; - font-weight: 400; -} - -.icon-label-button-container StIcon { - icon-size: 32px; -} - -.screenshot-ui-panel { - border-radius: 28px; - padding: 12px; - margin-bottom: 4em; - spacing: 12px; - color: #d3d7df; - background-color: #2a2a2a; - border: 1px solid rgba(0, 0, 0, 0.75); - box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.25); -} - -.screenshot-ui-close-button { - padding: 4px !important; -} - -.screenshot-ui-close-button.left { - margin-left: 6px; -} - -.screenshot-ui-close-button.right { - margin-right: 6px; -} - -.screenshot-ui-type-button { - min-width: 48px; - padding: 12px 16px !important; - border-radius: 16px; -} - -.screenshot-ui-capture-button { - width: 36px; - height: 36px; - border-radius: 9999px; - border: 4px white; - padding: 4px; -} - -.screenshot-ui-capture-button .screenshot-ui-capture-button-circle { - background-color: white; - transition-duration: 200ms; - border-radius: 9999px; -} - -.screenshot-ui-capture-button .screenshot-ui-capture-button-circle:hover, .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:focus { - background-color: rgba(0, 0, 0, 0.12); -} - -.screenshot-ui-capture-button:hover .screenshot-ui-capture-button-circle, .screenshot-ui-capture-button:focus .screenshot-ui-capture-button-circle { - background-color: #d9d9d9; -} - -.screenshot-ui-capture-button:active .screenshot-ui-capture-button-circle { - background-color: gray; -} - -.screenshot-ui-capture-button:cast .screenshot-ui-capture-button-circle { - background-color: #ED5F5D; -} - -.screenshot-ui-capture-button:cast:hover .screenshot-ui-capture-button-circle, .screenshot-ui-capture-button:cast:focus .screenshot-ui-capture-button-circle { - background-color: #f07674; -} - -.screenshot-ui-capture-button:cast:active .screenshot-ui-capture-button-circle { - background-color: #e93f3d; -} - -.screenshot-ui-shot-cast-container { - background-color: rgba(255, 255, 255, 0.06); - border-radius: 6px; - padding: 2px; - spacing: 2px; -} - -.screenshot-ui-shot-cast-container:ltr { - margin-left: 0px; -} - -.screenshot-ui-shot-cast-container:rtl { - margin-right: 0px; -} - -.screenshot-ui-shot-cast-button { - padding: 4px 8px; - background-color: transparent; - border-radius: 4px; -} - -.screenshot-ui-shot-cast-button:hover, .screenshot-ui-shot-cast-button:focus { - background-color: rgba(255, 255, 255, 0.1); -} - -.screenshot-ui-shot-cast-button:active { - background-color: rgba(255, 255, 255, 0.2); -} - -.screenshot-ui-shot-cast-button:checked { - background-color: white; - color: black; -} - -.screenshot-ui-shot-cast-button StIcon { - icon-size: 16px; -} - -.screenshot-ui-show-pointer-button { - border-radius: 9999px; - padding: 15px !important; -} - -.screenshot-ui-show-pointer-button StIcon { - icon-size: 16px; -} - -.screenshot-ui-area-indicator-shade { - background-color: rgba(0, 0, 0, 0.3); -} - -.screenshot-ui-area-selector .screenshot-ui-area-indicator-shade { - background-color: rgba(0, 0, 0, 0.5); -} - -.screenshot-ui-area-selector .screenshot-ui-area-indicator-selection { - border: 2px white; -} - -.screenshot-ui-area-selector-handle { - border-radius: 9999px; - background-color: white; - box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.2); - width: 24px; - height: 24px; -} - -.screenshot-ui-window-selector { - background-color: #2a2a2a; -} - -.screenshot-ui-window-selector .screenshot-ui-window-selector-window-container { - margin: 100px; -} - -.screenshot-ui-window-selector:primary-monitor .screenshot-ui-window-selector-window-container { - margin-bottom: 200px; -} - -.screenshot-ui-window-selector-window-border { - transition-duration: 200ms; - border-radius: 6px; - border: 6px transparent; -} - -.screenshot-ui-window-selector-check { - transition-duration: 200ms; - color: transparent; - border-radius: 9999px; - border-width: 12px; - icon-size: 24px; -} - -.screenshot-ui-window-selector-window:hover .screenshot-ui-window-selector-window-border { - border-color: st-darken(-st-accent-color, 15%); -} - -.screenshot-ui-window-selector-window:checked .screenshot-ui-window-selector-window-border { - border-color: -st-accent-color; - background-color: st-transparentize(-st-accent-color, 0.8); -} - -.screenshot-ui-window-selector-window:checked .screenshot-ui-window-selector-check { - color: white; - background-color: -st-accent-color; -} - -.screenshot-ui-screen-selector { - transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.5); -} - -.screenshot-ui-screen-selector:hover { - background-color: rgba(0, 0, 0, 0.3); -} - -.screenshot-ui-screen-selector:active { - background-color: rgba(0, 0, 0, 0.7); -} - -.screenshot-ui-screen-selector:checked { - background-color: transparent; - border: 2px white; -} - -.screenshot-ui-tooltip { - color: #d3d7df; - background-color: #2a2a2a; - border-radius: 9999px; - padding: 4px 8px; - text-align: center; - -y-offset: 24px; -} - -.search-entry { - margin-top: 16px; - margin-bottom: 4px; -} - -/* Slider */ -.slider { - height: 22px; - color: white; - border-radius: 16px; - -slider-handle-radius: 11px; - -barlevel-height: 22px; - -barlevel-background-color: rgba(0, 0, 0, 0.06); - -barlevel-active-background-color: rgba(0, 0, 0, 0.15); - -barlevel-overdrive-color: #ED5F5D; - -barlevel-overdrive-separator-width: 1px; -} - -.slider:hover { - color: white; -} - -/* Switches */ -.toggle-switch { - width: 40px; - height: 24px; - background-gradient-direction: vertical; - background-gradient-start: rgba(36, 36, 36, 0.25); - background-gradient-end: rgba(36, 36, 36, 0.35); - background: rgba(36, 36, 36, 0.25); -} - -.toggle-switch:hover { - background-gradient-start: rgba(36, 36, 36, 0.3); - background-gradient-end: rgba(36, 36, 36, 0.4); - background: rgba(36, 36, 36, 0.3); -} - -.toggle-switch StIcon { - icon-size: 0; -} - -.toggle-switch .handle { - margin: 1px; - width: 22px; - height: 22px; - background: white; - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); - transition-duration: 100ms; -} - -.toggle-switch:checked { - background: -st-accent-color; - color: -st-accent-color; - background-gradient-start: -st-accent-color; - background-gradient-end: st-lighten(-st-accent-color, 10%); -} - -.toggle-switch:checked:hover { - background: -st-accent-color; - color: -st-accent-color; - background-gradient-start: -st-accent-color; - background-gradient-end: st-lighten(-st-accent-color, 10%); -} - -.toggle-switch:checked .handle { - background: white; -} - -.window-picker { - spacing: 4px; -} - -.window-caption { - color: rgba(255, 255, 255, 0.85); - background-color: rgba(0, 0, 0, 0.75); - border-radius: 9999px; - padding: 4px 8px; -} - -.window-close, .screenshot-ui-close-button { - background-color: #ed5f5d; - color: white; - border-radius: 9999px; - padding: 3px; - height: 30px; - width: 30px; - box-shadow: -1px 1px 5px 0px rgba(0, 0, 0, 0.5); - transition-duration: 300ms; - background-image: url("assets/window-close-symbolic.svg"); -} - -.window-close StIcon, .screenshot-ui-close-button StIcon { - color: white; - icon-size: 1px; -} - -.window-close:hover, .screenshot-ui-close-button:hover { - color: white; - background-color: #f07a79; -} - -.window-close:active, .screenshot-ui-close-button:active { - color: white; - background-color: #ea4441; -} - -.workspace-background { - border-radius: 30px; - background-color: #2a2a2a; - box-shadow: 0 4px 16px 4px rgba(0, 0, 0, 0.3); -} - -/* Workspace pager */ -.workspace-thumbnails { - visible-width: 32px; - spacing: 4px; - padding: 4px; -} - -.workspace-thumbnails .workspace-thumbnail { - color: rgba(255, 255, 255, 0.85); - background-color: rgba(255, 255, 255, 0.12); - border: none; - border-radius: 6px; -} - -.workspace-thumbnails .placeholder { - background-image: url("assets/dash-placeholder.svg"); - background-size: contain; - width: 18px; - height: 24px; -} - -.workspace-thumbnail-indicator { - border: 3px solid -st-accent-color; - border-radius: 9px; - padding: 0px; -} - -.bottom #dashtodockDashScrollview, -.top #dashtodockDashScrollview { - -st-hfade-offset: 24px; -} - -.left #dashtodockDashScrollview, -.right #dashtodockDashScrollview { - -st-vfade-offset: 24px; -} - -#dashtodockContainer { - background-color: transparent; - box-shadow: none; -} - -#dashtodockContainer .number-overlay { - color: white; - background-color: rgba(0, 0, 0, 0.75); - text-align: center; -} - -#dashtodockContainer .notification-badge { - color: white; - background-color: -st-accent-color; - box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.25); - border-radius: 9999px; - margin: 2px 3px 5px; - padding: 0.2em 0.6em; - font-weight: bold; - text-align: center; -} - -#dashtodockContainer.top.straight-corner #dash, #dashtodockContainer.top.shrink.straight-corner #dash, #dashtodockContainer.top.extended #dash { - margin: 0 !important; - padding: 0 !important; -} - -#dashtodockContainer.top.straight-corner #dash .dash-background, #dashtodockContainer.top.shrink.straight-corner #dash .dash-background, #dashtodockContainer.top.extended #dash .dash-background { - border-radius: 0; - border-width: 0; - border-bottom-width: 1px; - margin: 0 !important; - box-shadow: inset 0 -1px rgba(255, 255, 255, 0.05); -} - -#dashtodockContainer.bottom.straight-corner #dash, #dashtodockContainer.bottom.shrink.straight-corner #dash, #dashtodockContainer.bottom.extended #dash { - margin: 0 !important; - padding: 0 !important; -} - -#dashtodockContainer.bottom.straight-corner #dash .dash-background, #dashtodockContainer.bottom.shrink.straight-corner #dash .dash-background, #dashtodockContainer.bottom.extended #dash .dash-background { - border-radius: 0; - border-width: 0; - border-top-width: 1px; - margin: 0 !important; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.05); -} - -#dashtodockContainer.left.straight-corner #dash, #dashtodockContainer.left.shrink.straight-corner #dash, #dashtodockContainer.left.extended #dash { - margin: 0 !important; - padding: 0 !important; -} - -#dashtodockContainer.left.straight-corner #dash .dash-background, #dashtodockContainer.left.shrink.straight-corner #dash .dash-background, #dashtodockContainer.left.extended #dash .dash-background { - border-radius: 0; - border-width: 0; - border-right-width: 1px; - margin: 0 !important; - box-shadow: inset -1px 0 rgba(255, 255, 255, 0.05); -} - -#dashtodockContainer.right.straight-corner #dash, #dashtodockContainer.right.shrink.straight-corner #dash, #dashtodockContainer.right.extended #dash { - margin: 0 !important; - padding: 0 !important; -} - -#dashtodockContainer.right.straight-corner #dash .dash-background, #dashtodockContainer.right.shrink.straight-corner #dash .dash-background, #dashtodockContainer.right.extended #dash .dash-background { - border-radius: 0; - border-width: 0; - border-left-width: 1px; - margin: 0 !important; - box-shadow: inset 1px 0 rgba(255, 255, 255, 0.05); -} - -#dashtodockContainer.left #dash, #dashtodockContainer.right #dash { - margin-top: 0 !important; - padding: 8px !important; -} - -#dashtodockContainer.left #dash #dashtodockDashContainer, #dashtodockContainer.right #dash #dashtodockDashContainer { - padding: 8px 0 !important; -} - -#dashtodockContainer.left #dash .dash-background, #dashtodockContainer.right #dash .dash-background { - margin-bottom: 0 !important; - padding: 8px !important; -} - -#dashtodockContainer.left #dash .overview-tile, #dashtodockContainer.left #dash .show-apps, #dashtodockContainer.right #dash .overview-tile, #dashtodockContainer.right #dash .show-apps { - padding: 1.5px 4px !important; -} - -#dashtodockContainer.left.extended #dash #dashtodockDashContainer, #dashtodockContainer.right.extended #dash #dashtodockDashContainer { - padding: 0 !important; -} - -#dashtodockContainer.left.extended #dash #dashtodockDashContainer #dashtodockDashScrollview:first-child, #dashtodockContainer.right.extended #dash #dashtodockDashContainer #dashtodockDashScrollview:first-child { - padding-top: 0 !important; -} - -#dashtodockContainer.left.extended #dash #dashtodockDashContainer #dashtodockDashScrollview:last-child, #dashtodockContainer.right.extended #dash #dashtodockDashContainer #dashtodockDashScrollview:last-child { - padding-bottom: 0 !important; -} - -#dashtodockContainer.left.extended #dash #dashtodockDashContainer > :first-child .show-apps, #dashtodockContainer.right.extended #dash #dashtodockDashContainer > :first-child .show-apps { - padding-bottom: 6px !important; -} - -#dashtodockContainer.left.extended #dash #dashtodockDashContainer > :last-child .show-apps, #dashtodockContainer.right.extended #dash #dashtodockDashContainer > :last-child .show-apps { - padding-bottom: 14px !important; -} - -#dashtodockContainer.top.extended #dash .overview-tile, #dashtodockContainer.top.extended #dash .show-apps, #dashtodockContainer.bottom.extended #dash .overview-tile, #dashtodockContainer.bottom.extended #dash .show-apps { - padding: 4px 1.5px !important; -} - -#dashtodockContainer.top.extended #dash #dashtodockDashContainer, #dashtodockContainer.bottom.extended #dash #dashtodockDashContainer { - padding: 0 !important; -} - -#dashtodockContainer.top.extended #dash #dashtodockDashContainer #dashtodockDashScrollview:first-child, #dashtodockContainer.bottom.extended #dash #dashtodockDashContainer #dashtodockDashScrollview:first-child { - padding-left: 0 !important; -} - -#dashtodockContainer.top.extended #dash #dashtodockDashContainer #dashtodockDashScrollview:last-child, #dashtodockContainer.bottom.extended #dash #dashtodockDashContainer #dashtodockDashScrollview:last-child { - padding-right: 0 !important; -} - -#dashtodockContainer.top.extended #dash #dashtodockDashContainer > :first-child .show-apps, #dashtodockContainer.bottom.extended #dash #dashtodockDashContainer > :first-child .show-apps { - padding-left: 6px !important; -} - -#dashtodockContainer.top.extended #dash #dashtodockDashContainer > :last-child .show-apps, #dashtodockContainer.bottom.extended #dash #dashtodockDashContainer > :last-child .show-apps { - padding-right: 14px !important; -} - -#dashtodockContainer #dash { - background: none; - box-shadow: none; -} - -#dashtodockContainer #dash .app-grid-running-dot { - background-color: rgba(0, 0, 0, 0.75); - margin: 0 !important; - offset-y: 0 !important; -} - -#dashtodockContainer #dash StWidget.focused .app-grid-running-dot { - background-color: -st-accent-color; -} - -#dashtodockContainer #dash .show-apps { - margin: 0; -} - -#dashtodockContainer #dash .show-apps:hover .overview-icon, #dashtodockContainer #dash .show-apps:focus .overview-icon, -#dashtodockContainer #dash .overview-tile:hover .overview-icon, -#dashtodockContainer #dash .overview-tile:focus .overview-icon { - background-color: rgba(255, 255, 255, 0.25); -} - -#dashtodockContainer #dash .show-apps:active .overview-icon, #dashtodockContainer #dash .show-apps:highlighted .overview-icon, #dashtodockContainer #dash .show-apps:selected .overview-icon, #dashtodockContainer #dash .show-apps:checked .overview-icon, -#dashtodockContainer #dash .overview-tile:active .overview-icon, -#dashtodockContainer #dash .overview-tile:highlighted .overview-icon, -#dashtodockContainer #dash .overview-tile:selected .overview-icon, -#dashtodockContainer #dash .overview-tile:checked .overview-icon { - background-color: rgba(255, 255, 255, 0.35); -} - -#dashtodockContainer #dash .dash-background { - background-color: rgba(209, 209, 209, 0.48); - border: 1px solid rgba(0, 0, 0, 0.08); - box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05); -} - -#dashtodockContainer #dash .dash-separator { - background-color: rgba(0, 0, 0, 0.12); -} - -#dashtodockContainer:overview #dash { - background: none; -} - -#dashtodockContainer:overview #dash .show-apps, -#dashtodockContainer:overview #dash .overview-tile { - color: white; -} - -#dashtodockContainer:overview #dash .show-apps:hover .overview-icon, #dashtodockContainer:overview #dash .show-apps:focus .overview-icon, #dashtodockContainer:overview #dash .show-apps:selected .overview-icon, -#dashtodockContainer:overview #dash .overview-tile:hover .overview-icon, -#dashtodockContainer:overview #dash .overview-tile:focus .overview-icon, -#dashtodockContainer:overview #dash .overview-tile:selected .overview-icon { - background-color: rgba(255, 255, 255, 0.12); -} - -#dashtodockContainer:overview #dash .show-apps:active .overview-icon, #dashtodockContainer:overview #dash .show-apps:checked .overview-icon, -#dashtodockContainer:overview #dash .overview-tile:active .overview-icon, -#dashtodockContainer:overview #dash .overview-tile:checked .overview-icon { - background-color: rgba(255, 255, 255, 0.2); -} - -#dashtodockContainer:overview #dash .dash-background { - background-color: rgba(255, 255, 255, 0.12); - border: 1px solid rgba(0, 0, 0, 0.08); - box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05); -} - -#dashtodockContainer:overview #dash .app-grid-running-dot { - background-color: rgba(255, 255, 255, 0.85); -} - -#dashtodockContainer:overview #dash StWidget.focused .app-grid-running-dot { - background-color: -st-accent-color; -} - -#dashtodockContainer.opaque:overview #dash, #dashtodockContainer.transparent:overview #dash { - background-color: transparent; - box-shadow: none; -} - -#dashtodockContainer.opaque:overview .dash-background, #dashtodockContainer.transparent:overview .dash-background { - background-color: transparent; -} - -#dashtodockContainer.opaque.extended:overview #dash, #dashtodockContainer.transparent.extended:overview #dash { - background: none; -} - -#dashtodockContainer.opaque.extended:overview .dash-background, #dashtodockContainer.transparent.extended:overview .dash-background { - background-color: transparent !important; - border: none !important; - box-shadow: none !important; -} - -#dashtodockContainer.running-dots .dash-item-container > StButton, #dashtodockContainer.dashtodock .dash-item-container > StButton { - transition-duration: 250ms; - background-size: contain; -} - -#dashtodockContainer.extended .overview-tile .overview-icon, -#dashtodockContainer.extended .show-apps .overview-icon, #dashtodockContainer.extended:overview .overview-tile .overview-icon, -#dashtodockContainer.extended:overview .show-apps .overview-icon { - border-radius: 6px; -} - -#dashtodockContainer .metro .overview-tile { - border-radius: 0; -} - -.dashtodock-app-well-preview-menu-item { - padding: 1em 1em 0.5em 1em; -} - -#dashtodockPreviewSeparator.popup-separator-menu-item-horizontal { - width: 1px; - height: auto; - border-right-width: 1px; - margin: 32px 0; -} - -#preview-menu { - margin: 0 6px 6px !important; - padding-bottom: 8px !important; -} - -#preview-menu, #preview-menu:hover, #preview-menu:selected { - border-radius: 12px !important; -} - -.openweather-button, .openweather-button-action, .openweather-menu-button-container, .openweather-button-box { - border: 1px solid transparent !important; -} - -.openweather-provider { - padding: 0 16px; - font-weight: 500; - color: #242424; - background-color: transparent; - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; - border: 1px solid transparent !important; -} - -.openweather-provider:hover { - color: #242424; - background-color: rgba(0, 0, 0, 0.12); - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.openweather-provider:focus { - color: #242424; - text-shadow: none; - icon-shadow: none; -} - -.openweather-provider:focus, .openweather-provider:focus:hover, .openweather-provider:focus:active { - box-shadow: none !important; -} - -.openweather-provider:active { - color: #242424; - background-color: rgba(0, 0, 0, 0.2); - border-color: transparent; - box-shadow: none; - text-shadow: none; - icon-shadow: none; -} - -.openweather-current-icon, .openweather-current-summary, .openweather-current-summarybox { - background: none; - color: #242424; -} - -.openweather-current-databox-values { - background: none; - color: #565656; -} - -.openweather-current-databox-captions { - background: none; - color: #565656; -} - -.openweather-forecast-icon, .openweather-forecast-summary { - background: none; - color: #424242; -} - -.openweather-forecast-day, .openweather-forecast-temperature { - background: none; - color: #565656; -} - -.openweather-sunrise-icon, .openweather-sunset-icon, .openweather-build-icon { - color: #424242; -} - -.gsconnect-device-menu { - background-color: rgba(0, 0, 0, 0.05); - border-radius: 6px; - margin: 0 3px; - padding: 6px 0; - box-shadow: none; -} - -.gsconnect-device-menu .popup-menu-item { - margin: 0 3px !important; - height: 16px !important; - border-radius: 6px !important; -} - -.gsconnect-device-menu .popup-menu-item:hover { - color: #242424 !important; - background-color: rgba(36, 36, 36, 0.1) !important; -} - -.gsconnect-device-menu .popup-menu-item > :first-child:ltr { - padding-left: 0 !important; - margin-left: 0 !important; -} - -.gsconnect-device-menu .popup-menu-item > :first-child:rtl { - padding-right: 0 !important; - margin-right: 0 !important; -} - -.cosmic-solid-bg { - background-color: #222222; -} - -.cosmic-dock #dock { - background-color: transparent; -} - -.cosmic-dock #dock .dash-background { - background-color: rgba(209, 209, 209, 0.48); - border: 1px solid rgba(0, 0, 0, 0.08); - box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05); -} - -.cosmic-dock.extended #dash { - margin-left: 0; - margin-right: 0; - margin-top: 0; - margin-bottom: 0; - padding: 0 0; -} - -.cosmic-dock.extended #dash .dash-background { - border-radius: 0; - margin-left: 0; - margin-right: 0; - margin-top: 0; - margin-bottom: 0; -} - -.place-menu-item:ltr { - padding-left: 0 !important; - padding-right: 20px !important; -} - -.place-menu-item:rtl { - padding-right: 0 !important; - padding-left: 20px !important; -} - -.place-menu-item StLabel { - margin-left: 2px; -} - -.place-menu-item .button { - border-radius: 9999px; - padding: 2px; -} - -.place-menu-item .button:ltr { - margin-left: 0 !important; -} - -.place-menu-item .button:rtl { - margin-right: 0 !important; -} diff --git a/src/sass/gtk/_common-4.0.scss b/src/sass/gtk/_common-4.0.scss index 15a2ddfb..04ea9bbd 100644 --- a/src/sass/gtk/_common-4.0.scss +++ b/src/sass/gtk/_common-4.0.scss @@ -2329,6 +2329,76 @@ headerbar { } separator.titlebutton { @extend %header_separator; } + + // Titlebuttons + windowcontrols { + border-spacing: 6px; + padding: 0 10px; + + &:not(.empty) { + &.start:dir(ltr), + &.end:dir(rtl) { + margin-right: $container_padding + 2px; + } + + &.start:dir(rtl), + &.end:dir(ltr) { + margin-left: $container_padding + 2px; + } + } + + headerbar.titlebar & { + border-spacing: $container_padding; + } + + button { + > image { + padding: 0; + margin: 0; + background-color: transparent; + background-image: none; + } + + &.close, &.maximize, &.minimize { + min-width: 16px; + min-height: 16px; + margin: 8px 0; + padding: ($menuitem_size - 20px) / 2 0; + background-position: center; + background-repeat: no-repeat; + background-size: 16px 16px; + + &, &:hover, &:focus, &:active, &:backdrop { + @include button(undecorated); + color: transparent; + } + + &:backdrop { opacity: 1; } + } + + // Load png assets for each button, Fix the Chrome window restore button bug + @each $k in ('close', 'maximize', 'minimize') { + @each $l, $m in ('',''), (':backdrop','-backdrop'), (':backdrop:hover','-backdrop-hover'), (':hover','-hover'), (':active','-active') { + &.#{$k}#{$l} { + background-image: -gtk-scaled(url('windows-assets/titlebutton-#{$k}#{$m}#{$asset_suffix}.png'), + url('windows-assets/titlebutton-#{$k}#{$m}#{$asset_suffix}@2.png')); + } + } + } + } + } + + .fullscreen & windowcontrols, + .maximized & windowcontrols { + button { + @each $l, $m in ('',''), (':backdrop','-backdrop'), (':backdrop:hover','-backdrop-hover'), (':hover','-hover'), (':active','-active') { + &.maximize#{$l} { + background-image: -gtk-scaled(url('windows-assets/titlebutton-restore#{$m}#{$asset_suffix}.png'), + url('windows-assets/titlebutton-restore#{$m}#{$asset_suffix}@2.png')); + } + } + } + } } .titlebar { @@ -5474,6 +5544,29 @@ window { box-shadow: none; transition: none; } + + &.ssd-frame { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + outline: none; + + @if $variant == 'dark' { + headerbar { + border-top-left-radius: $wm_radius; + border-top-right-radius: $wm_radius; + box-shadow: inset 0 1px $highlight_color; + } + + &.maximized, + &.fullscreen { + headerbar { + border-top-left-radius: 0; + border-top-right-radius: 0; + box-shadow: none; + } + } + } + } } &.solid-csd { @@ -5483,78 +5576,11 @@ window { background-color: $header_bg; box-shadow: none; } -} -// -// Titlebuttons -// - -windowcontrols { - border-spacing: 6px; - padding: 0 10px; - - &:not(.empty) { - &.start:dir(ltr), - &.end:dir(rtl) { - margin-right: $container_padding + 2px; - } - - &.start:dir(rtl), - &.end:dir(ltr) { - margin-left: $container_padding + 2px; - } - } - - headerbar.titlebar & { - border-spacing: $container_padding; - } - - button { - > image { - padding: 0; - margin: 0; - background-color: transparent; - background-image: none; - } - - &.close, &.maximize, &.minimize { - min-width: 16px; - min-height: 16px; - margin: 8px 0; - padding: ($menuitem_size - 20px) / 2 0; - background-position: center; - background-repeat: no-repeat; - background-size: 16px 16px; - - &, &:hover, &:focus, &:active, &:backdrop { - @include button(undecorated); - color: transparent; - } - - &:backdrop { opacity: 1; } - } - - // Load png assets for each button, Fix the Chrome window restore button bug - @each $k in ('close', 'maximize', 'minimize') { - @each $l, $m in ('',''), (':backdrop','-backdrop'), (':backdrop:hover','-backdrop-hover'), (':hover','-hover'), (':active','-active') { - &.#{$k}#{$l} { - background-image: -gtk-scaled(url('windows-assets/titlebutton-#{$k}#{$m}#{$asset_suffix}.png'), - url('windows-assets/titlebutton-#{$k}#{$m}#{$asset_suffix}@2.png')); - } - } - } - } - - .fullscreen &, - .maximized & { - button { - @each $l, $m in ('',''), (':backdrop','-backdrop'), (':backdrop:hover','-backdrop-hover'), (':hover','-hover'), (':active','-active') { - &.maximize#{$l} { - background-image: -gtk-scaled(url('windows-assets/titlebutton-restore#{$m}#{$asset_suffix}.png'), - url('windows-assets/titlebutton-restore#{$m}#{$asset_suffix}@2.png')); - } - } - } + // server-side decorations as used by mutter + &.ssd { + // just doing borders, wm draws actual shadows + box-shadow: 0 0 0 1px rgba(black, if($variant == 'light', 0.15, 0.75)); } }