From 37799d67d2010cab894e5d81a6218702cbcaaa5c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Daniel=20Ruiz=20de=20Alegr=C3=ADa?= Date: Wed, 7 Jun 2023 12:33:29 +0200 Subject: [PATCH] GNOME: Update for gnome-shell 44.2 --- .../Kali-Dark/gnome-shell/gnome-shell.css | 511 ++++++++----- share/themes/Kali-Dark/gtk-3.0/gtk.css | 20 +- share/themes/Kali-Dark/gtk-4.0/gtk.css | 16 +- .../Kali-Light/gnome-shell/gnome-shell.css | 665 ++++++++++------- share/themes/Kali-Light/gtk-3.0/gtk-dark.css | 20 +- share/themes/Kali-Light/gtk-3.0/gtk.css | 74 +- share/themes/Kali-Light/gtk-4.0/gtk-dark.css | 16 +- share/themes/Kali-Light/gtk-4.0/gtk.css | 60 +- .../gnome-shell/gnome-shell.css | 511 ++++++++----- share/themes/Kali-Purple-Dark/gtk-3.0/gtk.css | 20 +- share/themes/Kali-Purple-Dark/gtk-4.0/gtk.css | 16 +- .../gnome-shell/gnome-shell.css | 687 +++++++++++------- .../Kali-Purple-Light/gtk-3.0/gtk-dark.css | 20 +- .../themes/Kali-Purple-Light/gtk-3.0/gtk.css | 74 +- .../Kali-Purple-Light/gtk-4.0/gtk-dark.css | 16 +- .../themes/Kali-Purple-Light/gtk-4.0/gtk.css | 60 +- src/themes/Kali/sass/common/_colors.scss | 65 +- .../Kali/sass/gnome-shell/_common-tweaks.scss | 1 + .../upstream/gnome-shell-sass/_colors.scss | 66 +- .../upstream/gnome-shell-sass/_common.scss | 126 +++- .../upstream/gnome-shell-sass/_drawing.scss | 96 +-- .../upstream/gnome-shell-sass/_palette.scss | 46 ++ .../gnome-shell-sass/widgets/_app-grid.scss | 24 +- .../gnome-shell-sass/widgets/_calendar.scss | 6 +- .../gnome-shell-sass/widgets/_dash.scss | 9 +- .../gnome-shell-sass/widgets/_entries.scss | 1 - .../gnome-shell-sass/widgets/_login-lock.scss | 8 +- .../widgets/_looking-glass.scss | 26 +- .../widgets/_message-list.scss | 18 +- .../gnome-shell-sass/widgets/_misc.scss | 2 +- .../gnome-shell-sass/widgets/_overview.scss | 2 +- .../gnome-shell-sass/widgets/_panel.scss | 24 +- .../widgets/_quick-settings.scss | 14 +- .../gnome-shell-sass/widgets/_screenshot.scss | 6 +- .../widgets/_search-entry.scss | 2 + .../widgets/_search-results.scss | 12 +- .../gnome-shell-sass/widgets/_slider.scss | 2 +- .../widgets/_switcher-popup.scss | 2 +- .../widgets/_window-picker.scss | 8 +- .../widgets/_workspace-thumbnails.scss | 2 +- .../Kali/sass/gnome-shell/upstream/sync.sh | 3 +- 41 files changed, 2038 insertions(+), 1319 deletions(-) create mode 100644 src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_palette.scss diff --git a/share/themes/Kali-Dark/gnome-shell/gnome-shell.css b/share/themes/Kali-Dark/gnome-shell/gnome-shell.css index a2fe8abe..2b15ce4f 100644 --- a/share/themes/Kali-Dark/gnome-shell/gnome-shell.css +++ b/share/themes/Kali-Dark/gnome-shell/gnome-shell.css @@ -23,120 +23,118 @@ stage { color: #eeeeec; } /* Common Stylings */ -.screenshot-ui-panel, .workspace-switcher, .switcher-list, .resize-popup, .osd-monitor-label, .osd-window { - color: white; - background-color: #303340; - border: 1px solid rgba(255, 255, 255, 0.1); - border-radius: 999px; - padding: 12px; } - .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon, .app-well-app .overview-icon, .grid-search-result .overview-icon, .dash-item-container .show-apps .overview-icon, .list-search-result, .search-provider-icon, .switcher-list .item-box { border-radius: 16px; padding: 6px; spacing: 6px; border: 2px solid transparent; transition-duration: 200ms; - text-align: center; } + text-align: center; + color: inherit; } -#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .login-dialog-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { +#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { border-radius: 8px; border-style: solid; border-width: 1px; font-weight: bold; - padding: 3px 24px; + padding: 3px 24px; } + +.app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { transition-duration: 100ms; color: #eeeeec; background-color: #35373f; } - #LookingGlassDialog .notebook-tab:focus, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus, .app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .login-dialog-button:focus, .icon-button:focus, .background-app-item .close-button:focus { + .app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .icon-button:focus, .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .close-button:focus { transition-duration: 100ms; color: #eeeeec; background-color: #343d52; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } - #LookingGlassDialog .notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:hover, .app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .login-dialog-button:focus:hover, .icon-button:focus:hover, .background-app-item .close-button:focus:hover { + .app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .icon-button:focus:hover, .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .close-button:focus:hover { background-color: #3a445a; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - #LookingGlassDialog .notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:active, .app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .login-dialog-button:focus:active, .icon-button:focus:active, .background-app-item .close-button:focus:active { + .app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .icon-button:focus:active, .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .close-button:focus:active { background-color: #404a61; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - #LookingGlassDialog .notebook-tab:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:hover, .app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .login-dialog-button:hover, .icon-button:hover, .background-app-item .close-button:hover { + .app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .icon-button:hover, .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .close-button:hover { transition-duration: 100ms; color: #eeeeec; background-color: #3c3e47; } - #LookingGlassDialog .notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .lg-toolbar-button:insensitive, .app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .login-dialog-button:insensitive, .icon-button:insensitive, .background-app-item .close-button:insensitive { + .app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .icon-button:insensitive, .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .close-button:insensitive { transition-duration: 100ms; color: rgba(238, 238, 236, 0.5); background-color: rgba(238, 238, 236, 0.05); } - #LookingGlassDialog .notebook-tab:selected, #LookingGlassDialog > #Toolbar .lg-toolbar-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .login-dialog-button:selected, .icon-button:selected, .background-app-item .close-button:selected, #LookingGlassDialog .notebook-tab:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:active, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .login-dialog-button:active, .icon-button:active, .background-app-item .close-button:active { + .app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .icon-button:selected, .login-dialog-button.cancel-button:selected, .login-dialog-button.switch-user-button:selected, .login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .close-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .icon-button:active, .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active, .background-app-item .close-button:active { + transition-duration: 100ms; + color: #eeeeec; + background-color: #434650; } + .app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .icon-button:checked, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .close-button:checked { transition-duration: 100ms; color: #eeeeec; background-color: #4a4d58; } - #LookingGlassDialog .notebook-tab:checked, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked, .app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .login-dialog-button:checked, .icon-button:checked, .background-app-item .close-button:checked { - transition-duration: 100ms; - color: #eeeeec; - background-color: #4a4d58; } - #LookingGlassDialog .notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:hover, .app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .login-dialog-button:checked:hover, .icon-button:checked:hover, .background-app-item .close-button:checked:hover { + .app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .icon-button:checked:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .close-button:checked:hover { background-color: #515460; } - #LookingGlassDialog .notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:active, .app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .login-dialog-button:checked:active, .icon-button:checked:active, .background-app-item .close-button:checked:active { + .app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .icon-button:checked:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .close-button:checked:active { background-color: #585b69; } - #LookingGlassDialog .flat.notebook-tab, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button, .app-folder-dialog .folder-name-container .flat.edit-folder-button, .flat.button, .flat.login-dialog-button, .flat.icon-button, .background-app-item .flat.close-button { + .app-folder-dialog .folder-name-container .flat.edit-folder-button, .flat.button, .flat.icon-button, .flat.login-dialog-button.cancel-button, .flat.login-dialog-button.switch-user-button, .flat.login-dialog-button.login-dialog-session-list-button, .background-app-item .flat.close-button { transition-duration: 100ms; color: #eeeeec; background-color: #35373f; background-color: transparent; } - #LookingGlassDialog .flat.notebook-tab:focus, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .flat.login-dialog-button:focus, .flat.icon-button:focus, .background-app-item .flat.close-button:focus { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .flat.icon-button:focus, .flat.login-dialog-button.cancel-button:focus, .flat.login-dialog-button.switch-user-button:focus, .flat.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .flat.close-button:focus { transition-duration: 100ms; color: #eeeeec; background-color: #343d52; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } - #LookingGlassDialog .flat.notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .flat.login-dialog-button:focus:hover, .flat.icon-button:focus:hover, .background-app-item .flat.close-button:focus:hover { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .flat.icon-button:focus:hover, .flat.login-dialog-button.cancel-button:focus:hover, .flat.login-dialog-button.switch-user-button:focus:hover, .flat.login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .flat.close-button:focus:hover { background-color: #3a445a; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - #LookingGlassDialog .flat.notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .flat.login-dialog-button:focus:active, .flat.icon-button:focus:active, .background-app-item .flat.close-button:focus:active { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .flat.icon-button:focus:active, .flat.login-dialog-button.cancel-button:focus:active, .flat.login-dialog-button.switch-user-button:focus:active, .flat.login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .flat.close-button:focus:active { background-color: #404a61; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - #LookingGlassDialog .flat.notebook-tab:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .flat.login-dialog-button:hover, .flat.icon-button:hover, .background-app-item .flat.close-button:hover { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .flat.icon-button:hover, .flat.login-dialog-button.cancel-button:hover, .flat.login-dialog-button.switch-user-button:hover, .flat.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .flat.close-button:hover { transition-duration: 100ms; color: #eeeeec; background-color: #3c3e47; } - #LookingGlassDialog .flat.notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:insensitive, .app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .flat.login-dialog-button:insensitive, .flat.icon-button:insensitive, .background-app-item .flat.close-button:insensitive { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .flat.icon-button:insensitive, .flat.login-dialog-button.cancel-button:insensitive, .flat.login-dialog-button.switch-user-button:insensitive, .flat.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .flat.close-button:insensitive { transition-duration: 100ms; color: rgba(238, 238, 236, 0.5); background-color: rgba(238, 238, 236, 0.05); } - #LookingGlassDialog .flat.notebook-tab:selected, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .flat.login-dialog-button:selected, .flat.icon-button:selected, .background-app-item .flat.close-button:selected, #LookingGlassDialog .flat.notebook-tab:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .flat.login-dialog-button:active, .flat.icon-button:active, .background-app-item .flat.close-button:active { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .flat.icon-button:selected, .flat.login-dialog-button.cancel-button:selected, .flat.login-dialog-button.switch-user-button:selected, .flat.login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .flat.close-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .flat.icon-button:active, .flat.login-dialog-button.cancel-button:active, .flat.login-dialog-button.switch-user-button:active, .flat.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .flat.close-button:active { + transition-duration: 100ms; + color: #eeeeec; + background-color: #434650; } + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .flat.icon-button:checked, .flat.login-dialog-button.cancel-button:checked, .flat.login-dialog-button.switch-user-button:checked, .flat.login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .flat.close-button:checked { transition-duration: 100ms; color: #eeeeec; background-color: #4a4d58; } - #LookingGlassDialog .flat.notebook-tab:checked, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .flat.login-dialog-button:checked, .flat.icon-button:checked, .background-app-item .flat.close-button:checked { - transition-duration: 100ms; - color: #eeeeec; - background-color: #4a4d58; } - #LookingGlassDialog .flat.notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .flat.login-dialog-button:checked:hover, .flat.icon-button:checked:hover, .background-app-item .flat.close-button:checked:hover { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .flat.icon-button:checked:hover, .flat.login-dialog-button.cancel-button:checked:hover, .flat.login-dialog-button.switch-user-button:checked:hover, .flat.login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .flat.close-button:checked:hover { background-color: #515460; } - #LookingGlassDialog .flat.notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .flat.login-dialog-button:checked:active, .flat.icon-button:checked:active, .background-app-item .flat.close-button:checked:active { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .flat.icon-button:checked:active, .flat.login-dialog-button.cancel-button:checked:active, .flat.login-dialog-button.switch-user-button:checked:active, .flat.login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .flat.close-button:checked:active { background-color: #585b69; } -.lg-dialog StEntry, StEntry { +.login-dialog-prompt-entry, .search-entry, .lg-dialog StEntry, StEntry { border-radius: 8px; padding: 9px 9px; - color: #eeeeec; selection-background-color: #2777ff; - selected-color: #ffffff; + selected-color: #ffffff; } + +StEntry { transition-duration: 100ms; - background-color: rgba(238, 238, 236, 0.1); + background-color: rgba(238, 238, 236, 0.15); color: rgba(238, 238, 236, 0.7); } StEntry:hover { transition-duration: 100ms; - background-color: rgba(238, 238, 236, 0.2); - color: inherit; } + background-color: rgba(238, 238, 236, 0.25); } StEntry:focus { transition-duration: 100ms; - background-color: rgba(174, 200, 242, 0.24); - box-shadow: inset 0 0 0 2px #2777ff; + background-color: rgba(184, 206, 241, 0.2875); + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); color: #eeeeec; } StEntry:insensitive { transition-duration: 100ms; - background-color: rgba(136, 138, 141, 0.2); - color: #888a8d; } + background-color: rgba(238, 238, 236, 0.25); + color: rgba(238, 238, 236, 0.5); } + StEntry StLabel.hint-text { + color: rgba(238, 238, 236, 0.7); } .modal-dialog .modal-dialog-linked-button, .hotplug-notification-item, .notification-banner .notification-button { padding: 12px; @@ -170,7 +168,7 @@ stage { .modal-dialog .modal-dialog-linked-button:active, .hotplug-notification-item:active, .notification-banner .notification-button:active { transition-duration: 100ms; color: #eeeeec; - background-color: #545866; } + background-color: #4d505e; } .modal-dialog .modal-dialog-linked-button:checked, .hotplug-notification-item:checked, .notification-banner .notification-button:checked { transition-duration: 100ms; color: #eeeeec; @@ -194,60 +192,9 @@ stage { margin-left: 0 !important; margin-right: 0 !important; } -.screenshot-ui-show-pointer-button, .screenshot-ui-type-button { - transition-duration: 100ms; - background-color: transparent; - background-color: none; - box-shadow: none; } - .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { - transition-duration: 100ms; - color: rgba(238, 238, 236, 0.5); - background-color: rgba(238, 238, 236, 0.05); - background-color: transparent; - color: rgba(255, 255, 255, 0.5); } - .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { - transition-duration: 100ms; - background-color: transparent; - background-color: none; - box-shadow: none; } - .screenshot-ui-show-pointer-button:insensitive:insensitive, .screenshot-ui-type-button:insensitive:insensitive { - transition-duration: 100ms; - color: rgba(238, 238, 236, 0.5); - background-color: rgba(238, 238, 236, 0.05); - background-color: transparent; - color: rgba(255, 255, 255, 0.5); } - .screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { - transition-duration: 100ms; - color: white; - background-color: #3f4b62; - box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } - .screenshot-ui-show-pointer-button:focus:hover, .screenshot-ui-type-button:focus:hover { - background-color: #45516a; - box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - .screenshot-ui-show-pointer-button:focus:active, .screenshot-ui-type-button:focus:active { - background-color: #4c5872; - box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover { - transition-duration: 100ms; - color: white; - background-color: #494d59; } - .screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active { - transition-duration: 100ms; - color: white; - background-color: #575c6a; } - .screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked { - transition-duration: 100ms; - color: white; - background-color: #575c6a; } - .screenshot-ui-show-pointer-button:outlined:hover, .screenshot-ui-type-button:outlined:hover, .screenshot-ui-show-pointer-button:checked:hover, .screenshot-ui-type-button:checked:hover { - background-color: #5d6373; } - .screenshot-ui-show-pointer-button:outlined:active, .screenshot-ui-type-button:outlined:active, .screenshot-ui-show-pointer-button:checked:active, .screenshot-ui-type-button:checked:active { - background-color: #646a7b; } - .dash-label, .window-caption { - background-color: #303340; + background-color: rgba(0, 0, 0, 0.9); color: white; - border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 99px; padding: 6px 12px; text-align: center; } @@ -265,7 +212,7 @@ stage { font-weight: 700; font-size: 15pt; } -.bt-menu-placeholder, .message-dialog-content .message-dialog-title.lightweight, .headline { +.bt-menu-placeholder.popup-menu-item, .message-dialog-content .message-dialog-title.lightweight, .headline { font-weight: 700; font-size: 13pt; } @@ -290,6 +237,148 @@ stage { .unlock-dialog-clock .unlock-dialog-clock-time, #panel, .weather-button .weather-forecast-time, .world-clocks-button .world-clocks-timezone, .world-clocks-button .world-clocks-time, .events-button .event-time, .calendar .calendar-day-base { font-feature-settings: "tnum"; } +/* OSD Elements */ +#LookingGlassDialog, .screenshot-ui-panel, .workspace-switcher, .switcher-list, .resize-popup, .osd-monitor-label, .osd-window { + color: white; + background-color: #303340; + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 999px; + padding: 12px; } + +.lg-dialog StEntry { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.7); } + .lg-dialog StEntry:hover { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); } + .lg-dialog StEntry:focus { + transition-duration: 100ms; + background-color: rgba(197, 218, 255, 0.2875); + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); + color: white; } + .lg-dialog StEntry:insensitive { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); + color: rgba(255, 255, 255, 0.5); } + .lg-dialog StEntry StLabel.hint-text { + color: rgba(255, 255, 255, 0.7); } + +#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button { + transition-duration: 100ms; + color: white; + background-color: #424651; } + #LookingGlassDialog .notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .lg-toolbar-button:insensitive, .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + color: rgba(255, 255, 255, 0.5); + background-color: rgba(255, 255, 255, 0.05); } + #LookingGlassDialog .notebook-tab:focus, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus, .screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { + transition-duration: 100ms; + color: white; + background-color: #3f4b62; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } + #LookingGlassDialog .notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:hover, .screenshot-ui-show-pointer-button:focus:hover, .screenshot-ui-type-button:focus:hover { + background-color: #45516a; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + #LookingGlassDialog .notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:active, .screenshot-ui-show-pointer-button:focus:active, .screenshot-ui-type-button:focus:active { + background-color: #4c5872; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + #LookingGlassDialog .notebook-tab:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:hover, .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover { + transition-duration: 100ms; + color: white; + background-color: #494d59; } + #LookingGlassDialog .notebook-tab:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:active, .screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active { + transition-duration: 100ms; + color: white; + background-color: #505562; } + #LookingGlassDialog .notebook-tab:outlined, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined, .screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, #LookingGlassDialog .notebook-tab:checked, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked { + transition-duration: 100ms; + color: white; + background-color: #575c6a; } + #LookingGlassDialog .notebook-tab:outlined:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:hover, .screenshot-ui-show-pointer-button:outlined:hover, .screenshot-ui-type-button:outlined:hover, #LookingGlassDialog .notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:hover, .screenshot-ui-show-pointer-button:checked:hover, .screenshot-ui-type-button:checked:hover { + background-color: #5d6373; } + #LookingGlassDialog .notebook-tab:outlined:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:active, .screenshot-ui-show-pointer-button:outlined:active, .screenshot-ui-type-button:outlined:active, #LookingGlassDialog .notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:active, .screenshot-ui-show-pointer-button:checked:active, .screenshot-ui-type-button:checked:active { + background-color: #646a7b; } + +.screenshot-ui-show-pointer-button, .screenshot-ui-type-button { + transition-duration: 100ms; + background-color: transparent; + background-color: none; + box-shadow: none; } + .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); + background-color: transparent; + color: rgba(255, 255, 255, 0.5); } + .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + background-color: transparent; + background-color: none; + box-shadow: none; } + .screenshot-ui-show-pointer-button:insensitive:insensitive, .screenshot-ui-type-button:insensitive:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); + background-color: transparent; + color: rgba(255, 255, 255, 0.5); } + +/* System Elements */ +.login-dialog-prompt-entry, .search-entry { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.7); } + .login-dialog-prompt-entry:hover, .search-entry:hover { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); } + .login-dialog-prompt-entry:focus, .search-entry:focus { + transition-duration: 100ms; + background-color: rgba(197, 218, 255, 0.2875); + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); + color: white; } + .login-dialog-prompt-entry:insensitive, .search-entry:insensitive { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); + color: rgba(255, 255, 255, 0.5); } + .login-dialog-prompt-entry StLabel.hint-text, .search-entry StLabel.hint-text { + color: rgba(255, 255, 255, 0.7); } + +.login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button { + transition-duration: 100ms; + color: white; + background-color: #444854; } + .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive { + transition-duration: 100ms; + color: rgba(255, 255, 255, 0.5); + background-color: rgba(255, 255, 255, 0.05); } + .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus { + transition-duration: 100ms; + color: white; + background-color: #414d65; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } + .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover { + background-color: #47536d; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active { + background-color: #4d5a74; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover { + transition-duration: 100ms; + color: white; + background-color: #4b4f5c; } + .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active { + transition-duration: 100ms; + color: white; + background-color: #525665; } + .login-dialog-button.cancel-button:outlined, .login-dialog-button.switch-user-button:outlined, .login-dialog-button.login-dialog-session-list-button:outlined, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked { + transition-duration: 100ms; + color: white; + background-color: #595e6d; } + .login-dialog-button.cancel-button:outlined:hover, .login-dialog-button.switch-user-button:outlined:hover, .login-dialog-button.login-dialog-session-list-button:outlined:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover { + background-color: #5f6576; } + .login-dialog-button.cancel-button:outlined:active, .login-dialog-button.switch-user-button:outlined:active, .login-dialog-button.login-dialog-session-list-button:outlined:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active { + background-color: #666c7e; } + /* WIDGETS */ .shell-link { color: #8db7ff; } @@ -313,11 +402,10 @@ StEntry StIcon.peek-password { padding: 0 4px; } StEntry StLabel.hint-text { - margin-left: 2px; - color: rgba(238, 238, 236, 0.7); } + margin-left: 2px; } /* Buttons */ -.button, .login-dialog-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { +.button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { min-height: 22px; } .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { @@ -441,7 +529,7 @@ StScrollBar { .popup-menu-item:active { transition-duration: 100ms; color: #eeeeec; - background-color: #545866; } + background-color: #4d505e; } .popup-menu-item:checked { transition-duration: 100ms; color: #eeeeec; @@ -492,7 +580,7 @@ StScrollBar { .popup-sub-menu .popup-menu-item:active { transition-duration: 100ms; color: #eeeeec; - background-color: #626778; } + background-color: #5b5f70; } .popup-sub-menu .popup-menu-item:checked { transition-duration: 100ms; color: #eeeeec; @@ -582,7 +670,7 @@ StScrollBar { .datemenu-today-button:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .datemenu-today-button:focus { transition-duration: 100ms; color: #eeeeec; @@ -594,6 +682,11 @@ StScrollBar { .datemenu-today-button:focus:active { background-color: #404a61; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .datemenu-today-button:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); + background-color: transparent; } /* Calendar */ .calendar { @@ -618,7 +711,7 @@ StScrollBar { .calendar:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .calendar:focus { transition-duration: 100ms; color: #eeeeec; @@ -630,6 +723,11 @@ StScrollBar { .calendar:focus:active { background-color: #404a61; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .calendar:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); + background-color: transparent; } .calendar .calendar-month-header .calendar-change-month-back StIcon, .calendar .calendar-month-header .calendar-change-month-forward StIcon { icon-size: 1.09em; } @@ -642,9 +740,9 @@ StScrollBar { margin: 2px; border-radius: 8px; } .calendar .calendar-month-header .pager-button:hover, .calendar .calendar-month-header .pager-button:focus { - background-color: #303340; } + background-color: #383d4b; } .calendar .calendar-month-header .pager-button:active { - background-color: #343845; } + background-color: #3d4251; } .calendar .calendar-day-base { text-align: center; margin: 2px; @@ -654,20 +752,20 @@ StScrollBar { border-radius: 99px; transition-duration: 100ms; } .calendar .calendar-day-base:hover { - background-color: #303340; } + background-color: #383d4b; } .calendar .calendar-day-base:focus { background-color: #243658; - color: #ffffff; + color: inherit; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); } .calendar .calendar-day-base:active, .calendar .calendar-day-base:selected { color: white; - background-color: #343845; } + background-color: #3d4251; } .calendar .calendar-day-base:active:focus, .calendar .calendar-day-base:selected:focus { - background-color: #31456b; } + background-color: #384c74; } .calendar .calendar-day-base.calendar-day-heading { color: #888a8d; padding-top: 6px; - height: 16px !important; + height: 1.1em !important; font-weight: 600; } .calendar .calendar-day { font-weight: 600; } @@ -718,7 +816,7 @@ StScrollBar { .events-button:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .events-button:focus { transition-duration: 100ms; color: #eeeeec; @@ -730,12 +828,16 @@ StScrollBar { .events-button:focus:active { background-color: #404a61; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .events-button:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .events-button .events-box { spacing: 6px; } .events-button .events-list { - spacing: 12px; } + spacing: 12px; + color: #eeeeec; } .events-button .events-title { - color: #888a8d; margin-bottom: 4px; } .events-button .event-time { color: #888a8d; } @@ -755,7 +857,7 @@ StScrollBar { .world-clocks-button:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .world-clocks-button:focus { transition-duration: 100ms; color: #eeeeec; @@ -767,6 +869,10 @@ StScrollBar { .world-clocks-button:focus:active { background-color: #404a61; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .world-clocks-button:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .world-clocks-button .world-clocks-grid { spacing-rows: 6px; spacing-columns: 12px; } @@ -798,7 +904,7 @@ StScrollBar { .weather-button:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .weather-button:focus { transition-duration: 100ms; color: #eeeeec; @@ -810,6 +916,10 @@ StScrollBar { .weather-button:focus:active { background-color: #404a61; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .weather-button:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .weather-button .weather-box { spacing: 10px; } .weather-button .weather-header-box { @@ -843,7 +953,7 @@ StScrollBar { padding-left: 6px; border-left-width: 1px; } .message-list .message-list-placeholder { - color: rgba(136, 138, 141, 0.5); } + color: #888a8d; } .message-list .message-list-placeholder > StIcon { icon-size: 3.27em; margin-bottom: 12px; @@ -886,7 +996,7 @@ StScrollBar { .message:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .message:focus { transition-duration: 100ms; color: #eeeeec; @@ -898,6 +1008,10 @@ StScrollBar { .message:focus:active { background-color: #404a61; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .message:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .message .message-icon-bin { padding: 18px; } .message .message-icon-bin:ltr { @@ -931,15 +1045,15 @@ StScrollBar { text-align: left; } .message .message-close-button { color: #eeeeec; - background-color: rgba(238, 238, 236, 0.1); + background-color: rgba(238, 238, 236, 0.2); border-radius: 99px; padding: 5px; margin: 1px; } .message .message-close-button:hover { - background-color: rgba(238, 238, 236, 0.2); } + background-color: rgba(238, 238, 236, 0.3); } .message .message-close-button:active { - background-color: rgba(238, 238, 236, 0.1); } - .message .message-close-button StIcon { + background-color: rgba(238, 238, 236, 0.2); } + .message .message-close-button > StIcon { icon-size: 1.09em; } .message .message-body { color: #d6d6d1; } @@ -954,10 +1068,10 @@ StScrollBar { border-radius: 8px; color: #eeeeec; } .message-media-control:hover { - background-color: #3b3f4e; + background-color: #43495a; color: #eeeeec; } .message-media-control:active { - background-color: #3f4454; + background-color: #484d60; color: #eeeeec; } .message-media-control:insensitive { color: #959799; } @@ -995,7 +1109,7 @@ StScrollBar { background-color: #2777ff; color: #ffffff; } .candidate-box:hover { - background-color: #303340; + background-color: #383d4b; color: white; } .candidate-page-button-box { @@ -1181,7 +1295,7 @@ StScrollBar { .audio-selection-device { border-radius: 16px; } .audio-selection-device:hover, .audio-selection-device:focus { - background-color: #303340; } + background-color: #383d4b; } .audio-selection-device:active { background-color: #2777ff; color: #ffffff; } @@ -1270,21 +1384,21 @@ StScrollBar { .switcher-list .item-box { background-color: transparent; } .switcher-list .item-box:hover { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(238, 238, 236, 0.1); } .switcher-list .item-box:selected, .switcher-list .item-box:focus { - background-color: rgba(255, 255, 255, 0.13); } + background-color: rgba(238, 238, 236, 0.13); } .switcher-list .item-box:selected:hover, .switcher-list .item-box:focus:hover { - background-color: rgba(255, 255, 255, 0.16); } + background-color: rgba(238, 238, 236, 0.16); } .switcher-list .item-box:selected:active, .switcher-list .item-box:focus:active { - background-color: rgba(255, 255, 255, 0.13); } + background-color: rgba(238, 238, 236, 0.13); } .switcher-list .item-box:active { - background-color: rgba(255, 255, 255, 0.16); } + background-color: rgba(238, 238, 236, 0.16); } .switcher-list .item-box:outlined, .switcher-list .item-box:checked { - background-color: rgba(255, 255, 255, 0.19); } + background-color: rgba(238, 238, 236, 0.19); } .switcher-list .item-box:outlined:active, .switcher-list .item-box:checked:active { - background-color: rgba(255, 255, 255, 0.22); } + background-color: rgba(238, 238, 236, 0.22); } .switcher-list .item-box:outlined:hover, .switcher-list .item-box:checked:hover { - background-color: rgba(255, 255, 255, 0.25); } + background-color: rgba(238, 238, 236, 0.25); } .switcher-list .item-box:drop { border: 2px solid rgba(39, 119, 255, 0.8); background-color: rgba(39, 119, 255, 0.2); } @@ -1368,7 +1482,7 @@ StScrollBar { transition-duration: 200ms; border-radius: 99px; } .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:hover, .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:focus { - background-color: #303340; } + background-color: #383d4b; } .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 { @@ -1397,7 +1511,7 @@ StScrollBar { .screenshot-ui-shot-cast-button:hover, .screenshot-ui-shot-cast-button:focus { background-color: #464b5d; } .screenshot-ui-shot-cast-button:active { - background-color: #3f4454; } + background-color: #484d60; } .screenshot-ui-shot-cast-button:checked { background-color: white; color: black; } @@ -1424,12 +1538,12 @@ StScrollBar { .screenshot-ui-area-selector-handle { border-radius: 99px; background-color: white; - box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.2); + box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.3); width: 24px; height: 24px; } .screenshot-ui-window-selector { - background-color: #272a34; } + background-color: #323643; } .screenshot-ui-window-selector .screenshot-ui-window-selector-window-container { margin: 100px; } .screenshot-ui-window-selector:primary-monitor .screenshot-ui-window-selector-window-container { @@ -1479,12 +1593,16 @@ StScrollBar { /* Top Bar */ #panel { - background-color: #000; + background-color: black; font-weight: bold; height: 2.2em; - transition-duration: 250ms; } + transition-duration: 250ms; + box-shadow: inset 0 -1px 0 0 black; } #panel.unlock-screen, #panel.login-screen, #panel:overview { - background-color: transparent; } + background-color: transparent; + box-shadow: none; } + #panel.unlock-screen .panel-button, #panel.login-screen .panel-button, #panel:overview .panel-button { + color: white !important; } #panel .panel-button { font-weight: bold; color: #e2e2df; @@ -1615,7 +1733,7 @@ StScrollBar { .quick-settings { padding: 18px; border-radius: 36px; } - .quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button, .quick-settings .login-dialog-button { + .quick-settings .icon-button, .quick-settings .login-dialog-button.cancel-button, .quick-settings .login-dialog-button.switch-user-button, .quick-settings .login-dialog-button.login-dialog-session-list-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button { padding: 10.5px; } .quick-settings-grid { @@ -1652,7 +1770,7 @@ StScrollBar { color: rgba(255, 255, 255, 0.5); } .quick-toggle > StBoxLayout { spacing: 9px; } - .quick-toggle.button, .quick-toggle.login-dialog-button, .quick-toggle.icon-button, .background-app-item .quick-toggle.close-button { + .quick-toggle.button, .quick-toggle.icon-button, .quick-toggle.login-dialog-button.cancel-button, .quick-toggle.login-dialog-button.switch-user-button, .quick-toggle.login-dialog-button.login-dialog-session-list-button, .background-app-item .quick-toggle.close-button { padding: 0; } .quick-toggle > StBoxLayout { padding: 0 12px; } @@ -1673,8 +1791,12 @@ StScrollBar { max-width: auto; } .quick-menu-toggle .quick-toggle:ltr { border-radius: 99px 0 0 99px; } + .quick-menu-toggle .quick-toggle:ltr > StBoxLayout { + padding-right: 9px; } .quick-menu-toggle .quick-toggle:rtl { border-radius: 0 99px 99px 0; } + .quick-menu-toggle .quick-toggle:rtr > StBoxLayout { + padding-left: 9px; } .quick-menu-toggle .quick-toggle:ltr:last-child { border-radius: 99px; } .quick-menu-toggle .quick-toggle:rtl:last-child { @@ -1737,6 +1859,8 @@ StScrollBar { transition-duration: 100ms; color: #eeeeec; background-color: #35373f; + background-color: #23252e !important; + color: #eeeeec !important; border-radius: 24px; padding: 12px; margin: 12px 18px 0; } @@ -1747,7 +1871,7 @@ StScrollBar { .quick-toggle-menu:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .quick-toggle-menu:focus { transition-duration: 100ms; color: #eeeeec; @@ -1759,6 +1883,10 @@ StScrollBar { .quick-toggle-menu:focus:active { background-color: #404a61; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .quick-toggle-menu:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .quick-toggle-menu .popup-menu-item > StIcon { -st-icon-style: symbolic; } .quick-toggle-menu .header { @@ -1771,7 +1899,8 @@ StScrollBar { padding: 9px; background-color: rgba(238, 238, 236, 0.2); } .quick-toggle-menu .header .icon.active { - background-color: #2777ff; } + background-color: #2777ff; + color: #ffffff; } .quick-settings-system-item > StBoxLayout { spacing: 12px; } @@ -1791,7 +1920,7 @@ StScrollBar { .bt-device-item .popup-menu-icon { -st-icon-style: symbolic; } -.bt-menu-placeholder { +.bt-menu-placeholder.popup-menu-item { text-align: center; padding: 2em 4em; } @@ -1829,7 +1958,7 @@ StScrollBar { spacing: 6px; } .window-close, .screenshot-ui-close-button { - background-color: rgba(63, 68, 84, 0.98); + background-color: rgba(65, 70, 87, 0.98); color: white; border-radius: 99px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3); @@ -1840,9 +1969,9 @@ StScrollBar { .window-close StIcon, .screenshot-ui-close-button StIcon { icon-size: 24px; } .window-close:hover, .screenshot-ui-close-button:hover { - background-color: rgba(78, 84, 104, 0.98); } + background-color: rgba(81, 87, 107, 0.98); } .window-close:active, .screenshot-ui-close-button:active { - background-color: rgba(91, 98, 122, 0.98); } + background-color: rgba(94, 101, 125, 0.98); } .workspace-background { border-radius: 30px; @@ -1873,10 +2002,9 @@ StScrollBar { background-color: transparent; } .search-section-content { - background-color: #323643; - border-radius: 24px; - box-shadow: inset 0 0 0 1px solid rgba(238, 238, 236, 0.07); + background-color: #3d3f48; color: white; + border-radius: 24px; padding: 12px; margin: 0 12px; } @@ -1903,6 +2031,9 @@ StScrollBar { border: 2px solid rgba(39, 119, 255, 0.8); background-color: rgba(39, 119, 255, 0.2); } +.search-statustext { + color: rgba(255, 255, 255, 0.8); } + .grid-search-results { spacing: 30px; margin: 0 12px; } @@ -1929,7 +2060,7 @@ StScrollBar { spacing: 12px; } .list-search-result .list-search-result-description { - color: #97999f; } + color: #989aa1; } /* Dash */ #dash { @@ -1945,7 +2076,7 @@ StScrollBar { margin-bottom: 14px; } .dash-background { - background-color: #323643; + background-color: #3d3f48; border-radius: 28px; padding: 12px; spacing: 6px; @@ -1969,7 +2100,7 @@ StScrollBar { .dash-item-container .show-apps .overview-icon { background-color: transparent; } .dash-item-container .show-apps:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .dash-item-container .show-apps:selected .overview-icon, .dash-item-container .show-apps:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .dash-item-container .show-apps:selected .overview-icon:hover .overview-icon, .dash-item-container .show-apps:focus .overview-icon:hover .overview-icon { @@ -1989,12 +2120,13 @@ StScrollBar { background-color: rgba(39, 119, 255, 0.2); } .dash-item-container .show-apps, .dash-item-container .app-well-app, .dash-item-container .grid-search-result { - padding-bottom: 12px; } + padding-bottom: 12px; + color: white; } .dash-separator { width: 1px; margin: 0 4px; - background-color: #0d0e11; + background-color: rgba(255, 255, 255, 0.1); margin-bottom: 12px; } .dash-label { @@ -2017,7 +2149,7 @@ StScrollBar { .app-well-app .overview-icon, .grid-search-result .overview-icon { background-color: transparent; } .app-well-app:hover .overview-icon, .grid-search-result:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app:selected .overview-icon, .grid-search-result:selected .overview-icon, .app-well-app:focus .overview-icon, .grid-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .app-well-app:selected .overview-icon:hover .overview-icon, .grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app:focus .overview-icon:hover .overview-icon, .grid-search-result:focus .overview-icon:hover .overview-icon { @@ -2037,30 +2169,31 @@ StScrollBar { background-color: rgba(39, 119, 255, 0.2); } .app-well-app .overview-icon, .grid-search-result .overview-icon { padding: 12px; - border-radius: 24px; } + border-radius: 24px; + color: white; } .app-well-app .overview-icon.overview-icon-with-label > StBoxLayout, .grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout { spacing: 6px; } .app-well-app.app-folder, .app-folder.grid-search-result { transition-duration: 400ms; } .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon { - background-color: rgba(238, 238, 236, 0.07); } + background-color: rgba(255, 255, 255, 0.07); } .app-well-app.app-folder:hover .overview-icon, .app-folder.grid-search-result:hover .overview-icon { - background-color: rgba(238, 238, 236, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon, .app-folder.grid-search-result:selected .overview-icon, .app-well-app.app-folder:focus .overview-icon, .app-folder.grid-search-result:focus .overview-icon { - background-color: rgba(238, 238, 236, 0.13); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon:hover .overview-icon, .app-folder.grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app.app-folder:focus .overview-icon:hover .overview-icon, .app-folder.grid-search-result:focus .overview-icon:hover .overview-icon { - background-color: rgba(238, 238, 236, 0.16); } + background-color: rgba(255, 255, 255, 0.16); } .app-well-app.app-folder:selected .overview-icon:active .overview-icon, .app-folder.grid-search-result:selected .overview-icon:active .overview-icon, .app-well-app.app-folder:focus .overview-icon:active .overview-icon, .app-folder.grid-search-result:focus .overview-icon:active .overview-icon { - background-color: rgba(238, 238, 236, 0.13); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:active .overview-icon, .app-folder.grid-search-result:active .overview-icon { - background-color: rgba(238, 238, 236, 0.16); } + background-color: rgba(255, 255, 255, 0.16); } .app-well-app.app-folder:outlined .overview-icon, .app-folder.grid-search-result:outlined .overview-icon, .app-well-app.app-folder:checked .overview-icon, .app-folder.grid-search-result:checked .overview-icon { - background-color: rgba(238, 238, 236, 0.19); } + background-color: rgba(255, 255, 255, 0.19); } .app-well-app.app-folder:outlined .overview-icon:active .overview-icon, .app-folder.grid-search-result:outlined .overview-icon:active .overview-icon, .app-well-app.app-folder:checked .overview-icon:active .overview-icon, .app-folder.grid-search-result:checked .overview-icon:active .overview-icon { - background-color: rgba(238, 238, 236, 0.22); } + background-color: rgba(255, 255, 255, 0.22); } .app-well-app.app-folder:outlined .overview-icon:hover .overview-icon, .app-folder.grid-search-result:outlined .overview-icon:hover .overview-icon, .app-well-app.app-folder:checked .overview-icon:hover .overview-icon, .app-folder.grid-search-result:checked .overview-icon:hover .overview-icon { - background-color: rgba(238, 238, 236, 0.25); } + background-color: rgba(255, 255, 255, 0.25); } .app-well-app.app-folder:drop .overview-icon, .app-folder.grid-search-result:drop .overview-icon { border: 2px solid rgba(39, 119, 255, 0.8); background-color: rgba(39, 119, 255, 0.2); } @@ -2127,7 +2260,7 @@ StScrollBar { padding: 0; } .system-action-icon { - background-color: rgba(0, 0, 0, 0.8); + background-color: rgba(255, 255, 255, 0.1); color: white; border-radius: 99px; icon-size: 48px; } @@ -2153,6 +2286,8 @@ StScrollBar { width: 24px; height: 24px; border-radius: 99px; } + .page-navigation-arrow > StIcon { + color: white; } .page-navigation-arrow:insensitive { transition-duration: 100ms; background-color: transparent; @@ -2167,11 +2302,11 @@ StScrollBar { .page-navigation-arrow:hover { transition-duration: 100ms; color: white; - background-color: rgba(102, 105, 115, 0.545); } + background-color: rgba(104, 107, 118, 0.545); } .page-navigation-arrow:active { transition-duration: 100ms; color: white; - background-color: rgba(117, 120, 131, 0.545); } + background-color: rgba(111, 115, 126, 0.545); } /* Workspace pager */ .workspace-thumbnails { @@ -2180,7 +2315,7 @@ StScrollBar { padding: 6px; } .workspace-thumbnails .workspace-thumbnail { color: white; - background-color: #3d4251; + background-color: #484d60; border-radius: 4px; border: 1px solid transparent; } .workspace-thumbnails .placeholder { @@ -2236,7 +2371,7 @@ StScrollBar { background-color: white; } .hidden { - color: rgba(0, 0, 0, 0); } + color: transparent; } .caps-lock-warning-label { text-align: center; @@ -2245,7 +2380,7 @@ StScrollBar { /* Workspace animation */ .workspace-animation { - background-color: #272a34; } + background-color: #323643; } /* Tiled window previews */ .tile-preview { @@ -2416,11 +2551,10 @@ StScrollBar { /* Looking Glass */ #LookingGlassDialog { - background-color: rgba(35, 37, 46, 0.95); + background-color: rgba(48, 51, 64, 0.98); + color: white; border-radius: 0 0 16px 16px; - border: 1px solid rgba(238, 238, 236, 0.07); border-top-width: 0; - color: #eeeeec; padding: 6px; spacing: 6px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3); } @@ -2501,7 +2635,7 @@ StScrollBar { .lg-extension:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .lg-extension:focus { transition-duration: 100ms; color: #eeeeec; @@ -2513,6 +2647,10 @@ StScrollBar { .lg-extension:focus:active { background-color: #404a61; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .lg-extension:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .lg-extension-meta { spacing: 6px; } @@ -2524,13 +2662,13 @@ StScrollBar { padding: 6px; } .lg-debug-flag-button { - color: #eeeeec; } + color: white; } .lg-debug-flag-button StLabel { padding: 6px, 12px; } .lg-debug-flag-button:hover { color: white; } .lg-debug-flag-button:active { - color: #bebeb6; } + color: #cccccc; } .lg-debug-flags-header { padding-top: 12px; @@ -2544,7 +2682,7 @@ StScrollBar { /* Login Dialog */ .login-dialog { - background-color: #272a34; } + background-color: #323643; } .login-dialog-button.cancel-button { padding: 9px; } @@ -2653,7 +2791,7 @@ StScrollBar { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6); } #lockDialogGroup { - background-color: #272a34; } + background-color: #323643; } .unlock-dialog-clock { color: white; @@ -2794,7 +2932,8 @@ StScrollBar { /* Top Bar */ #panel { background: rgba(35, 37, 46, 0.8); - text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } + text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); + box-shadow: none; } #panel StIcon { icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #panel.unlock-screen, #panel.login-screen, #panel.lock-screen, #panel:overview { @@ -2877,7 +3016,7 @@ StScrollBar { .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon { background-color: rgba(255, 255, 255, 0.07); } .app-well-app.app-folder:hover .overview-icon, .app-folder.grid-search-result:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon, .app-folder.grid-search-result:selected .overview-icon, .app-well-app.app-folder:focus .overview-icon, .app-folder.grid-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon:hover .overview-icon, .app-folder.grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app.app-folder:focus .overview-icon:hover .overview-icon, .app-folder.grid-search-result:focus .overview-icon:hover .overview-icon { diff --git a/share/themes/Kali-Dark/gtk-3.0/gtk.css b/share/themes/Kali-Dark/gtk-3.0/gtk.css index b8764198..a519ae76 100644 --- a/share/themes/Kali-Dark/gtk-3.0/gtk.css +++ b/share/themes/Kali-Dark/gtk-3.0/gtk.css @@ -581,7 +581,7 @@ button { notebook > header > tabs > arrow:disabled, button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -590,7 +590,7 @@ button { button:disabled:active, button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#16181d); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } notebook > header > tabs > arrow.image-button, @@ -877,7 +877,7 @@ button.suggested-action { button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -1023,7 +1023,7 @@ button.destructive-action { button.destructive-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -1186,14 +1186,14 @@ stacksidebar row.needs-attention > label, .stack-switcher > button.needs-attenti -gtk-icon-shadow: none; } .inline-toolbar toolbutton > button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:disabled:active, .inline-toolbar toolbutton > button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#16181d); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:backdrop { @@ -1840,7 +1840,7 @@ headerbar { .selection-mode .titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode.titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode headerbar button.suggested-action:disabled, headerbar.selection-mode button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -2702,7 +2702,7 @@ switch { border: 1px solid #00215a; } switch:disabled slider { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -3160,7 +3160,7 @@ scale { border-color: #00348d; } scale slider:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -4271,7 +4271,7 @@ infobar { -gtk-icon-shadow: none; } infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; diff --git a/share/themes/Kali-Dark/gtk-4.0/gtk.css b/share/themes/Kali-Dark/gtk-4.0/gtk.css index 5c13f7aa..34c2d8d4 100644 --- a/share/themes/Kali-Dark/gtk-4.0/gtk.css +++ b/share/themes/Kali-Dark/gtk-4.0/gtk.css @@ -526,14 +526,14 @@ button { notebook > header > tabs > arrow:disabled, button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); -gtk-icon-filter: opacity(0.5); } notebook > header > tabs > arrow:disabled:active, notebook > header > tabs > arrow:disabled:checked, button:disabled:active, button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#1a1c23); box-shadow: none; } button.sidebar-button, notebook > header > tabs > arrow, windowcontrols button, notebook > header > tabs > arrow.flat, @@ -746,7 +746,7 @@ button.suggested-action { button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } button.suggested-action:disabled:active, @@ -831,7 +831,7 @@ button.destructive-action { button.destructive-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } button.destructive-action:disabled:active, @@ -1014,7 +1014,7 @@ modelbutton.flat arrow { box-shadow: none; } .toolbar button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } .toolbar button:backdrop { color: #888a8d; @@ -2178,7 +2178,7 @@ switch { border: 1px solid #00348d; } switch:disabled > slider { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } row:selected switch { outline-color: rgba(255, 255, 255, 0.3); } @@ -2449,7 +2449,7 @@ progressbar > trough, scale > trough > fill, scale > trough { background-color: #0a0a0d; } progressbar > trough:disabled, scale > trough > fill:disabled, scale > trough:disabled { background-color: #242731; - border-color: #0d0e11; } + border-color: #17191f; } row:selected progressbar > trough, row:selected scale > trough > fill, row:selected scale > trough { outline-color: rgba(255, 255, 255, 0.3); border-color: #00348d; } @@ -2538,7 +2538,7 @@ scale { border-color: #00348d; } scale > trough > slider:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } row:selected scale > trough > slider:disabled, row:selected scale > trough > slider { border-color: #00348d; } diff --git a/share/themes/Kali-Light/gnome-shell/gnome-shell.css b/share/themes/Kali-Light/gnome-shell/gnome-shell.css index 5299f5eb..f17d949c 100644 --- a/share/themes/Kali-Light/gnome-shell/gnome-shell.css +++ b/share/themes/Kali-Light/gnome-shell/gnome-shell.css @@ -23,127 +23,125 @@ stage { color: #5c616c; } /* Common Stylings */ -.screenshot-ui-panel, .workspace-switcher, .switcher-list, .resize-popup, .osd-monitor-label, .osd-window { - color: white; - background-color: #303340; - border: 1px solid rgba(255, 255, 255, 0.1); - border-radius: 999px; - padding: 12px; } - .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon, .app-well-app .overview-icon, .grid-search-result .overview-icon, .dash-item-container .show-apps .overview-icon, .list-search-result, .search-provider-icon, .switcher-list .item-box { border-radius: 16px; padding: 6px; spacing: 6px; border: 2px solid transparent; transition-duration: 200ms; - text-align: center; } + text-align: center; + color: inherit; } -#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .login-dialog-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { +#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { border-radius: 8px; border-style: solid; border-width: 1px; font-weight: bold; - padding: 3px 24px; + padding: 3px 24px; } + +.app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; } - #LookingGlassDialog .notebook-tab:focus, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus, .app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .login-dialog-button:focus, .icon-button:focus, .background-app-item .close-button:focus { + background-color: #efeff0; } + .app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .icon-button:focus, .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .close-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dce5f3; + background-color: #dbe3f2; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } - #LookingGlassDialog .notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:hover, .app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .login-dialog-button:focus:hover, .icon-button:focus:hover, .background-app-item .close-button:focus:hover { - background-color: #e3ecfa; + .app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .icon-button:focus:hover, .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .close-button:focus:hover { + background-color: #e2eaf8; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - #LookingGlassDialog .notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:active, .app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .login-dialog-button:focus:active, .icon-button:focus:active, .background-app-item .close-button:focus:active { + .app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .icon-button:focus:active, .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .close-button:focus:active { background-color: #e9f1ff; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - #LookingGlassDialog .notebook-tab:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:hover, .app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .login-dialog-button:hover, .icon-button:hover, .background-app-item .close-button:hover { + .app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .icon-button:hover, .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .close-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } - #LookingGlassDialog .notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .lg-toolbar-button:insensitive, .app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .login-dialog-button:insensitive, .icon-button:insensitive, .background-app-item .close-button:insensitive { + background-color: #e7e7e9; } + .app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .icon-button:insensitive, .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .close-button:insensitive { transition-duration: 100ms; color: rgba(92, 97, 108, 0.5); background-color: rgba(92, 97, 108, 0.05); } - #LookingGlassDialog .notebook-tab:selected, #LookingGlassDialog > #Toolbar .lg-toolbar-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .login-dialog-button:selected, .icon-button:selected, .background-app-item .close-button:selected, #LookingGlassDialog .notebook-tab:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:active, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .login-dialog-button:active, .icon-button:active, .background-app-item .close-button:active { + .app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .icon-button:selected, .login-dialog-button.cancel-button:selected, .login-dialog-button.switch-user-button:selected, .login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .close-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .icon-button:active, .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active, .background-app-item .close-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } - #LookingGlassDialog .notebook-tab:checked, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked, .app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .login-dialog-button:checked, .icon-button:checked, .background-app-item .close-button:checked { + background-color: #dfdfe1; } + .app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .icon-button:checked, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .close-button:checked { transition-duration: 100ms; color: #5c616c; - background-color: white; } - #LookingGlassDialog .notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:hover, .app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .login-dialog-button:checked:hover, .icon-button:checked:hover, .background-app-item .close-button:checked:hover { + background-color: #d7d7da; } + .app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .icon-button:checked:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .close-button:checked:hover { background-color: white; } - #LookingGlassDialog .notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:active, .app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .login-dialog-button:checked:active, .icon-button:checked:active, .background-app-item .close-button:checked:active { + .app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .icon-button:checked:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .close-button:checked:active { background-color: white; } - #LookingGlassDialog .flat.notebook-tab, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button, .app-folder-dialog .folder-name-container .flat.edit-folder-button, .flat.button, .flat.login-dialog-button, .flat.icon-button, .background-app-item .flat.close-button { + .app-folder-dialog .folder-name-container .flat.edit-folder-button, .flat.button, .flat.icon-button, .flat.login-dialog-button.cancel-button, .flat.login-dialog-button.switch-user-button, .flat.login-dialog-button.login-dialog-session-list-button, .background-app-item .flat.close-button { transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; background-color: transparent; } - #LookingGlassDialog .flat.notebook-tab:focus, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .flat.login-dialog-button:focus, .flat.icon-button:focus, .background-app-item .flat.close-button:focus { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .flat.icon-button:focus, .flat.login-dialog-button.cancel-button:focus, .flat.login-dialog-button.switch-user-button:focus, .flat.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .flat.close-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dce5f3; + background-color: #dbe3f2; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } - #LookingGlassDialog .flat.notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .flat.login-dialog-button:focus:hover, .flat.icon-button:focus:hover, .background-app-item .flat.close-button:focus:hover { - background-color: #e3ecfa; + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .flat.icon-button:focus:hover, .flat.login-dialog-button.cancel-button:focus:hover, .flat.login-dialog-button.switch-user-button:focus:hover, .flat.login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .flat.close-button:focus:hover { + background-color: #e2eaf8; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - #LookingGlassDialog .flat.notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .flat.login-dialog-button:focus:active, .flat.icon-button:focus:active, .background-app-item .flat.close-button:focus:active { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .flat.icon-button:focus:active, .flat.login-dialog-button.cancel-button:focus:active, .flat.login-dialog-button.switch-user-button:focus:active, .flat.login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .flat.close-button:focus:active { background-color: #e9f1ff; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - #LookingGlassDialog .flat.notebook-tab:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .flat.login-dialog-button:hover, .flat.icon-button:hover, .background-app-item .flat.close-button:hover { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .flat.icon-button:hover, .flat.login-dialog-button.cancel-button:hover, .flat.login-dialog-button.switch-user-button:hover, .flat.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .flat.close-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } - #LookingGlassDialog .flat.notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:insensitive, .app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .flat.login-dialog-button:insensitive, .flat.icon-button:insensitive, .background-app-item .flat.close-button:insensitive { + background-color: #e7e7e9; } + .app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .flat.icon-button:insensitive, .flat.login-dialog-button.cancel-button:insensitive, .flat.login-dialog-button.switch-user-button:insensitive, .flat.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .flat.close-button:insensitive { transition-duration: 100ms; color: rgba(92, 97, 108, 0.5); background-color: rgba(92, 97, 108, 0.05); } - #LookingGlassDialog .flat.notebook-tab:selected, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .flat.login-dialog-button:selected, .flat.icon-button:selected, .background-app-item .flat.close-button:selected, #LookingGlassDialog .flat.notebook-tab:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .flat.login-dialog-button:active, .flat.icon-button:active, .background-app-item .flat.close-button:active { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .flat.icon-button:selected, .flat.login-dialog-button.cancel-button:selected, .flat.login-dialog-button.switch-user-button:selected, .flat.login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .flat.close-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .flat.icon-button:active, .flat.login-dialog-button.cancel-button:active, .flat.login-dialog-button.switch-user-button:active, .flat.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .flat.close-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } - #LookingGlassDialog .flat.notebook-tab:checked, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .flat.login-dialog-button:checked, .flat.icon-button:checked, .background-app-item .flat.close-button:checked { + background-color: #dfdfe1; } + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .flat.icon-button:checked, .flat.login-dialog-button.cancel-button:checked, .flat.login-dialog-button.switch-user-button:checked, .flat.login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .flat.close-button:checked { transition-duration: 100ms; color: #5c616c; - background-color: white; } - #LookingGlassDialog .flat.notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .flat.login-dialog-button:checked:hover, .flat.icon-button:checked:hover, .background-app-item .flat.close-button:checked:hover { + background-color: #d7d7da; } + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .flat.icon-button:checked:hover, .flat.login-dialog-button.cancel-button:checked:hover, .flat.login-dialog-button.switch-user-button:checked:hover, .flat.login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .flat.close-button:checked:hover { background-color: white; } - #LookingGlassDialog .flat.notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .flat.login-dialog-button:checked:active, .flat.icon-button:checked:active, .background-app-item .flat.close-button:checked:active { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .flat.icon-button:checked:active, .flat.login-dialog-button.cancel-button:checked:active, .flat.login-dialog-button.switch-user-button:checked:active, .flat.login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .flat.close-button:checked:active { background-color: white; } -.lg-dialog StEntry, StEntry { +.login-dialog-prompt-entry, .search-entry, .lg-dialog StEntry, StEntry { border-radius: 8px; padding: 9px 9px; - color: #5c616c; selection-background-color: #2777ff; - selected-color: #ffffff; + selected-color: #ffffff; } + +StEntry { transition-duration: 100ms; - background-color: rgba(92, 97, 108, 0.1); + background-color: rgba(92, 97, 108, 0.15); color: rgba(92, 97, 108, 0.7); } StEntry:hover { transition-duration: 100ms; - background-color: rgba(92, 97, 108, 0.2); - color: inherit; } + background-color: rgba(92, 97, 108, 0.25); } StEntry:focus { transition-duration: 100ms; - background-color: rgba(75, 104, 155, 0.24); - box-shadow: inset 0 0 0 2px #2777ff; + background-color: rgba(78, 103, 148, 0.2875); + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); color: #5c616c; } StEntry:insensitive { transition-duration: 100ms; - background-color: rgba(174, 176, 182, 0.2); - color: #aeb0b6; } + background-color: rgba(92, 97, 108, 0.25); + color: rgba(92, 97, 108, 0.5); } + StEntry StLabel.hint-text { + color: rgba(92, 97, 108, 0.7); } .modal-dialog .modal-dialog-linked-button, .hotplug-notification-item, .notification-banner .notification-button { padding: 12px; font-weight: bold !important; transition-duration: 100ms; color: #5c616c; - background-color: #e0e1e2; } + background-color: #dfdfe0; } .modal-dialog .modal-dialog-linked-button:ltr, .hotplug-notification-item:ltr, .notification-banner .notification-button:ltr { margin-right: 1px; } .modal-dialog .modal-dialog-linked-button:rtl, .hotplug-notification-item:rtl, .notification-banner .notification-button:rtl { @@ -155,28 +153,28 @@ stage { .modal-dialog .modal-dialog-linked-button:focus, .hotplug-notification-item:focus, .notification-banner .notification-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #ced6e5; + background-color: #cdd5e3; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } .modal-dialog .modal-dialog-linked-button:focus:hover, .hotplug-notification-item:focus:hover, .notification-banner .notification-button:focus:hover { - background-color: #d5ddec; + background-color: #d4dcea; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } .modal-dialog .modal-dialog-linked-button:focus:active, .hotplug-notification-item:focus:active, .notification-banner .notification-button:focus:active { - background-color: #dce4f2; + background-color: #dbe3f1; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } .modal-dialog .modal-dialog-linked-button:hover, .hotplug-notification-item:hover, .notification-banner .notification-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #e8e9e9; } + background-color: #d7d7d8; } .modal-dialog .modal-dialog-linked-button:active, .hotplug-notification-item:active, .notification-banner .notification-button:active { transition-duration: 100ms; color: #5c616c; - background-color: #f8f8f8; } + background-color: #cfcfd1; } .modal-dialog .modal-dialog-linked-button:checked, .hotplug-notification-item:checked, .notification-banner .notification-button:checked { transition-duration: 100ms; color: #5c616c; - background-color: #f8f8f8; } + background-color: #c8c8c9; } .modal-dialog .modal-dialog-linked-button:checked:hover, .hotplug-notification-item:checked:hover, .notification-banner .notification-button:checked:hover { - background-color: white; } + background-color: #fefefe; } .modal-dialog .modal-dialog-linked-button:checked:active, .hotplug-notification-item:checked:active, .notification-banner .notification-button:checked:active { background-color: white; } .modal-dialog .modal-dialog-linked-button:first-child:ltr, .hotplug-notification-item:first-child:ltr, .notification-banner .notification-button:first-child:ltr { @@ -194,60 +192,9 @@ stage { margin-left: 0 !important; margin-right: 0 !important; } -.screenshot-ui-show-pointer-button, .screenshot-ui-type-button { - transition-duration: 100ms; - background-color: transparent; - background-color: none; - box-shadow: none; } - .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { - transition-duration: 100ms; - color: rgba(92, 97, 108, 0.5); - background-color: rgba(92, 97, 108, 0.05); - background-color: transparent; - color: rgba(255, 255, 255, 0.5); } - .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { - transition-duration: 100ms; - background-color: transparent; - background-color: none; - box-shadow: none; } - .screenshot-ui-show-pointer-button:insensitive:insensitive, .screenshot-ui-type-button:insensitive:insensitive { - transition-duration: 100ms; - color: rgba(92, 97, 108, 0.5); - background-color: rgba(92, 97, 108, 0.05); - background-color: transparent; - color: rgba(255, 255, 255, 0.5); } - .screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { - transition-duration: 100ms; - color: white; - background-color: #3f4b62; - box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } - .screenshot-ui-show-pointer-button:focus:hover, .screenshot-ui-type-button:focus:hover { - background-color: #45516a; - box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - .screenshot-ui-show-pointer-button:focus:active, .screenshot-ui-type-button:focus:active { - background-color: #4c5872; - box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } - .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover { - transition-duration: 100ms; - color: white; - background-color: #494d59; } - .screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active { - transition-duration: 100ms; - color: white; - background-color: #575c6a; } - .screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked { - transition-duration: 100ms; - color: white; - background-color: #575c6a; } - .screenshot-ui-show-pointer-button:outlined:hover, .screenshot-ui-type-button:outlined:hover, .screenshot-ui-show-pointer-button:checked:hover, .screenshot-ui-type-button:checked:hover { - background-color: #5d6373; } - .screenshot-ui-show-pointer-button:outlined:active, .screenshot-ui-type-button:outlined:active, .screenshot-ui-show-pointer-button:checked:active, .screenshot-ui-type-button:checked:active { - background-color: #646a7b; } - .dash-label, .window-caption { - background-color: #303340; + background-color: rgba(0, 0, 0, 0.9); color: white; - border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 99px; padding: 6px 12px; text-align: center; } @@ -265,7 +212,7 @@ stage { font-weight: 700; font-size: 15pt; } -.bt-menu-placeholder, .message-dialog-content .message-dialog-title.lightweight, .headline { +.bt-menu-placeholder.popup-menu-item, .message-dialog-content .message-dialog-title.lightweight, .headline { font-weight: 700; font-size: 13pt; } @@ -290,6 +237,148 @@ stage { .unlock-dialog-clock .unlock-dialog-clock-time, #panel, .weather-button .weather-forecast-time, .world-clocks-button .world-clocks-timezone, .world-clocks-button .world-clocks-time, .events-button .event-time, .calendar .calendar-day-base { font-feature-settings: "tnum"; } +/* OSD Elements */ +#LookingGlassDialog, .screenshot-ui-panel, .workspace-switcher, .switcher-list, .resize-popup, .osd-monitor-label, .osd-window { + color: white; + background-color: #303340; + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 999px; + padding: 12px; } + +.lg-dialog StEntry { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.7); } + .lg-dialog StEntry:hover { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); } + .lg-dialog StEntry:focus { + transition-duration: 100ms; + background-color: rgba(197, 218, 255, 0.2875); + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); + color: white; } + .lg-dialog StEntry:insensitive { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); + color: rgba(255, 255, 255, 0.5); } + .lg-dialog StEntry StLabel.hint-text { + color: rgba(255, 255, 255, 0.7); } + +#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button { + transition-duration: 100ms; + color: white; + background-color: #444853; } + #LookingGlassDialog .notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .lg-toolbar-button:insensitive, .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + color: rgba(255, 255, 255, 0.5); + background-color: rgba(255, 255, 255, 0.05); } + #LookingGlassDialog .notebook-tab:focus, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus, .screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { + transition-duration: 100ms; + color: white; + background-color: #414d64; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } + #LookingGlassDialog .notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:hover, .screenshot-ui-show-pointer-button:focus:hover, .screenshot-ui-type-button:focus:hover { + background-color: #47536c; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + #LookingGlassDialog .notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:active, .screenshot-ui-show-pointer-button:focus:active, .screenshot-ui-type-button:focus:active { + background-color: #4e5a73; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + #LookingGlassDialog .notebook-tab:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:hover, .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover { + transition-duration: 100ms; + color: white; + background-color: #3d414b; } + #LookingGlassDialog .notebook-tab:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:active, .screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active { + transition-duration: 100ms; + color: white; + background-color: #363942; } + #LookingGlassDialog .notebook-tab:outlined, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined, .screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, #LookingGlassDialog .notebook-tab:checked, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked { + transition-duration: 100ms; + color: white; + background-color: #2f323a; } + #LookingGlassDialog .notebook-tab:outlined:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:hover, .screenshot-ui-show-pointer-button:outlined:hover, .screenshot-ui-type-button:outlined:hover, #LookingGlassDialog .notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:hover, .screenshot-ui-show-pointer-button:checked:hover, .screenshot-ui-type-button:checked:hover { + background-color: #606575; } + #LookingGlassDialog .notebook-tab:outlined:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:active, .screenshot-ui-show-pointer-button:outlined:active, .screenshot-ui-type-button:outlined:active, #LookingGlassDialog .notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:active, .screenshot-ui-show-pointer-button:checked:active, .screenshot-ui-type-button:checked:active { + background-color: #666c7d; } + +.screenshot-ui-show-pointer-button, .screenshot-ui-type-button { + transition-duration: 100ms; + background-color: transparent; + background-color: none; + box-shadow: none; } + .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); + background-color: transparent; + color: rgba(255, 255, 255, 0.5); } + .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + background-color: transparent; + background-color: none; + box-shadow: none; } + .screenshot-ui-show-pointer-button:insensitive:insensitive, .screenshot-ui-type-button:insensitive:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); + background-color: transparent; + color: rgba(255, 255, 255, 0.5); } + +/* System Elements */ +.login-dialog-prompt-entry, .search-entry { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.7); } + .login-dialog-prompt-entry:hover, .search-entry:hover { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); } + .login-dialog-prompt-entry:focus, .search-entry:focus { + transition-duration: 100ms; + background-color: rgba(197, 218, 255, 0.2875); + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); + color: white; } + .login-dialog-prompt-entry:insensitive, .search-entry:insensitive { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); + color: rgba(255, 255, 255, 0.5); } + .login-dialog-prompt-entry StLabel.hint-text, .search-entry StLabel.hint-text { + color: rgba(255, 255, 255, 0.7); } + +.login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button { + transition-duration: 100ms; + color: white; + background-color: #464a55; } + .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive { + transition-duration: 100ms; + color: rgba(255, 255, 255, 0.5); + background-color: rgba(255, 255, 255, 0.05); } + .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus { + transition-duration: 100ms; + color: white; + background-color: #434f66; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } + .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover { + background-color: #49556e; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active { + background-color: #4f5c75; + box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover { + transition-duration: 100ms; + color: white; + background-color: #3f434d; } + .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active { + transition-duration: 100ms; + color: white; + background-color: #383b44; } + .login-dialog-button.cancel-button:outlined, .login-dialog-button.switch-user-button:outlined, .login-dialog-button.login-dialog-session-list-button:outlined, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked { + transition-duration: 100ms; + color: white; + background-color: #31343c; } + .login-dialog-button.cancel-button:outlined:hover, .login-dialog-button.switch-user-button:outlined:hover, .login-dialog-button.login-dialog-session-list-button:outlined:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover { + background-color: #626777; } + .login-dialog-button.cancel-button:outlined:active, .login-dialog-button.switch-user-button:outlined:active, .login-dialog-button.login-dialog-session-list-button:outlined:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active { + background-color: #696f7f; } + /* WIDGETS */ .shell-link { color: #005af3; } @@ -313,11 +402,10 @@ StEntry StIcon.peek-password { padding: 0 4px; } StEntry StLabel.hint-text { - margin-left: 2px; - color: rgba(92, 97, 108, 0.7); } + margin-left: 2px; } /* Buttons */ -.button, .login-dialog-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { +.button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { min-height: 22px; } .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { @@ -359,7 +447,7 @@ StEntry StLabel.hint-text { /* Slider */ .slider { -barlevel-height: 4px; - -barlevel-background-color: rgba(92, 97, 108, 0.4); + -barlevel-background-color: rgba(92, 97, 108, 0.2); -barlevel-border-width: 2px; -barlevel-border-color: transparent; -barlevel-active-background-color: #2777ff; @@ -437,15 +525,15 @@ StScrollBar { .popup-menu-item:focus, .popup-menu-item:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .popup-menu-item:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .popup-menu-item:checked { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #d7d7da; } .popup-menu-item:checked:hover { background-color: white; } .popup-menu-item:checked:active { @@ -460,7 +548,7 @@ StScrollBar { .popup-inactive-menu-item { color: #5c616c; } .popup-inactive-menu-item:insensitive { - color: #aeb0b6; } + color: #9da0a7; } .popup-menu-arrow, .popup-menu-icon { @@ -479,7 +567,7 @@ StScrollBar { padding: 9px 12px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; border-top-width: 0; } .popup-sub-menu .popup-menu-item:ltr { padding-left: 6px; } @@ -488,15 +576,15 @@ StScrollBar { .popup-sub-menu .popup-menu-item:focus, .popup-sub-menu .popup-menu-item:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .popup-sub-menu .popup-menu-item:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .popup-sub-menu .popup-menu-item:checked { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #d7d7da; } .popup-sub-menu .popup-menu-item:checked:hover { background-color: white; } .popup-sub-menu .popup-menu-item:checked:active { @@ -578,22 +666,27 @@ StScrollBar { .datemenu-today-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .datemenu-today-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .datemenu-today-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dce5f3; + background-color: #dbe3f2; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } .datemenu-today-button:focus:hover { - background-color: #e3ecfa; + background-color: #e2eaf8; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } .datemenu-today-button:focus:active { background-color: #e9f1ff; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .datemenu-today-button:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); + background-color: transparent; } /* Calendar */ .calendar { @@ -614,22 +707,27 @@ StScrollBar { .calendar:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .calendar:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .calendar:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dce5f3; + background-color: #dbe3f2; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } .calendar:focus:hover { - background-color: #e3ecfa; + background-color: #e2eaf8; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } .calendar:focus:active { background-color: #e9f1ff; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .calendar:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); + background-color: transparent; } .calendar .calendar-month-header .calendar-change-month-back StIcon, .calendar .calendar-month-header .calendar-change-month-forward StIcon { icon-size: 1.09em; } @@ -642,9 +740,9 @@ StScrollBar { margin: 2px; border-radius: 8px; } .calendar .calendar-month-header .pager-button:hover, .calendar .calendar-month-header .pager-button:focus { - background-color: #f2f2f2; } + background-color: #e8e8e8; } .calendar .calendar-month-header .pager-button:active { - background-color: #ededed; } + background-color: #e3e3e3; } .calendar .calendar-day-base { text-align: center; margin: 2px; @@ -654,29 +752,29 @@ StScrollBar { border-radius: 99px; transition-duration: 100ms; } .calendar .calendar-day-base:hover { - background-color: #f2f2f2; } + background-color: #e8e8e8; } .calendar .calendar-day-base:focus { background-color: #d4e4ff; - color: #ffffff; + color: inherit; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); } .calendar .calendar-day-base:active, .calendar .calendar-day-base:selected { - color: #50555e; - background-color: #ededed; } + color: #42464e; + background-color: #e3e3e3; } .calendar .calendar-day-base:active:focus, .calendar .calendar-day-base:selected:focus { - background-color: #c6d6f1; } + background-color: #bdcde9; } .calendar .calendar-day-base.calendar-day-heading { - color: #aeb0b6; + color: #9da0a7; padding-top: 6px; - height: 16px !important; + height: 1.1em !important; font-weight: 600; } .calendar .calendar-day { font-weight: 600; } .calendar .calendar-nonwork-day { - color: #aeb0b6; } + color: #9da0a7; } .calendar .calendar-other-month-day { color: rgba(92, 97, 108, 0.5); } .calendar .calendar-other-month-day.calendar-nonwork-day { - color: rgba(174, 176, 182, 0.5); } + color: rgba(157, 160, 167, 0.5); } .calendar .calendar-today { background-color: #2777ff; font-weight: 800; @@ -701,7 +799,7 @@ StScrollBar { padding: 0 6px; border-radius: 3px; background-color: rgba(92, 97, 108, 0.1); - color: #aeb0b6; } + color: #9da0a7; } /* Events */ .events-button { @@ -709,36 +807,40 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; padding: 12px; } .events-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .events-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .events-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dce5f3; + background-color: #dbe3f2; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } .events-button:focus:hover { - background-color: #e3ecfa; + background-color: #e2eaf8; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } .events-button:focus:active { background-color: #e9f1ff; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .events-button:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .events-button .events-box { spacing: 6px; } .events-button .events-list { - spacing: 12px; } + spacing: 12px; + color: #5c616c; } .events-button .events-title { - color: #aeb0b6; margin-bottom: 4px; } .events-button .event-time { - color: #aeb0b6; } + color: #9da0a7; } /* World clocks */ .world-clocks-button { @@ -746,32 +848,36 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; padding: 12px; } .world-clocks-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .world-clocks-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .world-clocks-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dce5f3; + background-color: #dbe3f2; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } .world-clocks-button:focus:hover { - background-color: #e3ecfa; + background-color: #e2eaf8; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } .world-clocks-button:focus:active { background-color: #e9f1ff; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .world-clocks-button:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .world-clocks-button .world-clocks-grid { spacing-rows: 6px; spacing-columns: 12px; } .world-clocks-button .world-clocks-header { - color: #aeb0b6; } + color: #9da0a7; } .world-clocks-button .world-clocks-city { color: #5c616c; } .world-clocks-button .world-clocks-time { @@ -781,7 +887,7 @@ StScrollBar { .world-clocks-button .world-clocks-time:rtl { text-align: left; } .world-clocks-button .world-clocks-timezone { - color: #aeb0b6; } + color: #9da0a7; } /* Weather */ .weather-button { @@ -789,33 +895,37 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; padding: 12px; } .weather-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .weather-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .weather-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dce5f3; + background-color: #dbe3f2; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } .weather-button:focus:hover { - background-color: #e3ecfa; + background-color: #e2eaf8; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } .weather-button:focus:active { background-color: #e9f1ff; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .weather-button:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .weather-button .weather-box { spacing: 10px; } .weather-button .weather-header-box { spacing: 6px; } .weather-button .weather-header { - color: #aeb0b6; } + color: #9da0a7; } .weather-button .weather-header.location { font-weight: normal; } .weather-button .weather-grid { @@ -843,7 +953,7 @@ StScrollBar { padding-left: 6px; border-left-width: 1px; } .message-list .message-list-placeholder { - color: rgba(174, 176, 182, 0.5); } + color: #9da0a7; } .message-list .message-list-placeholder > StIcon { icon-size: 3.27em; margin-bottom: 12px; @@ -878,26 +988,30 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; } + background-color: #efeff0; } .message:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .message:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .message:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dce5f3; + background-color: #dbe3f2; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } .message:focus:hover { - background-color: #e3ecfa; + background-color: #e2eaf8; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } .message:focus:active { background-color: #e9f1ff; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .message:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .message .message-icon-bin { padding: 18px; } .message .message-icon-bin:ltr { @@ -931,15 +1045,15 @@ StScrollBar { text-align: left; } .message .message-close-button { color: #5c616c; - background-color: rgba(92, 97, 108, 0.1); + background-color: rgba(92, 97, 108, 0.2); border-radius: 99px; padding: 5px; margin: 1px; } .message .message-close-button:hover { - background-color: rgba(92, 97, 108, 0.2); } + background-color: rgba(92, 97, 108, 0.3); } .message .message-close-button:active { - background-color: rgba(92, 97, 108, 0.1); } - .message .message-close-button StIcon { + background-color: rgba(92, 97, 108, 0.2); } + .message .message-close-button > StIcon { icon-size: 1.09em; } .message .message-body { color: #454850; } @@ -954,13 +1068,13 @@ StScrollBar { border-radius: 8px; color: #5c616c; } .message-media-control:hover { - background-color: white; + background-color: whitesmoke; color: #5c616c; } .message-media-control:active { - background-color: #fafafa; + background-color: #f0f0f0; color: #5c616c; } .message-media-control:insensitive { - color: #bbbdc2; } + color: #aaadb3; } .message-media-control:last-child:ltr { margin-right: 12px; } .message-media-control:last-child:rtl { @@ -986,7 +1100,7 @@ StScrollBar { .candidate-index { padding: 0; padding-right: 6px; - color: #aeb0b6; } + color: #9da0a7; } .candidate-box { padding: 6px 12px 6px 12px; @@ -995,8 +1109,8 @@ StScrollBar { background-color: #2777ff; color: #ffffff; } .candidate-box:hover { - background-color: #f2f2f2; - color: #50555e; } + background-color: #e8e8e8; + color: #474b53; } .candidate-page-button-box { height: 2em; } @@ -1181,7 +1295,7 @@ StScrollBar { .audio-selection-device { border-radius: 16px; } .audio-selection-device:hover, .audio-selection-device:focus { - background-color: #f2f2f2; } + background-color: #e8e8e8; } .audio-selection-device:active { background-color: #2777ff; color: #ffffff; } @@ -1270,21 +1384,21 @@ StScrollBar { .switcher-list .item-box { background-color: transparent; } .switcher-list .item-box:hover { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(92, 97, 108, 0.1); } .switcher-list .item-box:selected, .switcher-list .item-box:focus { - background-color: rgba(255, 255, 255, 0.13); } + background-color: rgba(92, 97, 108, 0.13); } .switcher-list .item-box:selected:hover, .switcher-list .item-box:focus:hover { - background-color: rgba(255, 255, 255, 0.16); } + background-color: rgba(92, 97, 108, 0.16); } .switcher-list .item-box:selected:active, .switcher-list .item-box:focus:active { - background-color: rgba(255, 255, 255, 0.13); } + background-color: rgba(92, 97, 108, 0.13); } .switcher-list .item-box:active { - background-color: rgba(255, 255, 255, 0.16); } + background-color: rgba(92, 97, 108, 0.16); } .switcher-list .item-box:outlined, .switcher-list .item-box:checked { - background-color: rgba(255, 255, 255, 0.19); } + background-color: rgba(92, 97, 108, 0.19); } .switcher-list .item-box:outlined:active, .switcher-list .item-box:checked:active { - background-color: rgba(255, 255, 255, 0.22); } + background-color: rgba(92, 97, 108, 0.22); } .switcher-list .item-box:outlined:hover, .switcher-list .item-box:checked:hover { - background-color: rgba(255, 255, 255, 0.25); } + background-color: rgba(92, 97, 108, 0.25); } .switcher-list .item-box:drop { border: 2px solid rgba(39, 119, 255, 0.8); background-color: rgba(39, 119, 255, 0.2); } @@ -1368,7 +1482,7 @@ StScrollBar { transition-duration: 200ms; border-radius: 99px; } .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:hover, .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:focus { - background-color: #f2f2f2; } + background-color: #e8e8e8; } .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 { @@ -1397,7 +1511,7 @@ StScrollBar { .screenshot-ui-shot-cast-button:hover, .screenshot-ui-shot-cast-button:focus { background-color: #464b5d; } .screenshot-ui-shot-cast-button:active { - background-color: #fafafa; } + background-color: #f0f0f0; } .screenshot-ui-shot-cast-button:checked { background-color: white; color: black; } @@ -1424,12 +1538,12 @@ StScrollBar { .screenshot-ui-area-selector-handle { border-radius: 99px; background-color: white; - box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.2); + box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.1); width: 24px; height: 24px; } .screenshot-ui-window-selector { - background-color: #272a34; } + background-color: #323643; } .screenshot-ui-window-selector .screenshot-ui-window-selector-window-container { margin: 100px; } .screenshot-ui-window-selector:primary-monitor .screenshot-ui-window-selector-window-container { @@ -1479,15 +1593,19 @@ StScrollBar { /* Top Bar */ #panel { - background-color: #000; + background-color: red; font-weight: bold; height: 2.2em; - transition-duration: 250ms; } + transition-duration: 250ms; + box-shadow: inset 0 -1px 0 0 #f50000; } #panel.unlock-screen, #panel.login-screen, #panel:overview { - background-color: transparent; } + background-color: transparent; + box-shadow: none; } + #panel.unlock-screen .panel-button, #panel.login-screen .panel-button, #panel:overview .panel-button { + color: white !important; } #panel .panel-button { font-weight: bold; - color: white; + color: #5c616c; -natural-hpadding: 12px; -minimum-hpadding: 6px; transition-duration: 150ms; @@ -1508,31 +1626,31 @@ StScrollBar { #panel .panel-button.screen-recording-indicator StIcon, #panel .panel-button.screen-sharing-indicator StIcon { icon-size: 1.09em; } #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.2); } #panel .panel-button:active.clock-display, #panel .panel-button:overview.clock-display, #panel .panel-button:focus.clock-display, #panel .panel-button:checked.clock-display { box-shadow: none; } #panel .panel-button:active.clock-display .clock, #panel .panel-button:overview.clock-display .clock, #panel .panel-button:focus.clock-display .clock, #panel .panel-button:checked.clock-display .clock { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.2); } #panel .panel-button:active.screen-recording-indicator, #panel .panel-button:overview.screen-recording-indicator, #panel .panel-button:focus.screen-recording-indicator, #panel .panel-button:checked.screen-recording-indicator { box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.85); } #panel .panel-button:active.screen-sharing-indicator, #panel .panel-button:overview.screen-sharing-indicator, #panel .panel-button:focus.screen-sharing-indicator, #panel .panel-button:checked.screen-sharing-indicator { box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.85); } #panel .panel-button:hover { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.15); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.15); } #panel .panel-button:hover.clock-display { box-shadow: none; } #panel .panel-button:hover.clock-display .clock { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.15); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.15); } #panel .panel-button:hover.screen-recording-indicator { box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.9); } #panel .panel-button:hover.screen-sharing-indicator { box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.9); } #panel .panel-button:active:hover, #panel .panel-button:overview:hover, #panel .panel-button:focus:hover, #panel .panel-button:checked:hover { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.25); } #panel .panel-button:active:hover.clock-display, #panel .panel-button:overview:hover.clock-display, #panel .panel-button:focus:hover.clock-display, #panel .panel-button:checked:hover.clock-display { box-shadow: none; } #panel .panel-button:active:hover.clock-display .clock, #panel .panel-button:overview:hover.clock-display .clock, #panel .panel-button:focus:hover.clock-display .clock, #panel .panel-button:checked:hover.clock-display .clock { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.25); } #panel .panel-button:active:hover.screen-recording-indicator, #panel .panel-button:overview:hover.screen-recording-indicator, #panel .panel-button:focus:hover.screen-recording-indicator, #panel .panel-button:checked:hover.screen-recording-indicator { box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.8); } #panel .panel-button:active:hover.screen-sharing-indicator, #panel .panel-button:overview:hover.screen-sharing-indicator, #panel .panel-button:focus:hover.screen-sharing-indicator, #panel .panel-button:checked:hover.screen-sharing-indicator { @@ -1615,7 +1733,7 @@ StScrollBar { .quick-settings { padding: 18px; border-radius: 36px; } - .quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button, .quick-settings .login-dialog-button { + .quick-settings .icon-button, .quick-settings .login-dialog-button.cancel-button, .quick-settings .login-dialog-button.switch-user-button, .quick-settings .login-dialog-button.login-dialog-session-list-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button { padding: 10.5px; } .quick-settings-grid { @@ -1652,7 +1770,7 @@ StScrollBar { color: rgba(255, 255, 255, 0.5); } .quick-toggle > StBoxLayout { spacing: 9px; } - .quick-toggle.button, .quick-toggle.login-dialog-button, .quick-toggle.icon-button, .background-app-item .quick-toggle.close-button { + .quick-toggle.button, .quick-toggle.icon-button, .quick-toggle.login-dialog-button.cancel-button, .quick-toggle.login-dialog-button.switch-user-button, .quick-toggle.login-dialog-button.login-dialog-session-list-button, .background-app-item .quick-toggle.close-button { padding: 0; } .quick-toggle > StBoxLayout { padding: 0 12px; } @@ -1673,8 +1791,12 @@ StScrollBar { max-width: auto; } .quick-menu-toggle .quick-toggle:ltr { border-radius: 99px 0 0 99px; } + .quick-menu-toggle .quick-toggle:ltr > StBoxLayout { + padding-right: 9px; } .quick-menu-toggle .quick-toggle:rtl { border-radius: 0 99px 99px 0; } + .quick-menu-toggle .quick-toggle:rtr > StBoxLayout { + padding-left: 9px; } .quick-menu-toggle .quick-toggle:ltr:last-child { border-radius: 99px; } .quick-menu-toggle .quick-toggle:rtl:last-child { @@ -1722,10 +1844,10 @@ StScrollBar { .quick-slider .slider-bin:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dce5f3; + background-color: #dbe3f2; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } .quick-slider .slider-bin:focus:hover { - background-color: #e3ecfa; + background-color: #e2eaf8; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } .quick-slider .slider-bin:focus:active { background-color: #e9f1ff; @@ -1736,29 +1858,35 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; + background-color: #ffffff !important; + color: #5c616c !important; border-radius: 24px; padding: 12px; margin: 12px 18px 0; } .quick-toggle-menu:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .quick-toggle-menu:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .quick-toggle-menu:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dce5f3; + background-color: #dbe3f2; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } .quick-toggle-menu:focus:hover { - background-color: #e3ecfa; + background-color: #e2eaf8; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } .quick-toggle-menu:focus:active { background-color: #e9f1ff; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .quick-toggle-menu:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .quick-toggle-menu .popup-menu-item > StIcon { -st-icon-style: symbolic; } .quick-toggle-menu .header { @@ -1771,7 +1899,8 @@ StScrollBar { padding: 9px; background-color: rgba(92, 97, 108, 0.2); } .quick-toggle-menu .header .icon.active { - background-color: #2777ff; } + background-color: #2777ff; + color: #ffffff; } .quick-settings-system-item > StBoxLayout { spacing: 12px; } @@ -1782,7 +1911,7 @@ StScrollBar { .quick-settings-system-item .power-item:insensitive { transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; background-color: transparent; } .nm-network-item .wireless-secure-icon { @@ -1791,7 +1920,7 @@ StScrollBar { .bt-device-item .popup-menu-icon { -st-icon-style: symbolic; } -.bt-menu-placeholder { +.bt-menu-placeholder.popup-menu-item { text-align: center; padding: 2em 4em; } @@ -1829,7 +1958,7 @@ StScrollBar { spacing: 6px; } .window-close, .screenshot-ui-close-button { - background-color: rgba(63, 68, 84, 0.98); + background-color: rgba(65, 70, 87, 0.98); color: white; border-radius: 99px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1); @@ -1840,14 +1969,14 @@ StScrollBar { .window-close StIcon, .screenshot-ui-close-button StIcon { icon-size: 24px; } .window-close:hover, .screenshot-ui-close-button:hover { - background-color: rgba(78, 84, 104, 0.98); } + background-color: rgba(81, 87, 107, 0.98); } .window-close:active, .screenshot-ui-close-button:active { - background-color: rgba(91, 98, 122, 0.98); } + background-color: rgba(94, 101, 125, 0.98); } .workspace-background { border-radius: 30px; background-color: rgba(3, 2, 1, 0); - box-shadow: 0 4px 16px 4px rgba(0, 0, 0, 0.3); } + box-shadow: 0 4px 16px 4px rgba(0, 0, 0, 0.1); } .search-entry { border-radius: 99px; @@ -1873,10 +2002,9 @@ StScrollBar { background-color: transparent; } .search-section-content { - background-color: #323643; - border-radius: 24px; - box-shadow: inset 0 0 0 1px solid rgba(255, 255, 255, 0.8); + background-color: #3d3f48; color: white; + border-radius: 24px; padding: 12px; margin: 0 12px; } @@ -1903,6 +2031,9 @@ StScrollBar { border: 2px solid rgba(39, 119, 255, 0.8); background-color: rgba(39, 119, 255, 0.2); } +.search-statustext { + color: rgba(255, 255, 255, 0.8); } + .grid-search-results { spacing: 30px; margin: 0 12px; } @@ -1929,7 +2060,7 @@ StScrollBar { spacing: 12px; } .list-search-result .list-search-result-description { - color: #97999f; } + color: #989aa1; } /* Dash */ #dash { @@ -1945,7 +2076,7 @@ StScrollBar { margin-bottom: 14px; } .dash-background { - background-color: #323643; + background-color: #3d3f48; border-radius: 28px; padding: 12px; spacing: 6px; @@ -1969,7 +2100,7 @@ StScrollBar { .dash-item-container .show-apps .overview-icon { background-color: transparent; } .dash-item-container .show-apps:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .dash-item-container .show-apps:selected .overview-icon, .dash-item-container .show-apps:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .dash-item-container .show-apps:selected .overview-icon:hover .overview-icon, .dash-item-container .show-apps:focus .overview-icon:hover .overview-icon { @@ -1989,12 +2120,13 @@ StScrollBar { background-color: rgba(39, 119, 255, 0.2); } .dash-item-container .show-apps, .dash-item-container .app-well-app, .dash-item-container .grid-search-result { - padding-bottom: 12px; } + padding-bottom: 12px; + color: white; } .dash-separator { width: 1px; margin: 0 4px; - background-color: #d9d9d9; + background-color: rgba(255, 255, 255, 0.1); margin-bottom: 12px; } .dash-label { @@ -2017,7 +2149,7 @@ StScrollBar { .app-well-app .overview-icon, .grid-search-result .overview-icon { background-color: transparent; } .app-well-app:hover .overview-icon, .grid-search-result:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app:selected .overview-icon, .grid-search-result:selected .overview-icon, .app-well-app:focus .overview-icon, .grid-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .app-well-app:selected .overview-icon:hover .overview-icon, .grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app:focus .overview-icon:hover .overview-icon, .grid-search-result:focus .overview-icon:hover .overview-icon { @@ -2037,30 +2169,31 @@ StScrollBar { background-color: rgba(39, 119, 255, 0.2); } .app-well-app .overview-icon, .grid-search-result .overview-icon { padding: 12px; - border-radius: 24px; } + border-radius: 24px; + color: white; } .app-well-app .overview-icon.overview-icon-with-label > StBoxLayout, .grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout { spacing: 6px; } .app-well-app.app-folder, .app-folder.grid-search-result { transition-duration: 400ms; } .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon { - background-color: rgba(92, 97, 108, 0.07); } + background-color: rgba(255, 255, 255, 0.07); } .app-well-app.app-folder:hover .overview-icon, .app-folder.grid-search-result:hover .overview-icon { - background-color: rgba(92, 97, 108, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon, .app-folder.grid-search-result:selected .overview-icon, .app-well-app.app-folder:focus .overview-icon, .app-folder.grid-search-result:focus .overview-icon { - background-color: rgba(92, 97, 108, 0.13); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon:hover .overview-icon, .app-folder.grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app.app-folder:focus .overview-icon:hover .overview-icon, .app-folder.grid-search-result:focus .overview-icon:hover .overview-icon { - background-color: rgba(92, 97, 108, 0.16); } + background-color: rgba(255, 255, 255, 0.16); } .app-well-app.app-folder:selected .overview-icon:active .overview-icon, .app-folder.grid-search-result:selected .overview-icon:active .overview-icon, .app-well-app.app-folder:focus .overview-icon:active .overview-icon, .app-folder.grid-search-result:focus .overview-icon:active .overview-icon { - background-color: rgba(92, 97, 108, 0.13); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:active .overview-icon, .app-folder.grid-search-result:active .overview-icon { - background-color: rgba(92, 97, 108, 0.16); } + background-color: rgba(255, 255, 255, 0.16); } .app-well-app.app-folder:outlined .overview-icon, .app-folder.grid-search-result:outlined .overview-icon, .app-well-app.app-folder:checked .overview-icon, .app-folder.grid-search-result:checked .overview-icon { - background-color: rgba(92, 97, 108, 0.19); } + background-color: rgba(255, 255, 255, 0.19); } .app-well-app.app-folder:outlined .overview-icon:active .overview-icon, .app-folder.grid-search-result:outlined .overview-icon:active .overview-icon, .app-well-app.app-folder:checked .overview-icon:active .overview-icon, .app-folder.grid-search-result:checked .overview-icon:active .overview-icon { - background-color: rgba(92, 97, 108, 0.22); } + background-color: rgba(255, 255, 255, 0.22); } .app-well-app.app-folder:outlined .overview-icon:hover .overview-icon, .app-folder.grid-search-result:outlined .overview-icon:hover .overview-icon, .app-well-app.app-folder:checked .overview-icon:hover .overview-icon, .app-folder.grid-search-result:checked .overview-icon:hover .overview-icon { - background-color: rgba(92, 97, 108, 0.25); } + background-color: rgba(255, 255, 255, 0.25); } .app-well-app.app-folder:drop .overview-icon, .app-folder.grid-search-result:drop .overview-icon { border: 2px solid rgba(39, 119, 255, 0.8); background-color: rgba(39, 119, 255, 0.2); } @@ -2127,7 +2260,7 @@ StScrollBar { padding: 0; } .system-action-icon { - background-color: rgba(0, 0, 0, 0.8); + background-color: rgba(255, 255, 255, 0.1); color: white; border-radius: 99px; icon-size: 48px; } @@ -2153,6 +2286,8 @@ StScrollBar { width: 24px; height: 24px; border-radius: 99px; } + .page-navigation-arrow > StIcon { + color: white; } .page-navigation-arrow:insensitive { transition-duration: 100ms; background-color: transparent; @@ -2167,11 +2302,11 @@ StScrollBar { .page-navigation-arrow:hover { transition-duration: 100ms; color: white; - background-color: rgba(102, 105, 115, 0.545); } + background-color: rgba(94, 97, 106, 0.55); } .page-navigation-arrow:active { transition-duration: 100ms; color: white; - background-color: rgba(117, 120, 131, 0.545); } + background-color: rgba(87, 89, 98, 0.55); } /* Workspace pager */ .workspace-thumbnails { @@ -2180,7 +2315,7 @@ StScrollBar { padding: 6px; } .workspace-thumbnails .workspace-thumbnail { color: white; - background-color: #3d4251; + background-color: #484d60; border-radius: 4px; border: 1px solid transparent; } .workspace-thumbnails .placeholder { @@ -2236,7 +2371,7 @@ StScrollBar { background-color: white; } .hidden { - color: rgba(0, 0, 0, 0); } + color: transparent; } .caps-lock-warning-label { text-align: center; @@ -2245,7 +2380,7 @@ StScrollBar { /* Workspace animation */ .workspace-animation { - background-color: #272a34; } + background-color: #323643; } /* Tiled window previews */ .tile-preview { @@ -2416,11 +2551,10 @@ StScrollBar { /* Looking Glass */ #LookingGlassDialog { - background-color: rgba(255, 255, 255, 0.95); + background-color: rgba(48, 51, 64, 0.98); + color: white; border-radius: 0 0 16px 16px; - border: 1px solid rgba(255, 255, 255, 0.8); border-top-width: 0; - color: #5c616c; padding: 6px; spacing: 6px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1); } @@ -2459,11 +2593,11 @@ StScrollBar { color: #0047c0; } .lg-dialog .actor-link { - color: #aeb0b6; } + color: #9da0a7; } .lg-dialog .actor-link:hover { - color: #e4e4e6; } + color: #d3d4d7; } .lg-dialog .actor-link:active { - color: #787c86; } + color: #696d75; } .lg-dialog .actor-link StIcon { icon-size: 12px; } @@ -2493,26 +2627,30 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; } + background-color: #efeff0; } .lg-extension:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .lg-extension:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .lg-extension:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dce5f3; + background-color: #dbe3f2; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6) !important; } .lg-extension:focus:hover { - background-color: #e3ecfa; + background-color: #e2eaf8; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } .lg-extension:focus:active { background-color: #e9f1ff; box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7) !important; } + .lg-extension:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .lg-extension-meta { spacing: 6px; } @@ -2524,13 +2662,13 @@ StScrollBar { padding: 6px; } .lg-debug-flag-button { - color: #5c616c; } + color: white; } .lg-debug-flag-button StLabel { padding: 6px, 12px; } .lg-debug-flag-button:hover { - color: #8f949f; } + color: white; } .lg-debug-flag-button:active { - color: #2d3035; } + color: #cccccc; } .lg-debug-flags-header { padding-top: 12px; @@ -2544,7 +2682,7 @@ StScrollBar { /* Login Dialog */ .login-dialog { - background-color: #272a34; } + background-color: #323643; } .login-dialog-button.cancel-button { padding: 9px; } @@ -2653,7 +2791,7 @@ StScrollBar { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6); } #lockDialogGroup { - background-color: #272a34; } + background-color: #323643; } .unlock-dialog-clock { color: white; @@ -2794,7 +2932,8 @@ StScrollBar { /* Top Bar */ #panel { background: rgba(255, 255, 255, 0.8); - text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } + text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); + box-shadow: none; } #panel StIcon { icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #panel.unlock-screen, #panel.login-screen, #panel.lock-screen, #panel:overview { @@ -2877,7 +3016,7 @@ StScrollBar { .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon { background-color: rgba(255, 255, 255, 0.07); } .app-well-app.app-folder:hover .overview-icon, .app-folder.grid-search-result:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon, .app-folder.grid-search-result:selected .overview-icon, .app-well-app.app-folder:focus .overview-icon, .app-folder.grid-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon:hover .overview-icon, .app-folder.grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app.app-folder:focus .overview-icon:hover .overview-icon, .app-folder.grid-search-result:focus .overview-icon:hover .overview-icon { diff --git a/share/themes/Kali-Light/gtk-3.0/gtk-dark.css b/share/themes/Kali-Light/gtk-3.0/gtk-dark.css index b8764198..a519ae76 100644 --- a/share/themes/Kali-Light/gtk-3.0/gtk-dark.css +++ b/share/themes/Kali-Light/gtk-3.0/gtk-dark.css @@ -581,7 +581,7 @@ button { notebook > header > tabs > arrow:disabled, button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -590,7 +590,7 @@ button { button:disabled:active, button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#16181d); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } notebook > header > tabs > arrow.image-button, @@ -877,7 +877,7 @@ button.suggested-action { button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -1023,7 +1023,7 @@ button.destructive-action { button.destructive-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -1186,14 +1186,14 @@ stacksidebar row.needs-attention > label, .stack-switcher > button.needs-attenti -gtk-icon-shadow: none; } .inline-toolbar toolbutton > button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:disabled:active, .inline-toolbar toolbutton > button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#16181d); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:backdrop { @@ -1840,7 +1840,7 @@ headerbar { .selection-mode .titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode.titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode headerbar button.suggested-action:disabled, headerbar.selection-mode button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -2702,7 +2702,7 @@ switch { border: 1px solid #00215a; } switch:disabled slider { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -3160,7 +3160,7 @@ scale { border-color: #00348d; } scale slider:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -4271,7 +4271,7 @@ infobar { -gtk-icon-shadow: none; } infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; diff --git a/share/themes/Kali-Light/gtk-3.0/gtk.css b/share/themes/Kali-Light/gtk-3.0/gtk.css index 343395ca..70137683 100644 --- a/share/themes/Kali-Light/gtk-3.0/gtk.css +++ b/share/themes/Kali-Light/gtk-3.0/gtk.css @@ -49,7 +49,7 @@ color: #5c616c; background-color: #e6e6e6; } .gtkstyle-fallback:disabled { - color: #aeb0b6; + color: #9da0a7; background-color: #fdfdfd; } .gtkstyle-fallback:selected { color: #ffffff; @@ -76,7 +76,7 @@ textview text { .view text:disabled, iconview text:disabled, textview text:disabled { - color: #aeb0b6; + color: #9da0a7; background-color: #fdfdfd; } .view:selected:focus, iconview:selected:focus, .view:selected, iconview:selected, .view text:selected:focus, @@ -122,7 +122,7 @@ label { background-color: #2777ff; color: #ffffff; } label:disabled { - color: #aeb0b6; } + color: #9da0a7; } button label:disabled { color: inherit; } label:disabled:backdrop { @@ -266,7 +266,7 @@ entry { border-color: #2777ff; } spinbutton:disabled:not(.vertical), entry:disabled { - color: #aeb0b6; + color: #9da0a7; border-color: #d9d9d9; background-color: #fdfdfd; box-shadow: none; } @@ -580,8 +580,8 @@ button { -gtk-icon-shadow: none; } notebook > header > tabs > arrow:disabled, button:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -589,8 +589,8 @@ button { notebook > header > tabs > arrow:disabled:active, notebook > header > tabs > arrow:disabled:checked, button:disabled:active, button:disabled:checked { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#eaeaea); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } notebook > header > tabs > arrow.image-button, @@ -879,8 +879,8 @@ button.suggested-action { color: rgba(39, 119, 255, 0.8); } button.suggested-action:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -1025,8 +1025,8 @@ button.destructive-action { color: rgba(212, 25, 25, 0.8); } button.destructive-action:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -1188,15 +1188,15 @@ stacksidebar row.needs-attention > label, .stack-switcher > button.needs-attenti text-shadow: none; -gtk-icon-shadow: none; } .inline-toolbar toolbutton > button:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:disabled:active, .inline-toolbar toolbutton > button:disabled:checked { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#eaeaea); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:backdrop { @@ -1438,7 +1438,7 @@ spinbutton { color: #5c616c; background-color: rgba(92, 97, 108, 0.05); } spinbutton:not(.vertical) button:disabled { - color: rgba(174, 176, 182, 0.3); + color: rgba(157, 160, 167, 0.3); background-color: transparent; } spinbutton:not(.vertical) button:active { background-color: rgba(0, 0, 0, 0.1); @@ -1513,7 +1513,7 @@ spinbutton { .osd spinbutton:not(.vertical) button:dir(rtl):first-child { border-radius: 4px 0 0 4px; } spinbutton.vertical:disabled { - color: #aeb0b6; } + color: #9da0a7; } spinbutton.vertical:backdrop:disabled { color: #d9d9d9; } spinbutton.vertical:drop(active) { @@ -1848,8 +1848,8 @@ headerbar { border-color: #0051da; } .selection-mode .titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode.titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode headerbar button.suggested-action:disabled, headerbar.selection-mode button.suggested-action:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -2024,7 +2024,7 @@ treeview.view { border-left-color: #93bbff; border-top-color: rgba(92, 97, 108, 0.1); } treeview.view:disabled { - color: #aeb0b6; } + color: #9da0a7; } treeview.view:disabled:selected { color: #7dadff; } treeview.view:disabled:selected:backdrop { @@ -2161,7 +2161,7 @@ menubar, color: #005af3; } menubar > menuitem:disabled, .menubar > menuitem:disabled { - color: #aeb0b6; + color: #9da0a7; box-shadow: none; } menubar .csd.popup decoration, .menubar .csd.popup decoration { @@ -2199,7 +2199,7 @@ menu, menu menuitem:disabled, .menu menuitem:disabled, .context-menu menuitem:disabled { - color: #aeb0b6; } + color: #9da0a7; } menu menuitem:disabled:backdrop, .menu menuitem:disabled:backdrop, .context-menu menuitem:disabled:backdrop { @@ -2671,7 +2671,7 @@ switch { background-color: #2777ff; text-shadow: 0 1px rgba(0, 81, 218, 0.5), 0 0 2px rgba(255, 255, 255, 0.6); } switch:disabled { - color: #aeb0b6; + color: #9da0a7; border-color: #d9d9d9; background-color: #fdfdfd; text-shadow: none; } @@ -2713,8 +2713,8 @@ switch { switch:checked > slider { border: 1px solid #0047c0; } switch:disabled slider { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -3181,8 +3181,8 @@ scale { scale slider:active { border-color: #0051da; } scale slider:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -4014,7 +4014,7 @@ expander title > arrow { expander title > arrow:hover { color: #aaaeb7; } expander title > arrow:disabled { - color: #aeb0b6; } + color: #9da0a7; } expander title > arrow:disabled:backdrop { color: #d9d9d9; } expander title > arrow:checked { @@ -4039,9 +4039,9 @@ calendar { calendar.button:backdrop { color: rgba(174, 176, 182, 0.45); } calendar.button:disabled { - color: rgba(174, 176, 182, 0.45); } + color: rgba(157, 160, 167, 0.45); } calendar.highlight { - color: #aeb0b6; } + color: #9da0a7; } calendar.highlight:backdrop { color: #d9d9d9; } calendar:backdrop { @@ -4144,7 +4144,7 @@ placessidebar row { placessidebar row:selected { color: #ffffff; } placessidebar row:disabled { - color: #aeb0b6; } + color: #9da0a7; } placessidebar row:backdrop { color: #aeb0b6; } placessidebar row:backdrop:selected { @@ -4292,8 +4292,8 @@ infobar { text-shadow: none; -gtk-icon-shadow: none; } infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -4766,7 +4766,7 @@ row.expander { row.expander:checked image.expander-row-arrow:not(:disabled) { color: #2777ff; } row.expander image.expander-row-arrow:disabled { - color: #aeb0b6; } + color: #9da0a7; } flap > dimming, deck > dimming, @@ -6461,7 +6461,7 @@ wnck-pager { color: #5c616c; font-weight: normal; } .budgie-popover:not(.budgie-menu) button.flat:not(.image-button):disabled { - color: #aeb0b6; } + color: #9da0a7; } .budgie-popover.budgie-menu .container { padding: 0; } .budgie-popover.user-menu .container { @@ -6757,7 +6757,7 @@ base background color of insensitive widgets */ @define-color insensitive_bg_color #fdfdfd; /* text foreground color of insensitive widgets */ -@define-color insensitive_fg_color #aeb0b6; +@define-color insensitive_fg_color #9da0a7; /* insensitive text widgets and the like base background color */ @define-color insensitive_base_color #fafafa; diff --git a/share/themes/Kali-Light/gtk-4.0/gtk-dark.css b/share/themes/Kali-Light/gtk-4.0/gtk-dark.css index 5c13f7aa..34c2d8d4 100644 --- a/share/themes/Kali-Light/gtk-4.0/gtk-dark.css +++ b/share/themes/Kali-Light/gtk-4.0/gtk-dark.css @@ -526,14 +526,14 @@ button { notebook > header > tabs > arrow:disabled, button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); -gtk-icon-filter: opacity(0.5); } notebook > header > tabs > arrow:disabled:active, notebook > header > tabs > arrow:disabled:checked, button:disabled:active, button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#1a1c23); box-shadow: none; } button.sidebar-button, notebook > header > tabs > arrow, windowcontrols button, notebook > header > tabs > arrow.flat, @@ -746,7 +746,7 @@ button.suggested-action { button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } button.suggested-action:disabled:active, @@ -831,7 +831,7 @@ button.destructive-action { button.destructive-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } button.destructive-action:disabled:active, @@ -1014,7 +1014,7 @@ modelbutton.flat arrow { box-shadow: none; } .toolbar button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } .toolbar button:backdrop { color: #888a8d; @@ -2178,7 +2178,7 @@ switch { border: 1px solid #00348d; } switch:disabled > slider { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } row:selected switch { outline-color: rgba(255, 255, 255, 0.3); } @@ -2449,7 +2449,7 @@ progressbar > trough, scale > trough > fill, scale > trough { background-color: #0a0a0d; } progressbar > trough:disabled, scale > trough > fill:disabled, scale > trough:disabled { background-color: #242731; - border-color: #0d0e11; } + border-color: #17191f; } row:selected progressbar > trough, row:selected scale > trough > fill, row:selected scale > trough { outline-color: rgba(255, 255, 255, 0.3); border-color: #00348d; } @@ -2538,7 +2538,7 @@ scale { border-color: #00348d; } scale > trough > slider:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } row:selected scale > trough > slider:disabled, row:selected scale > trough > slider { border-color: #00348d; } diff --git a/share/themes/Kali-Light/gtk-4.0/gtk.css b/share/themes/Kali-Light/gtk-4.0/gtk.css index 6c6dd885..340d9382 100644 --- a/share/themes/Kali-Light/gtk-4.0/gtk.css +++ b/share/themes/Kali-Light/gtk-4.0/gtk.css @@ -29,7 +29,7 @@ textview > text { background-color: #fafafa; } .view:disabled, iconview:disabled, textview > text:disabled { - color: #aeb0b6; + color: #9da0a7; background-color: #fdfdfd; } .view:selected:focus, iconview:selected:focus, .view:selected, iconview:selected, textview > text:selected:focus, @@ -120,7 +120,7 @@ label { background-color: #2777ff; color: #ffffff; } label:disabled { - color: #aeb0b6; } + color: #9da0a7; } button label:disabled { color: inherit; } label.error { @@ -271,7 +271,7 @@ entry { /* We hide placeholders on focus */ } spinbutton.vertical > text:disabled, spinbutton:disabled:not(.vertical), entry:disabled { - color: #aeb0b6; + color: #9da0a7; border-color: #d9d9d9; background-color: #fdfdfd; } spinbutton.vertical > text.error, spinbutton.error:not(.vertical), @@ -525,15 +525,15 @@ button { box-shadow: none; } notebook > header > tabs > arrow:disabled, button:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); -gtk-icon-filter: opacity(0.5); } notebook > header > tabs > arrow:disabled:active, notebook > header > tabs > arrow:disabled:checked, button:disabled:active, button:disabled:checked { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#eaeaea); box-shadow: none; } button.sidebar-button, notebook > header > tabs > arrow, windowcontrols button, notebook > header > tabs > arrow.flat, @@ -748,8 +748,8 @@ button.suggested-action { color: rgba(39, 119, 255, 0.8); } button.suggested-action:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); } button.suggested-action:disabled:active, @@ -833,8 +833,8 @@ button.destructive-action { color: rgba(212, 25, 25, 0.8); } button.destructive-action:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); } button.destructive-action:disabled:active, @@ -988,7 +988,7 @@ modelbutton.flat { modelbutton.flat:hover { background-color: #eaebec; } modelbutton.flat:disabled { - color: #aeb0b6; } + color: #9da0a7; } modelbutton.flat arrow { background: none; @@ -1016,8 +1016,8 @@ modelbutton.flat arrow { background-image: image(#dbdbdb); box-shadow: none; } .toolbar button:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); } .toolbar button:backdrop { color: #aeb0b6; @@ -1186,7 +1186,7 @@ spinbutton { background-color: #f2f2f2; } spinbutton:not(.vertical) > button.image-button.up:not(.flat):disabled, spinbutton:not(.vertical) > button.image-button.down:not(.flat):disabled { - color: rgba(174, 176, 182, 0.3); + color: rgba(157, 160, 167, 0.3); background-color: transparent; } spinbutton:not(.vertical) > button.image-button.up:not(.flat):active, spinbutton:not(.vertical) > button.image-button.down:not(.flat):active { @@ -1241,7 +1241,7 @@ spinbutton { .osd spinbutton:not(.vertical) > button.image-button.down:not(.flat):dir(rtl):first-child { border-radius: 4px 0 0 4px; } spinbutton.vertical:disabled { - color: #aeb0b6; } + color: #9da0a7; } spinbutton.vertical:drop(active) { border-color: transparent; box-shadow: none; } @@ -1607,7 +1607,7 @@ treeview.view { outline-color: rgba(255, 255, 255, 0.8); } columnview.view:disabled, treeview.view:disabled { - color: #aeb0b6; } + color: #9da0a7; } columnview.view:disabled:selected, treeview.view:disabled:selected { color: #7dadff; } @@ -1888,7 +1888,7 @@ menubar { box-shadow: inset 0 -3px #2777ff; color: #005af3; } menubar > item:disabled { - color: #aeb0b6; + color: #9da0a7; box-shadow: none; } menubar > item popover.menu.background > contents { padding: 5px; } @@ -2161,7 +2161,7 @@ switch { border-color: #0051da; background-color: #2777ff; } switch:disabled { - color: #aeb0b6; + color: #9da0a7; border-color: #d9d9d9; background-color: #fdfdfd; text-shadow: none; } @@ -2188,8 +2188,8 @@ switch { switch:checked > slider { border: 1px solid #0051da; } switch:disabled > slider { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); } row:selected switch { outline-color: rgba(255, 255, 255, 0.8); @@ -2467,7 +2467,7 @@ progressbar > trough, scale > trough > fill, scale > trough { background-color: #dedede; } progressbar > trough:disabled, scale > trough > fill:disabled, scale > trough:disabled { background-color: #fdfdfd; - border-color: #d9d9d9; } + border-color: #e6e6e6; } row:selected progressbar > trough, row:selected scale > trough > fill, row:selected scale > trough { outline-color: rgba(255, 255, 255, 0.8); border-color: #0051da; } @@ -2555,8 +2555,8 @@ scale { scale > trough > slider:active { border-color: #0051da; } scale > trough > slider:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); } row:selected scale > trough > slider:disabled, row:selected scale > trough > slider { border-color: #0051da; } @@ -2959,8 +2959,8 @@ progressbar { /* override insensitive that is specific to progress */ border-radius: 1.5px; } progressbar > trough > progress:disabled { - background-color: #aeb0b6; - border-color: #aeb0b6; } + background-color: #9da0a7; + border-color: #9da0a7; } progressbar > trough > progress.left { border-top-left-radius: 5px; border-bottom-left-radius: 5px; } @@ -3239,7 +3239,7 @@ expander { expander:dir(rtl) { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); } expander:disabled { - color: #aeb0b6; } + color: #9da0a7; } expander:checked { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -3426,7 +3426,7 @@ separator.sidebar { .navigation-sidebar > row:selected:hover { background-color: #dddee0; } .navigation-sidebar > row:disabled { - color: #aeb0b6; } + color: #9da0a7; } /**************** * File chooser * @@ -3947,7 +3947,7 @@ row.expander { row.expander:checked image.expander-row-arrow:not(:disabled) { color: #2777ff; } row.expander image.expander-row-arrow:disabled { - color: #aeb0b6; } + color: #9da0a7; } flap > dimming, deck > dimming, @@ -4868,7 +4868,7 @@ base background color of insensitive widgets */ @define-color insensitive_bg_color #fdfdfd; /* text foreground color of insensitive widgets */ -@define-color insensitive_fg_color #aeb0b6; +@define-color insensitive_fg_color #9da0a7; /* insensitive text widgets and the like base background color */ @define-color insensitive_base_color #fafafa; diff --git a/share/themes/Kali-Purple-Dark/gnome-shell/gnome-shell.css b/share/themes/Kali-Purple-Dark/gnome-shell/gnome-shell.css index 78b801e1..f47790e1 100644 --- a/share/themes/Kali-Purple-Dark/gnome-shell/gnome-shell.css +++ b/share/themes/Kali-Purple-Dark/gnome-shell/gnome-shell.css @@ -23,120 +23,118 @@ stage { color: #eeeeec; } /* Common Stylings */ -.screenshot-ui-panel, .workspace-switcher, .switcher-list, .resize-popup, .osd-monitor-label, .osd-window { - color: white; - background-color: #303340; - border: 1px solid rgba(255, 255, 255, 0.1); - border-radius: 999px; - padding: 12px; } - .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon, .app-well-app .overview-icon, .grid-search-result .overview-icon, .dash-item-container .show-apps .overview-icon, .list-search-result, .search-provider-icon, .switcher-list .item-box { border-radius: 16px; padding: 6px; spacing: 6px; border: 2px solid transparent; transition-duration: 200ms; - text-align: center; } + text-align: center; + color: inherit; } -#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .login-dialog-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { +#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { border-radius: 8px; border-style: solid; border-width: 1px; font-weight: bold; - padding: 3px 24px; + padding: 3px 24px; } + +.app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { transition-duration: 100ms; color: #eeeeec; background-color: #35373f; } - #LookingGlassDialog .notebook-tab:focus, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus, .app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .login-dialog-button:focus, .icon-button:focus, .background-app-item .close-button:focus { + .app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .icon-button:focus, .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .close-button:focus { transition-duration: 100ms; color: #eeeeec; background-color: #403249; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } - #LookingGlassDialog .notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:hover, .app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .login-dialog-button:focus:hover, .icon-button:focus:hover, .background-app-item .close-button:focus:hover { + .app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .icon-button:focus:hover, .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .close-button:focus:hover { background-color: #463851; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - #LookingGlassDialog .notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:active, .app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .login-dialog-button:focus:active, .icon-button:focus:active, .background-app-item .close-button:focus:active { + .app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .icon-button:focus:active, .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .close-button:focus:active { background-color: #4d3f58; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - #LookingGlassDialog .notebook-tab:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:hover, .app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .login-dialog-button:hover, .icon-button:hover, .background-app-item .close-button:hover { + .app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .icon-button:hover, .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .close-button:hover { transition-duration: 100ms; color: #eeeeec; background-color: #3c3e47; } - #LookingGlassDialog .notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .lg-toolbar-button:insensitive, .app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .login-dialog-button:insensitive, .icon-button:insensitive, .background-app-item .close-button:insensitive { + .app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .icon-button:insensitive, .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .close-button:insensitive { transition-duration: 100ms; color: rgba(238, 238, 236, 0.5); background-color: rgba(238, 238, 236, 0.05); } - #LookingGlassDialog .notebook-tab:selected, #LookingGlassDialog > #Toolbar .lg-toolbar-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .login-dialog-button:selected, .icon-button:selected, .background-app-item .close-button:selected, #LookingGlassDialog .notebook-tab:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:active, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .login-dialog-button:active, .icon-button:active, .background-app-item .close-button:active { + .app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .icon-button:selected, .login-dialog-button.cancel-button:selected, .login-dialog-button.switch-user-button:selected, .login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .close-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .icon-button:active, .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active, .background-app-item .close-button:active { + transition-duration: 100ms; + color: #eeeeec; + background-color: #434650; } + .app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .icon-button:checked, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .close-button:checked { transition-duration: 100ms; color: #eeeeec; background-color: #4a4d58; } - #LookingGlassDialog .notebook-tab:checked, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked, .app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .login-dialog-button:checked, .icon-button:checked, .background-app-item .close-button:checked { - transition-duration: 100ms; - color: #eeeeec; - background-color: #4a4d58; } - #LookingGlassDialog .notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:hover, .app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .login-dialog-button:checked:hover, .icon-button:checked:hover, .background-app-item .close-button:checked:hover { + .app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .icon-button:checked:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .close-button:checked:hover { background-color: #515460; } - #LookingGlassDialog .notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:active, .app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .login-dialog-button:checked:active, .icon-button:checked:active, .background-app-item .close-button:checked:active { + .app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .icon-button:checked:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .close-button:checked:active { background-color: #585b69; } - #LookingGlassDialog .flat.notebook-tab, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button, .app-folder-dialog .folder-name-container .flat.edit-folder-button, .flat.button, .flat.login-dialog-button, .flat.icon-button, .background-app-item .flat.close-button { + .app-folder-dialog .folder-name-container .flat.edit-folder-button, .flat.button, .flat.icon-button, .flat.login-dialog-button.cancel-button, .flat.login-dialog-button.switch-user-button, .flat.login-dialog-button.login-dialog-session-list-button, .background-app-item .flat.close-button { transition-duration: 100ms; color: #eeeeec; background-color: #35373f; background-color: transparent; } - #LookingGlassDialog .flat.notebook-tab:focus, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .flat.login-dialog-button:focus, .flat.icon-button:focus, .background-app-item .flat.close-button:focus { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .flat.icon-button:focus, .flat.login-dialog-button.cancel-button:focus, .flat.login-dialog-button.switch-user-button:focus, .flat.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .flat.close-button:focus { transition-duration: 100ms; color: #eeeeec; background-color: #403249; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } - #LookingGlassDialog .flat.notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .flat.login-dialog-button:focus:hover, .flat.icon-button:focus:hover, .background-app-item .flat.close-button:focus:hover { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .flat.icon-button:focus:hover, .flat.login-dialog-button.cancel-button:focus:hover, .flat.login-dialog-button.switch-user-button:focus:hover, .flat.login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .flat.close-button:focus:hover { background-color: #463851; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - #LookingGlassDialog .flat.notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .flat.login-dialog-button:focus:active, .flat.icon-button:focus:active, .background-app-item .flat.close-button:focus:active { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .flat.icon-button:focus:active, .flat.login-dialog-button.cancel-button:focus:active, .flat.login-dialog-button.switch-user-button:focus:active, .flat.login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .flat.close-button:focus:active { background-color: #4d3f58; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - #LookingGlassDialog .flat.notebook-tab:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .flat.login-dialog-button:hover, .flat.icon-button:hover, .background-app-item .flat.close-button:hover { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .flat.icon-button:hover, .flat.login-dialog-button.cancel-button:hover, .flat.login-dialog-button.switch-user-button:hover, .flat.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .flat.close-button:hover { transition-duration: 100ms; color: #eeeeec; background-color: #3c3e47; } - #LookingGlassDialog .flat.notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:insensitive, .app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .flat.login-dialog-button:insensitive, .flat.icon-button:insensitive, .background-app-item .flat.close-button:insensitive { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .flat.icon-button:insensitive, .flat.login-dialog-button.cancel-button:insensitive, .flat.login-dialog-button.switch-user-button:insensitive, .flat.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .flat.close-button:insensitive { transition-duration: 100ms; color: rgba(238, 238, 236, 0.5); background-color: rgba(238, 238, 236, 0.05); } - #LookingGlassDialog .flat.notebook-tab:selected, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .flat.login-dialog-button:selected, .flat.icon-button:selected, .background-app-item .flat.close-button:selected, #LookingGlassDialog .flat.notebook-tab:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .flat.login-dialog-button:active, .flat.icon-button:active, .background-app-item .flat.close-button:active { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .flat.icon-button:selected, .flat.login-dialog-button.cancel-button:selected, .flat.login-dialog-button.switch-user-button:selected, .flat.login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .flat.close-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .flat.icon-button:active, .flat.login-dialog-button.cancel-button:active, .flat.login-dialog-button.switch-user-button:active, .flat.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .flat.close-button:active { + transition-duration: 100ms; + color: #eeeeec; + background-color: #434650; } + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .flat.icon-button:checked, .flat.login-dialog-button.cancel-button:checked, .flat.login-dialog-button.switch-user-button:checked, .flat.login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .flat.close-button:checked { transition-duration: 100ms; color: #eeeeec; background-color: #4a4d58; } - #LookingGlassDialog .flat.notebook-tab:checked, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .flat.login-dialog-button:checked, .flat.icon-button:checked, .background-app-item .flat.close-button:checked { - transition-duration: 100ms; - color: #eeeeec; - background-color: #4a4d58; } - #LookingGlassDialog .flat.notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .flat.login-dialog-button:checked:hover, .flat.icon-button:checked:hover, .background-app-item .flat.close-button:checked:hover { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .flat.icon-button:checked:hover, .flat.login-dialog-button.cancel-button:checked:hover, .flat.login-dialog-button.switch-user-button:checked:hover, .flat.login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .flat.close-button:checked:hover { background-color: #515460; } - #LookingGlassDialog .flat.notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .flat.login-dialog-button:checked:active, .flat.icon-button:checked:active, .background-app-item .flat.close-button:checked:active { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .flat.icon-button:checked:active, .flat.login-dialog-button.cancel-button:checked:active, .flat.login-dialog-button.switch-user-button:checked:active, .flat.login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .flat.close-button:checked:active { background-color: #585b69; } -.lg-dialog StEntry, StEntry { +.login-dialog-prompt-entry, .search-entry, .lg-dialog StEntry, StEntry { border-radius: 8px; padding: 9px 9px; - color: #eeeeec; selection-background-color: #a400a4; - selected-color: #ffffff; + selected-color: #ffffff; } + +StEntry { transition-duration: 100ms; - background-color: rgba(238, 238, 236, 0.1); + background-color: rgba(238, 238, 236, 0.15); color: rgba(238, 238, 236, 0.7); } StEntry:hover { transition-duration: 100ms; - background-color: rgba(238, 238, 236, 0.2); - color: inherit; } + background-color: rgba(238, 238, 236, 0.25); } StEntry:focus { transition-duration: 100ms; - background-color: rgba(214, 162, 213, 0.24); - box-shadow: inset 0 0 0 2px #a400a4; + background-color: rgba(218, 174, 217, 0.2875); + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7); color: #eeeeec; } StEntry:insensitive { transition-duration: 100ms; - background-color: rgba(136, 138, 141, 0.2); - color: #888a8d; } + background-color: rgba(238, 238, 236, 0.25); + color: rgba(238, 238, 236, 0.5); } + StEntry StLabel.hint-text { + color: rgba(238, 238, 236, 0.7); } .modal-dialog .modal-dialog-linked-button, .hotplug-notification-item, .notification-banner .notification-button { padding: 12px; @@ -170,7 +168,7 @@ stage { .modal-dialog .modal-dialog-linked-button:active, .hotplug-notification-item:active, .notification-banner .notification-button:active { transition-duration: 100ms; color: #eeeeec; - background-color: #545866; } + background-color: #4d505e; } .modal-dialog .modal-dialog-linked-button:checked, .hotplug-notification-item:checked, .notification-banner .notification-button:checked { transition-duration: 100ms; color: #eeeeec; @@ -194,60 +192,9 @@ stage { margin-left: 0 !important; margin-right: 0 !important; } -.screenshot-ui-show-pointer-button, .screenshot-ui-type-button { - transition-duration: 100ms; - background-color: transparent; - background-color: none; - box-shadow: none; } - .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { - transition-duration: 100ms; - color: rgba(238, 238, 236, 0.5); - background-color: rgba(238, 238, 236, 0.05); - background-color: transparent; - color: rgba(255, 255, 255, 0.5); } - .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { - transition-duration: 100ms; - background-color: transparent; - background-color: none; - box-shadow: none; } - .screenshot-ui-show-pointer-button:insensitive:insensitive, .screenshot-ui-type-button:insensitive:insensitive { - transition-duration: 100ms; - color: rgba(238, 238, 236, 0.5); - background-color: rgba(238, 238, 236, 0.05); - background-color: transparent; - color: rgba(255, 255, 255, 0.5); } - .screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { - transition-duration: 100ms; - color: white; - background-color: #4c3f59; - box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } - .screenshot-ui-show-pointer-button:focus:hover, .screenshot-ui-type-button:focus:hover { - background-color: #524661; - box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - .screenshot-ui-show-pointer-button:focus:active, .screenshot-ui-type-button:focus:active { - background-color: #584c68; - box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover { - transition-duration: 100ms; - color: white; - background-color: #494d59; } - .screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active { - transition-duration: 100ms; - color: white; - background-color: #575c6a; } - .screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked { - transition-duration: 100ms; - color: white; - background-color: #575c6a; } - .screenshot-ui-show-pointer-button:outlined:hover, .screenshot-ui-type-button:outlined:hover, .screenshot-ui-show-pointer-button:checked:hover, .screenshot-ui-type-button:checked:hover { - background-color: #5d6373; } - .screenshot-ui-show-pointer-button:outlined:active, .screenshot-ui-type-button:outlined:active, .screenshot-ui-show-pointer-button:checked:active, .screenshot-ui-type-button:checked:active { - background-color: #646a7b; } - .dash-label, .window-caption { - background-color: #303340; + background-color: rgba(0, 0, 0, 0.9); color: white; - border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 99px; padding: 6px 12px; text-align: center; } @@ -265,7 +212,7 @@ stage { font-weight: 700; font-size: 15pt; } -.bt-menu-placeholder, .message-dialog-content .message-dialog-title.lightweight, .headline { +.bt-menu-placeholder.popup-menu-item, .message-dialog-content .message-dialog-title.lightweight, .headline { font-weight: 700; font-size: 13pt; } @@ -290,6 +237,148 @@ stage { .unlock-dialog-clock .unlock-dialog-clock-time, #panel, .weather-button .weather-forecast-time, .world-clocks-button .world-clocks-timezone, .world-clocks-button .world-clocks-time, .events-button .event-time, .calendar .calendar-day-base { font-feature-settings: "tnum"; } +/* OSD Elements */ +#LookingGlassDialog, .screenshot-ui-panel, .workspace-switcher, .switcher-list, .resize-popup, .osd-monitor-label, .osd-window { + color: white; + background-color: #303340; + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 999px; + padding: 12px; } + +.lg-dialog StEntry { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.7); } + .lg-dialog StEntry:hover { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); } + .lg-dialog StEntry:focus { + transition-duration: 100ms; + background-color: rgba(231, 186, 231, 0.2875); + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7); + color: white; } + .lg-dialog StEntry:insensitive { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); + color: rgba(255, 255, 255, 0.5); } + .lg-dialog StEntry StLabel.hint-text { + color: rgba(255, 255, 255, 0.7); } + +#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button { + transition-duration: 100ms; + color: white; + background-color: #424651; } + #LookingGlassDialog .notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .lg-toolbar-button:insensitive, .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + color: rgba(255, 255, 255, 0.5); + background-color: rgba(255, 255, 255, 0.05); } + #LookingGlassDialog .notebook-tab:focus, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus, .screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { + transition-duration: 100ms; + color: white; + background-color: #4c3f59; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } + #LookingGlassDialog .notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:hover, .screenshot-ui-show-pointer-button:focus:hover, .screenshot-ui-type-button:focus:hover { + background-color: #524661; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + #LookingGlassDialog .notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:active, .screenshot-ui-show-pointer-button:focus:active, .screenshot-ui-type-button:focus:active { + background-color: #584c68; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + #LookingGlassDialog .notebook-tab:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:hover, .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover { + transition-duration: 100ms; + color: white; + background-color: #494d59; } + #LookingGlassDialog .notebook-tab:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:active, .screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active { + transition-duration: 100ms; + color: white; + background-color: #505562; } + #LookingGlassDialog .notebook-tab:outlined, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined, .screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, #LookingGlassDialog .notebook-tab:checked, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked { + transition-duration: 100ms; + color: white; + background-color: #575c6a; } + #LookingGlassDialog .notebook-tab:outlined:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:hover, .screenshot-ui-show-pointer-button:outlined:hover, .screenshot-ui-type-button:outlined:hover, #LookingGlassDialog .notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:hover, .screenshot-ui-show-pointer-button:checked:hover, .screenshot-ui-type-button:checked:hover { + background-color: #5d6373; } + #LookingGlassDialog .notebook-tab:outlined:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:active, .screenshot-ui-show-pointer-button:outlined:active, .screenshot-ui-type-button:outlined:active, #LookingGlassDialog .notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:active, .screenshot-ui-show-pointer-button:checked:active, .screenshot-ui-type-button:checked:active { + background-color: #646a7b; } + +.screenshot-ui-show-pointer-button, .screenshot-ui-type-button { + transition-duration: 100ms; + background-color: transparent; + background-color: none; + box-shadow: none; } + .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); + background-color: transparent; + color: rgba(255, 255, 255, 0.5); } + .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + background-color: transparent; + background-color: none; + box-shadow: none; } + .screenshot-ui-show-pointer-button:insensitive:insensitive, .screenshot-ui-type-button:insensitive:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); + background-color: transparent; + color: rgba(255, 255, 255, 0.5); } + +/* System Elements */ +.login-dialog-prompt-entry, .search-entry { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.7); } + .login-dialog-prompt-entry:hover, .search-entry:hover { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); } + .login-dialog-prompt-entry:focus, .search-entry:focus { + transition-duration: 100ms; + background-color: rgba(231, 186, 231, 0.2875); + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7); + color: white; } + .login-dialog-prompt-entry:insensitive, .search-entry:insensitive { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); + color: rgba(255, 255, 255, 0.5); } + .login-dialog-prompt-entry StLabel.hint-text, .search-entry StLabel.hint-text { + color: rgba(255, 255, 255, 0.7); } + +.login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button { + transition-duration: 100ms; + color: white; + background-color: #444854; } + .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive { + transition-duration: 100ms; + color: rgba(255, 255, 255, 0.5); + background-color: rgba(255, 255, 255, 0.05); } + .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus { + transition-duration: 100ms; + color: white; + background-color: #4e415c; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } + .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover { + background-color: #544764; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active { + background-color: #5a4e6b; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover { + transition-duration: 100ms; + color: white; + background-color: #4b4f5c; } + .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active { + transition-duration: 100ms; + color: white; + background-color: #525665; } + .login-dialog-button.cancel-button:outlined, .login-dialog-button.switch-user-button:outlined, .login-dialog-button.login-dialog-session-list-button:outlined, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked { + transition-duration: 100ms; + color: white; + background-color: #595e6d; } + .login-dialog-button.cancel-button:outlined:hover, .login-dialog-button.switch-user-button:outlined:hover, .login-dialog-button.login-dialog-session-list-button:outlined:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover { + background-color: #5f6576; } + .login-dialog-button.cancel-button:outlined:active, .login-dialog-button.switch-user-button:outlined:active, .login-dialog-button.login-dialog-session-list-button:outlined:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active { + background-color: #666c7e; } + /* WIDGETS */ .shell-link { color: #ff0bff; } @@ -313,11 +402,10 @@ StEntry StIcon.peek-password { padding: 0 4px; } StEntry StLabel.hint-text { - margin-left: 2px; - color: rgba(238, 238, 236, 0.7); } + margin-left: 2px; } /* Buttons */ -.button, .login-dialog-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { +.button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { min-height: 22px; } .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { @@ -441,7 +529,7 @@ StScrollBar { .popup-menu-item:active { transition-duration: 100ms; color: #eeeeec; - background-color: #545866; } + background-color: #4d505e; } .popup-menu-item:checked { transition-duration: 100ms; color: #eeeeec; @@ -492,7 +580,7 @@ StScrollBar { .popup-sub-menu .popup-menu-item:active { transition-duration: 100ms; color: #eeeeec; - background-color: #626778; } + background-color: #5b5f70; } .popup-sub-menu .popup-menu-item:checked { transition-duration: 100ms; color: #eeeeec; @@ -582,7 +670,7 @@ StScrollBar { .datemenu-today-button:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .datemenu-today-button:focus { transition-duration: 100ms; color: #eeeeec; @@ -594,6 +682,11 @@ StScrollBar { .datemenu-today-button:focus:active { background-color: #4d3f58; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .datemenu-today-button:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); + background-color: transparent; } /* Calendar */ .calendar { @@ -618,7 +711,7 @@ StScrollBar { .calendar:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .calendar:focus { transition-duration: 100ms; color: #eeeeec; @@ -630,6 +723,11 @@ StScrollBar { .calendar:focus:active { background-color: #4d3f58; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .calendar:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); + background-color: transparent; } .calendar .calendar-month-header .calendar-change-month-back StIcon, .calendar .calendar-month-header .calendar-change-month-forward StIcon { icon-size: 1.09em; } @@ -642,9 +740,9 @@ StScrollBar { margin: 2px; border-radius: 8px; } .calendar .calendar-month-header .pager-button:hover, .calendar .calendar-month-header .pager-button:focus { - background-color: #303340; } + background-color: #383d4b; } .calendar .calendar-month-header .pager-button:active { - background-color: #343845; } + background-color: #3d4251; } .calendar .calendar-day-base { text-align: center; margin: 2px; @@ -654,20 +752,20 @@ StScrollBar { border-radius: 99px; transition-duration: 100ms; } .calendar .calendar-day-base:hover { - background-color: #303340; } + background-color: #383d4b; } .calendar .calendar-day-base:focus { background-color: #3d1e46; - color: #ffffff; + color: inherit; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6); } .calendar .calendar-day-base:active, .calendar .calendar-day-base:selected { color: white; - background-color: #343845; } + background-color: #3d4251; } .calendar .calendar-day-base:active:focus, .calendar .calendar-day-base:selected:focus { - background-color: #4a2d58; } + background-color: #513462; } .calendar .calendar-day-base.calendar-day-heading { color: #888a8d; padding-top: 6px; - height: 16px !important; + height: 1.1em !important; font-weight: 600; } .calendar .calendar-day { font-weight: 600; } @@ -718,7 +816,7 @@ StScrollBar { .events-button:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .events-button:focus { transition-duration: 100ms; color: #eeeeec; @@ -730,12 +828,16 @@ StScrollBar { .events-button:focus:active { background-color: #4d3f58; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .events-button:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .events-button .events-box { spacing: 6px; } .events-button .events-list { - spacing: 12px; } + spacing: 12px; + color: #eeeeec; } .events-button .events-title { - color: #888a8d; margin-bottom: 4px; } .events-button .event-time { color: #888a8d; } @@ -755,7 +857,7 @@ StScrollBar { .world-clocks-button:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .world-clocks-button:focus { transition-duration: 100ms; color: #eeeeec; @@ -767,6 +869,10 @@ StScrollBar { .world-clocks-button:focus:active { background-color: #4d3f58; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .world-clocks-button:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .world-clocks-button .world-clocks-grid { spacing-rows: 6px; spacing-columns: 12px; } @@ -798,7 +904,7 @@ StScrollBar { .weather-button:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .weather-button:focus { transition-duration: 100ms; color: #eeeeec; @@ -810,6 +916,10 @@ StScrollBar { .weather-button:focus:active { background-color: #4d3f58; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .weather-button:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .weather-button .weather-box { spacing: 10px; } .weather-button .weather-header-box { @@ -843,7 +953,7 @@ StScrollBar { padding-left: 6px; border-left-width: 1px; } .message-list .message-list-placeholder { - color: rgba(136, 138, 141, 0.5); } + color: #888a8d; } .message-list .message-list-placeholder > StIcon { icon-size: 3.27em; margin-bottom: 12px; @@ -886,7 +996,7 @@ StScrollBar { .message:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .message:focus { transition-duration: 100ms; color: #eeeeec; @@ -898,6 +1008,10 @@ StScrollBar { .message:focus:active { background-color: #4d3f58; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .message:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .message .message-icon-bin { padding: 18px; } .message .message-icon-bin:ltr { @@ -931,15 +1045,15 @@ StScrollBar { text-align: left; } .message .message-close-button { color: #eeeeec; - background-color: rgba(238, 238, 236, 0.1); + background-color: rgba(238, 238, 236, 0.2); border-radius: 99px; padding: 5px; margin: 1px; } .message .message-close-button:hover { - background-color: rgba(238, 238, 236, 0.2); } + background-color: rgba(238, 238, 236, 0.3); } .message .message-close-button:active { - background-color: rgba(238, 238, 236, 0.1); } - .message .message-close-button StIcon { + background-color: rgba(238, 238, 236, 0.2); } + .message .message-close-button > StIcon { icon-size: 1.09em; } .message .message-body { color: #d6d6d1; } @@ -954,10 +1068,10 @@ StScrollBar { border-radius: 8px; color: #eeeeec; } .message-media-control:hover { - background-color: #3b3f4e; + background-color: #43495a; color: #eeeeec; } .message-media-control:active { - background-color: #3f4454; + background-color: #484d60; color: #eeeeec; } .message-media-control:insensitive { color: #959799; } @@ -995,7 +1109,7 @@ StScrollBar { background-color: #a400a4; color: #ffffff; } .candidate-box:hover { - background-color: #303340; + background-color: #383d4b; color: white; } .candidate-page-button-box { @@ -1181,7 +1295,7 @@ StScrollBar { .audio-selection-device { border-radius: 16px; } .audio-selection-device:hover, .audio-selection-device:focus { - background-color: #303340; } + background-color: #383d4b; } .audio-selection-device:active { background-color: #a400a4; color: #ffffff; } @@ -1270,21 +1384,21 @@ StScrollBar { .switcher-list .item-box { background-color: transparent; } .switcher-list .item-box:hover { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(238, 238, 236, 0.1); } .switcher-list .item-box:selected, .switcher-list .item-box:focus { - background-color: rgba(255, 255, 255, 0.13); } + background-color: rgba(238, 238, 236, 0.13); } .switcher-list .item-box:selected:hover, .switcher-list .item-box:focus:hover { - background-color: rgba(255, 255, 255, 0.16); } + background-color: rgba(238, 238, 236, 0.16); } .switcher-list .item-box:selected:active, .switcher-list .item-box:focus:active { - background-color: rgba(255, 255, 255, 0.13); } + background-color: rgba(238, 238, 236, 0.13); } .switcher-list .item-box:active { - background-color: rgba(255, 255, 255, 0.16); } + background-color: rgba(238, 238, 236, 0.16); } .switcher-list .item-box:outlined, .switcher-list .item-box:checked { - background-color: rgba(255, 255, 255, 0.19); } + background-color: rgba(238, 238, 236, 0.19); } .switcher-list .item-box:outlined:active, .switcher-list .item-box:checked:active { - background-color: rgba(255, 255, 255, 0.22); } + background-color: rgba(238, 238, 236, 0.22); } .switcher-list .item-box:outlined:hover, .switcher-list .item-box:checked:hover { - background-color: rgba(255, 255, 255, 0.25); } + background-color: rgba(238, 238, 236, 0.25); } .switcher-list .item-box:drop { border: 2px solid rgba(164, 0, 164, 0.8); background-color: rgba(164, 0, 164, 0.2); } @@ -1368,7 +1482,7 @@ StScrollBar { transition-duration: 200ms; border-radius: 99px; } .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:hover, .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:focus { - background-color: #303340; } + background-color: #383d4b; } .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 { @@ -1397,7 +1511,7 @@ StScrollBar { .screenshot-ui-shot-cast-button:hover, .screenshot-ui-shot-cast-button:focus { background-color: #464b5d; } .screenshot-ui-shot-cast-button:active { - background-color: #3f4454; } + background-color: #484d60; } .screenshot-ui-shot-cast-button:checked { background-color: white; color: black; } @@ -1424,12 +1538,12 @@ StScrollBar { .screenshot-ui-area-selector-handle { border-radius: 99px; background-color: white; - box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.2); + box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.3); width: 24px; height: 24px; } .screenshot-ui-window-selector { - background-color: #272a34; } + background-color: #323643; } .screenshot-ui-window-selector .screenshot-ui-window-selector-window-container { margin: 100px; } .screenshot-ui-window-selector:primary-monitor .screenshot-ui-window-selector-window-container { @@ -1479,12 +1593,16 @@ StScrollBar { /* Top Bar */ #panel { - background-color: #000; + background-color: black; font-weight: bold; height: 2.2em; - transition-duration: 250ms; } + transition-duration: 250ms; + box-shadow: inset 0 -1px 0 0 black; } #panel.unlock-screen, #panel.login-screen, #panel:overview { - background-color: transparent; } + background-color: transparent; + box-shadow: none; } + #panel.unlock-screen .panel-button, #panel.login-screen .panel-button, #panel:overview .panel-button { + color: white !important; } #panel .panel-button { font-weight: bold; color: #e2e2df; @@ -1615,7 +1733,7 @@ StScrollBar { .quick-settings { padding: 18px; border-radius: 36px; } - .quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button, .quick-settings .login-dialog-button { + .quick-settings .icon-button, .quick-settings .login-dialog-button.cancel-button, .quick-settings .login-dialog-button.switch-user-button, .quick-settings .login-dialog-button.login-dialog-session-list-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button { padding: 10.5px; } .quick-settings-grid { @@ -1652,7 +1770,7 @@ StScrollBar { color: rgba(255, 255, 255, 0.5); } .quick-toggle > StBoxLayout { spacing: 9px; } - .quick-toggle.button, .quick-toggle.login-dialog-button, .quick-toggle.icon-button, .background-app-item .quick-toggle.close-button { + .quick-toggle.button, .quick-toggle.icon-button, .quick-toggle.login-dialog-button.cancel-button, .quick-toggle.login-dialog-button.switch-user-button, .quick-toggle.login-dialog-button.login-dialog-session-list-button, .background-app-item .quick-toggle.close-button { padding: 0; } .quick-toggle > StBoxLayout { padding: 0 12px; } @@ -1673,8 +1791,12 @@ StScrollBar { max-width: auto; } .quick-menu-toggle .quick-toggle:ltr { border-radius: 99px 0 0 99px; } + .quick-menu-toggle .quick-toggle:ltr > StBoxLayout { + padding-right: 9px; } .quick-menu-toggle .quick-toggle:rtl { border-radius: 0 99px 99px 0; } + .quick-menu-toggle .quick-toggle:rtr > StBoxLayout { + padding-left: 9px; } .quick-menu-toggle .quick-toggle:ltr:last-child { border-radius: 99px; } .quick-menu-toggle .quick-toggle:rtl:last-child { @@ -1737,6 +1859,8 @@ StScrollBar { transition-duration: 100ms; color: #eeeeec; background-color: #35373f; + background-color: #23252e !important; + color: #eeeeec !important; border-radius: 24px; padding: 12px; margin: 12px 18px 0; } @@ -1747,7 +1871,7 @@ StScrollBar { .quick-toggle-menu:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .quick-toggle-menu:focus { transition-duration: 100ms; color: #eeeeec; @@ -1759,6 +1883,10 @@ StScrollBar { .quick-toggle-menu:focus:active { background-color: #4d3f58; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .quick-toggle-menu:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .quick-toggle-menu .popup-menu-item > StIcon { -st-icon-style: symbolic; } .quick-toggle-menu .header { @@ -1771,7 +1899,8 @@ StScrollBar { padding: 9px; background-color: rgba(238, 238, 236, 0.2); } .quick-toggle-menu .header .icon.active { - background-color: #a400a4; } + background-color: #a400a4; + color: #ffffff; } .quick-settings-system-item > StBoxLayout { spacing: 12px; } @@ -1791,7 +1920,7 @@ StScrollBar { .bt-device-item .popup-menu-icon { -st-icon-style: symbolic; } -.bt-menu-placeholder { +.bt-menu-placeholder.popup-menu-item { text-align: center; padding: 2em 4em; } @@ -1829,7 +1958,7 @@ StScrollBar { spacing: 6px; } .window-close, .screenshot-ui-close-button { - background-color: rgba(63, 68, 84, 0.98); + background-color: rgba(65, 70, 87, 0.98); color: white; border-radius: 99px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3); @@ -1840,9 +1969,9 @@ StScrollBar { .window-close StIcon, .screenshot-ui-close-button StIcon { icon-size: 24px; } .window-close:hover, .screenshot-ui-close-button:hover { - background-color: rgba(78, 84, 104, 0.98); } + background-color: rgba(81, 87, 107, 0.98); } .window-close:active, .screenshot-ui-close-button:active { - background-color: rgba(91, 98, 122, 0.98); } + background-color: rgba(94, 101, 125, 0.98); } .workspace-background { border-radius: 30px; @@ -1873,10 +2002,9 @@ StScrollBar { background-color: transparent; } .search-section-content { - background-color: #323643; - border-radius: 24px; - box-shadow: inset 0 0 0 1px solid rgba(238, 238, 236, 0.07); + background-color: #3d3f48; color: white; + border-radius: 24px; padding: 12px; margin: 0 12px; } @@ -1903,6 +2031,9 @@ StScrollBar { border: 2px solid rgba(164, 0, 164, 0.8); background-color: rgba(164, 0, 164, 0.2); } +.search-statustext { + color: rgba(255, 255, 255, 0.8); } + .grid-search-results { spacing: 30px; margin: 0 12px; } @@ -1929,7 +2060,7 @@ StScrollBar { spacing: 12px; } .list-search-result .list-search-result-description { - color: #97999f; } + color: #989aa1; } /* Dash */ #dash { @@ -1945,7 +2076,7 @@ StScrollBar { margin-bottom: 14px; } .dash-background { - background-color: #323643; + background-color: #3d3f48; border-radius: 28px; padding: 12px; spacing: 6px; @@ -1969,7 +2100,7 @@ StScrollBar { .dash-item-container .show-apps .overview-icon { background-color: transparent; } .dash-item-container .show-apps:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .dash-item-container .show-apps:selected .overview-icon, .dash-item-container .show-apps:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .dash-item-container .show-apps:selected .overview-icon:hover .overview-icon, .dash-item-container .show-apps:focus .overview-icon:hover .overview-icon { @@ -1989,12 +2120,13 @@ StScrollBar { background-color: rgba(164, 0, 164, 0.2); } .dash-item-container .show-apps, .dash-item-container .app-well-app, .dash-item-container .grid-search-result { - padding-bottom: 12px; } + padding-bottom: 12px; + color: white; } .dash-separator { width: 1px; margin: 0 4px; - background-color: #0d0e11; + background-color: rgba(255, 255, 255, 0.1); margin-bottom: 12px; } .dash-label { @@ -2017,7 +2149,7 @@ StScrollBar { .app-well-app .overview-icon, .grid-search-result .overview-icon { background-color: transparent; } .app-well-app:hover .overview-icon, .grid-search-result:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app:selected .overview-icon, .grid-search-result:selected .overview-icon, .app-well-app:focus .overview-icon, .grid-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .app-well-app:selected .overview-icon:hover .overview-icon, .grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app:focus .overview-icon:hover .overview-icon, .grid-search-result:focus .overview-icon:hover .overview-icon { @@ -2037,30 +2169,31 @@ StScrollBar { background-color: rgba(164, 0, 164, 0.2); } .app-well-app .overview-icon, .grid-search-result .overview-icon { padding: 12px; - border-radius: 24px; } + border-radius: 24px; + color: white; } .app-well-app .overview-icon.overview-icon-with-label > StBoxLayout, .grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout { spacing: 6px; } .app-well-app.app-folder, .app-folder.grid-search-result { transition-duration: 400ms; } .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon { - background-color: rgba(238, 238, 236, 0.07); } + background-color: rgba(255, 255, 255, 0.07); } .app-well-app.app-folder:hover .overview-icon, .app-folder.grid-search-result:hover .overview-icon { - background-color: rgba(238, 238, 236, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon, .app-folder.grid-search-result:selected .overview-icon, .app-well-app.app-folder:focus .overview-icon, .app-folder.grid-search-result:focus .overview-icon { - background-color: rgba(238, 238, 236, 0.13); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon:hover .overview-icon, .app-folder.grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app.app-folder:focus .overview-icon:hover .overview-icon, .app-folder.grid-search-result:focus .overview-icon:hover .overview-icon { - background-color: rgba(238, 238, 236, 0.16); } + background-color: rgba(255, 255, 255, 0.16); } .app-well-app.app-folder:selected .overview-icon:active .overview-icon, .app-folder.grid-search-result:selected .overview-icon:active .overview-icon, .app-well-app.app-folder:focus .overview-icon:active .overview-icon, .app-folder.grid-search-result:focus .overview-icon:active .overview-icon { - background-color: rgba(238, 238, 236, 0.13); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:active .overview-icon, .app-folder.grid-search-result:active .overview-icon { - background-color: rgba(238, 238, 236, 0.16); } + background-color: rgba(255, 255, 255, 0.16); } .app-well-app.app-folder:outlined .overview-icon, .app-folder.grid-search-result:outlined .overview-icon, .app-well-app.app-folder:checked .overview-icon, .app-folder.grid-search-result:checked .overview-icon { - background-color: rgba(238, 238, 236, 0.19); } + background-color: rgba(255, 255, 255, 0.19); } .app-well-app.app-folder:outlined .overview-icon:active .overview-icon, .app-folder.grid-search-result:outlined .overview-icon:active .overview-icon, .app-well-app.app-folder:checked .overview-icon:active .overview-icon, .app-folder.grid-search-result:checked .overview-icon:active .overview-icon { - background-color: rgba(238, 238, 236, 0.22); } + background-color: rgba(255, 255, 255, 0.22); } .app-well-app.app-folder:outlined .overview-icon:hover .overview-icon, .app-folder.grid-search-result:outlined .overview-icon:hover .overview-icon, .app-well-app.app-folder:checked .overview-icon:hover .overview-icon, .app-folder.grid-search-result:checked .overview-icon:hover .overview-icon { - background-color: rgba(238, 238, 236, 0.25); } + background-color: rgba(255, 255, 255, 0.25); } .app-well-app.app-folder:drop .overview-icon, .app-folder.grid-search-result:drop .overview-icon { border: 2px solid rgba(164, 0, 164, 0.8); background-color: rgba(164, 0, 164, 0.2); } @@ -2127,7 +2260,7 @@ StScrollBar { padding: 0; } .system-action-icon { - background-color: rgba(0, 0, 0, 0.8); + background-color: rgba(255, 255, 255, 0.1); color: white; border-radius: 99px; icon-size: 48px; } @@ -2153,6 +2286,8 @@ StScrollBar { width: 24px; height: 24px; border-radius: 99px; } + .page-navigation-arrow > StIcon { + color: white; } .page-navigation-arrow:insensitive { transition-duration: 100ms; background-color: transparent; @@ -2167,11 +2302,11 @@ StScrollBar { .page-navigation-arrow:hover { transition-duration: 100ms; color: white; - background-color: rgba(102, 105, 115, 0.545); } + background-color: rgba(104, 107, 118, 0.545); } .page-navigation-arrow:active { transition-duration: 100ms; color: white; - background-color: rgba(117, 120, 131, 0.545); } + background-color: rgba(111, 115, 126, 0.545); } /* Workspace pager */ .workspace-thumbnails { @@ -2180,7 +2315,7 @@ StScrollBar { padding: 6px; } .workspace-thumbnails .workspace-thumbnail { color: white; - background-color: #3d4251; + background-color: #484d60; border-radius: 4px; border: 1px solid transparent; } .workspace-thumbnails .placeholder { @@ -2236,7 +2371,7 @@ StScrollBar { background-color: white; } .hidden { - color: rgba(0, 0, 0, 0); } + color: transparent; } .caps-lock-warning-label { text-align: center; @@ -2245,7 +2380,7 @@ StScrollBar { /* Workspace animation */ .workspace-animation { - background-color: #272a34; } + background-color: #323643; } /* Tiled window previews */ .tile-preview { @@ -2416,11 +2551,10 @@ StScrollBar { /* Looking Glass */ #LookingGlassDialog { - background-color: rgba(35, 37, 46, 0.95); + background-color: rgba(48, 51, 64, 0.98); + color: white; border-radius: 0 0 16px 16px; - border: 1px solid rgba(238, 238, 236, 0.07); border-top-width: 0; - color: #eeeeec; padding: 6px; spacing: 6px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3); } @@ -2501,7 +2635,7 @@ StScrollBar { .lg-extension:active { transition-duration: 100ms; color: #eeeeec; - background-color: #4a4d58; } + background-color: #434650; } .lg-extension:focus { transition-duration: 100ms; color: #eeeeec; @@ -2513,6 +2647,10 @@ StScrollBar { .lg-extension:focus:active { background-color: #4d3f58; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .lg-extension:insensitive { + transition-duration: 100ms; + color: rgba(238, 238, 236, 0.5); + background-color: rgba(238, 238, 236, 0.05); } .lg-extension-meta { spacing: 6px; } @@ -2524,13 +2662,13 @@ StScrollBar { padding: 6px; } .lg-debug-flag-button { - color: #eeeeec; } + color: white; } .lg-debug-flag-button StLabel { padding: 6px, 12px; } .lg-debug-flag-button:hover { color: white; } .lg-debug-flag-button:active { - color: #bebeb6; } + color: #cccccc; } .lg-debug-flags-header { padding-top: 12px; @@ -2544,7 +2682,7 @@ StScrollBar { /* Login Dialog */ .login-dialog { - background-color: #272a34; } + background-color: #323643; } .login-dialog-button.cancel-button { padding: 9px; } @@ -2653,7 +2791,7 @@ StScrollBar { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6); } #lockDialogGroup { - background-color: #272a34; } + background-color: #323643; } .unlock-dialog-clock { color: white; @@ -2794,7 +2932,8 @@ StScrollBar { /* Top Bar */ #panel { background: rgba(35, 37, 46, 0.8); - text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } + text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); + box-shadow: none; } #panel StIcon { icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #panel.unlock-screen, #panel.login-screen, #panel.lock-screen, #panel:overview { @@ -2877,7 +3016,7 @@ StScrollBar { .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon { background-color: rgba(255, 255, 255, 0.07); } .app-well-app.app-folder:hover .overview-icon, .app-folder.grid-search-result:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon, .app-folder.grid-search-result:selected .overview-icon, .app-well-app.app-folder:focus .overview-icon, .app-folder.grid-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon:hover .overview-icon, .app-folder.grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app.app-folder:focus .overview-icon:hover .overview-icon, .app-folder.grid-search-result:focus .overview-icon:hover .overview-icon { diff --git a/share/themes/Kali-Purple-Dark/gtk-3.0/gtk.css b/share/themes/Kali-Purple-Dark/gtk-3.0/gtk.css index 50b383be..32bf9278 100644 --- a/share/themes/Kali-Purple-Dark/gtk-3.0/gtk.css +++ b/share/themes/Kali-Purple-Dark/gtk-3.0/gtk.css @@ -581,7 +581,7 @@ button { notebook > header > tabs > arrow:disabled, button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -590,7 +590,7 @@ button { button:disabled:active, button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#16181d); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } notebook > header > tabs > arrow.image-button, @@ -877,7 +877,7 @@ button.suggested-action { button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -1023,7 +1023,7 @@ button.destructive-action { button.destructive-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -1186,14 +1186,14 @@ stacksidebar row.needs-attention > label, .stack-switcher > button.needs-attenti -gtk-icon-shadow: none; } .inline-toolbar toolbutton > button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:disabled:active, .inline-toolbar toolbutton > button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#16181d); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:backdrop { @@ -1840,7 +1840,7 @@ headerbar { .selection-mode .titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode.titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode headerbar button.suggested-action:disabled, headerbar.selection-mode button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -2702,7 +2702,7 @@ switch { border: 1px solid black; } switch:disabled slider { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -3160,7 +3160,7 @@ scale { border-color: #0b000b; } scale slider:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -4271,7 +4271,7 @@ infobar { -gtk-icon-shadow: none; } infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; diff --git a/share/themes/Kali-Purple-Dark/gtk-4.0/gtk.css b/share/themes/Kali-Purple-Dark/gtk-4.0/gtk.css index 9f1ce136..4fb94e6e 100644 --- a/share/themes/Kali-Purple-Dark/gtk-4.0/gtk.css +++ b/share/themes/Kali-Purple-Dark/gtk-4.0/gtk.css @@ -526,14 +526,14 @@ button { notebook > header > tabs > arrow:disabled, button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); -gtk-icon-filter: opacity(0.5); } notebook > header > tabs > arrow:disabled:active, notebook > header > tabs > arrow:disabled:checked, button:disabled:active, button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#1a1c23); box-shadow: none; } button.sidebar-button, notebook > header > tabs > arrow, windowcontrols button, notebook > header > tabs > arrow.flat, @@ -746,7 +746,7 @@ button.suggested-action { button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } button.suggested-action:disabled:active, @@ -831,7 +831,7 @@ button.destructive-action { button.destructive-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } button.destructive-action:disabled:active, @@ -1014,7 +1014,7 @@ modelbutton.flat arrow { box-shadow: none; } .toolbar button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } .toolbar button:backdrop { color: #888a8d; @@ -2178,7 +2178,7 @@ switch { border: 1px solid #0b000b; } switch:disabled > slider { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } row:selected switch { outline-color: rgba(255, 255, 255, 0.3); } @@ -2449,7 +2449,7 @@ progressbar > trough, scale > trough > fill, scale > trough { background-color: #0a0a0d; } progressbar > trough:disabled, scale > trough > fill:disabled, scale > trough:disabled { background-color: #242731; - border-color: #0d0e11; } + border-color: #17191f; } row:selected progressbar > trough, row:selected scale > trough > fill, row:selected scale > trough { outline-color: rgba(255, 255, 255, 0.3); border-color: #0b000b; } @@ -2538,7 +2538,7 @@ scale { border-color: #0b000b; } scale > trough > slider:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } row:selected scale > trough > slider:disabled, row:selected scale > trough > slider { border-color: #0b000b; } diff --git a/share/themes/Kali-Purple-Light/gnome-shell/gnome-shell.css b/share/themes/Kali-Purple-Light/gnome-shell/gnome-shell.css index 612a8112..84f6b0d0 100644 --- a/share/themes/Kali-Purple-Light/gnome-shell/gnome-shell.css +++ b/share/themes/Kali-Purple-Light/gnome-shell/gnome-shell.css @@ -23,127 +23,125 @@ stage { color: #5c616c; } /* Common Stylings */ -.screenshot-ui-panel, .workspace-switcher, .switcher-list, .resize-popup, .osd-monitor-label, .osd-window { - color: white; - background-color: #303340; - border: 1px solid rgba(255, 255, 255, 0.1); - border-radius: 999px; - padding: 12px; } - .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon, .app-well-app .overview-icon, .grid-search-result .overview-icon, .dash-item-container .show-apps .overview-icon, .list-search-result, .search-provider-icon, .switcher-list .item-box { border-radius: 16px; padding: 6px; spacing: 6px; border: 2px solid transparent; transition-duration: 200ms; - text-align: center; } + text-align: center; + color: inherit; } -#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .login-dialog-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { +#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button, .app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { border-radius: 8px; border-style: solid; border-width: 1px; font-weight: bold; - padding: 3px 24px; + padding: 3px 24px; } + +.app-folder-dialog .folder-name-container .edit-folder-button, .button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; } - #LookingGlassDialog .notebook-tab:focus, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus, .app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .login-dialog-button:focus, .icon-button:focus, .background-app-item .close-button:focus { + background-color: #efeff0; } + .app-folder-dialog .folder-name-container .edit-folder-button:focus, .button:focus, .icon-button:focus, .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .close-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #e8d9ea; + background-color: #e8d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } - #LookingGlassDialog .notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:hover, .app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .login-dialog-button:focus:hover, .icon-button:focus:hover, .background-app-item .close-button:focus:hover { - background-color: #f0e0f1; + .app-folder-dialog .folder-name-container .edit-folder-button:focus:hover, .button:focus:hover, .icon-button:focus:hover, .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .close-button:focus:hover { + background-color: #efdeef; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - #LookingGlassDialog .notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:active, .app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .login-dialog-button:focus:active, .icon-button:focus:active, .background-app-item .close-button:focus:active { - background-color: #f6e6f6; + .app-folder-dialog .folder-name-container .edit-folder-button:focus:active, .button:focus:active, .icon-button:focus:active, .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .close-button:focus:active { + background-color: #f6e5f6; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - #LookingGlassDialog .notebook-tab:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:hover, .app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .login-dialog-button:hover, .icon-button:hover, .background-app-item .close-button:hover { + .app-folder-dialog .folder-name-container .edit-folder-button:hover, .button:hover, .icon-button:hover, .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .close-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } - #LookingGlassDialog .notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .lg-toolbar-button:insensitive, .app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .login-dialog-button:insensitive, .icon-button:insensitive, .background-app-item .close-button:insensitive { + background-color: #e7e7e9; } + .app-folder-dialog .folder-name-container .edit-folder-button:insensitive, .button:insensitive, .icon-button:insensitive, .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .close-button:insensitive { transition-duration: 100ms; color: rgba(92, 97, 108, 0.5); background-color: rgba(92, 97, 108, 0.05); } - #LookingGlassDialog .notebook-tab:selected, #LookingGlassDialog > #Toolbar .lg-toolbar-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .login-dialog-button:selected, .icon-button:selected, .background-app-item .close-button:selected, #LookingGlassDialog .notebook-tab:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:active, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .login-dialog-button:active, .icon-button:active, .background-app-item .close-button:active { + .app-folder-dialog .folder-name-container .edit-folder-button:selected, .button:selected, .icon-button:selected, .login-dialog-button.cancel-button:selected, .login-dialog-button.switch-user-button:selected, .login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .close-button:selected, .app-folder-dialog .folder-name-container .edit-folder-button:active, .button:active, .icon-button:active, .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active, .background-app-item .close-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } - #LookingGlassDialog .notebook-tab:checked, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked, .app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .login-dialog-button:checked, .icon-button:checked, .background-app-item .close-button:checked { + background-color: #dfdfe1; } + .app-folder-dialog .folder-name-container .edit-folder-button:checked, .button:checked, .icon-button:checked, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .close-button:checked { transition-duration: 100ms; color: #5c616c; - background-color: white; } - #LookingGlassDialog .notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:hover, .app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .login-dialog-button:checked:hover, .icon-button:checked:hover, .background-app-item .close-button:checked:hover { + background-color: #d7d7da; } + .app-folder-dialog .folder-name-container .edit-folder-button:checked:hover, .button:checked:hover, .icon-button:checked:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .close-button:checked:hover { background-color: white; } - #LookingGlassDialog .notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:active, .app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .login-dialog-button:checked:active, .icon-button:checked:active, .background-app-item .close-button:checked:active { + .app-folder-dialog .folder-name-container .edit-folder-button:checked:active, .button:checked:active, .icon-button:checked:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .close-button:checked:active { background-color: white; } - #LookingGlassDialog .flat.notebook-tab, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button, .app-folder-dialog .folder-name-container .flat.edit-folder-button, .flat.button, .flat.login-dialog-button, .flat.icon-button, .background-app-item .flat.close-button { + .app-folder-dialog .folder-name-container .flat.edit-folder-button, .flat.button, .flat.icon-button, .flat.login-dialog-button.cancel-button, .flat.login-dialog-button.switch-user-button, .flat.login-dialog-button.login-dialog-session-list-button, .background-app-item .flat.close-button { transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; background-color: transparent; } - #LookingGlassDialog .flat.notebook-tab:focus, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .flat.login-dialog-button:focus, .flat.icon-button:focus, .background-app-item .flat.close-button:focus { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus, .flat.button:focus, .flat.icon-button:focus, .flat.login-dialog-button.cancel-button:focus, .flat.login-dialog-button.switch-user-button:focus, .flat.login-dialog-button.login-dialog-session-list-button:focus, .background-app-item .flat.close-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #e8d9ea; + background-color: #e8d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } - #LookingGlassDialog .flat.notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .flat.login-dialog-button:focus:hover, .flat.icon-button:focus:hover, .background-app-item .flat.close-button:focus:hover { - background-color: #f0e0f1; + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:hover, .flat.button:focus:hover, .flat.icon-button:focus:hover, .flat.login-dialog-button.cancel-button:focus:hover, .flat.login-dialog-button.switch-user-button:focus:hover, .flat.login-dialog-button.login-dialog-session-list-button:focus:hover, .background-app-item .flat.close-button:focus:hover { + background-color: #efdeef; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - #LookingGlassDialog .flat.notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:focus:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .flat.login-dialog-button:focus:active, .flat.icon-button:focus:active, .background-app-item .flat.close-button:focus:active { - background-color: #f6e6f6; + .app-folder-dialog .folder-name-container .flat.edit-folder-button:focus:active, .flat.button:focus:active, .flat.icon-button:focus:active, .flat.login-dialog-button.cancel-button:focus:active, .flat.login-dialog-button.switch-user-button:focus:active, .flat.login-dialog-button.login-dialog-session-list-button:focus:active, .background-app-item .flat.close-button:focus:active { + background-color: #f6e5f6; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - #LookingGlassDialog .flat.notebook-tab:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .flat.login-dialog-button:hover, .flat.icon-button:hover, .background-app-item .flat.close-button:hover { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:hover, .flat.button:hover, .flat.icon-button:hover, .flat.login-dialog-button.cancel-button:hover, .flat.login-dialog-button.switch-user-button:hover, .flat.login-dialog-button.login-dialog-session-list-button:hover, .background-app-item .flat.close-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } - #LookingGlassDialog .flat.notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:insensitive, .app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .flat.login-dialog-button:insensitive, .flat.icon-button:insensitive, .background-app-item .flat.close-button:insensitive { + background-color: #e7e7e9; } + .app-folder-dialog .folder-name-container .flat.edit-folder-button:insensitive, .flat.button:insensitive, .flat.icon-button:insensitive, .flat.login-dialog-button.cancel-button:insensitive, .flat.login-dialog-button.switch-user-button:insensitive, .flat.login-dialog-button.login-dialog-session-list-button:insensitive, .background-app-item .flat.close-button:insensitive { transition-duration: 100ms; color: rgba(92, 97, 108, 0.5); background-color: rgba(92, 97, 108, 0.05); } - #LookingGlassDialog .flat.notebook-tab:selected, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .flat.login-dialog-button:selected, .flat.icon-button:selected, .background-app-item .flat.close-button:selected, #LookingGlassDialog .flat.notebook-tab:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .flat.login-dialog-button:active, .flat.icon-button:active, .background-app-item .flat.close-button:active { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:selected, .flat.button:selected, .flat.icon-button:selected, .flat.login-dialog-button.cancel-button:selected, .flat.login-dialog-button.switch-user-button:selected, .flat.login-dialog-button.login-dialog-session-list-button:selected, .background-app-item .flat.close-button:selected, .app-folder-dialog .folder-name-container .flat.edit-folder-button:active, .flat.button:active, .flat.icon-button:active, .flat.login-dialog-button.cancel-button:active, .flat.login-dialog-button.switch-user-button:active, .flat.login-dialog-button.login-dialog-session-list-button:active, .background-app-item .flat.close-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } - #LookingGlassDialog .flat.notebook-tab:checked, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .flat.login-dialog-button:checked, .flat.icon-button:checked, .background-app-item .flat.close-button:checked { + background-color: #dfdfe1; } + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked, .flat.button:checked, .flat.icon-button:checked, .flat.login-dialog-button.cancel-button:checked, .flat.login-dialog-button.switch-user-button:checked, .flat.login-dialog-button.login-dialog-session-list-button:checked, .background-app-item .flat.close-button:checked { transition-duration: 100ms; color: #5c616c; - background-color: white; } - #LookingGlassDialog .flat.notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked:hover, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .flat.login-dialog-button:checked:hover, .flat.icon-button:checked:hover, .background-app-item .flat.close-button:checked:hover { + background-color: #d7d7da; } + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:hover, .flat.button:checked:hover, .flat.icon-button:checked:hover, .flat.login-dialog-button.cancel-button:checked:hover, .flat.login-dialog-button.switch-user-button:checked:hover, .flat.login-dialog-button.login-dialog-session-list-button:checked:hover, .background-app-item .flat.close-button:checked:hover { background-color: white; } - #LookingGlassDialog .flat.notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .flat.lg-toolbar-button:checked:active, .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .flat.login-dialog-button:checked:active, .flat.icon-button:checked:active, .background-app-item .flat.close-button:checked:active { + .app-folder-dialog .folder-name-container .flat.edit-folder-button:checked:active, .flat.button:checked:active, .flat.icon-button:checked:active, .flat.login-dialog-button.cancel-button:checked:active, .flat.login-dialog-button.switch-user-button:checked:active, .flat.login-dialog-button.login-dialog-session-list-button:checked:active, .background-app-item .flat.close-button:checked:active { background-color: white; } -.lg-dialog StEntry, StEntry { +.login-dialog-prompt-entry, .search-entry, .lg-dialog StEntry, StEntry { border-radius: 8px; padding: 9px 9px; - color: #5c616c; selection-background-color: #a400a4; - selected-color: #ffffff; + selected-color: #ffffff; } + +StEntry { transition-duration: 100ms; - background-color: rgba(92, 97, 108, 0.1); + background-color: rgba(92, 97, 108, 0.15); color: rgba(92, 97, 108, 0.7); } StEntry:hover { transition-duration: 100ms; - background-color: rgba(92, 97, 108, 0.2); - color: inherit; } + background-color: rgba(92, 97, 108, 0.25); } StEntry:focus { transition-duration: 100ms; - background-color: rgba(115, 66, 126, 0.24); - box-shadow: inset 0 0 0 2px #a400a4; + background-color: rgba(111, 71, 123, 0.2875); + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7); color: #5c616c; } StEntry:insensitive { transition-duration: 100ms; - background-color: rgba(174, 176, 182, 0.2); - color: #aeb0b6; } + background-color: rgba(92, 97, 108, 0.25); + color: rgba(92, 97, 108, 0.5); } + StEntry StLabel.hint-text { + color: rgba(92, 97, 108, 0.7); } .modal-dialog .modal-dialog-linked-button, .hotplug-notification-item, .notification-banner .notification-button { padding: 12px; font-weight: bold !important; transition-duration: 100ms; color: #5c616c; - background-color: #e0e1e2; } + background-color: #dfdfe0; } .modal-dialog .modal-dialog-linked-button:ltr, .hotplug-notification-item:ltr, .notification-banner .notification-button:ltr { margin-right: 1px; } .modal-dialog .modal-dialog-linked-button:rtl, .hotplug-notification-item:rtl, .notification-banner .notification-button:rtl { @@ -155,28 +153,28 @@ stage { .modal-dialog .modal-dialog-linked-button:focus, .hotplug-notification-item:focus, .notification-banner .notification-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #dacbdc; + background-color: #d9c9da; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } .modal-dialog .modal-dialog-linked-button:focus:hover, .hotplug-notification-item:focus:hover, .notification-banner .notification-button:focus:hover { - background-color: #e1d1e2; + background-color: #e0d0e1; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .modal-dialog .modal-dialog-linked-button:focus:active, .hotplug-notification-item:focus:active, .notification-banner .notification-button:focus:active { - background-color: #e8d8e9; + background-color: #e7d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .modal-dialog .modal-dialog-linked-button:hover, .hotplug-notification-item:hover, .notification-banner .notification-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #e8e9e9; } + background-color: #d7d7d8; } .modal-dialog .modal-dialog-linked-button:active, .hotplug-notification-item:active, .notification-banner .notification-button:active { transition-duration: 100ms; color: #5c616c; - background-color: #f8f8f8; } + background-color: #cfcfd1; } .modal-dialog .modal-dialog-linked-button:checked, .hotplug-notification-item:checked, .notification-banner .notification-button:checked { transition-duration: 100ms; color: #5c616c; - background-color: #f8f8f8; } + background-color: #c8c8c9; } .modal-dialog .modal-dialog-linked-button:checked:hover, .hotplug-notification-item:checked:hover, .notification-banner .notification-button:checked:hover { - background-color: white; } + background-color: #fefefe; } .modal-dialog .modal-dialog-linked-button:checked:active, .hotplug-notification-item:checked:active, .notification-banner .notification-button:checked:active { background-color: white; } .modal-dialog .modal-dialog-linked-button:first-child:ltr, .hotplug-notification-item:first-child:ltr, .notification-banner .notification-button:first-child:ltr { @@ -194,60 +192,9 @@ stage { margin-left: 0 !important; margin-right: 0 !important; } -.screenshot-ui-show-pointer-button, .screenshot-ui-type-button { - transition-duration: 100ms; - background-color: transparent; - background-color: none; - box-shadow: none; } - .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { - transition-duration: 100ms; - color: rgba(92, 97, 108, 0.5); - background-color: rgba(92, 97, 108, 0.05); - background-color: transparent; - color: rgba(255, 255, 255, 0.5); } - .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { - transition-duration: 100ms; - background-color: transparent; - background-color: none; - box-shadow: none; } - .screenshot-ui-show-pointer-button:insensitive:insensitive, .screenshot-ui-type-button:insensitive:insensitive { - transition-duration: 100ms; - color: rgba(92, 97, 108, 0.5); - background-color: rgba(92, 97, 108, 0.05); - background-color: transparent; - color: rgba(255, 255, 255, 0.5); } - .screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { - transition-duration: 100ms; - color: white; - background-color: #4c3f59; - box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } - .screenshot-ui-show-pointer-button:focus:hover, .screenshot-ui-type-button:focus:hover { - background-color: #524661; - box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - .screenshot-ui-show-pointer-button:focus:active, .screenshot-ui-type-button:focus:active { - background-color: #584c68; - box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } - .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover { - transition-duration: 100ms; - color: white; - background-color: #494d59; } - .screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active { - transition-duration: 100ms; - color: white; - background-color: #575c6a; } - .screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked { - transition-duration: 100ms; - color: white; - background-color: #575c6a; } - .screenshot-ui-show-pointer-button:outlined:hover, .screenshot-ui-type-button:outlined:hover, .screenshot-ui-show-pointer-button:checked:hover, .screenshot-ui-type-button:checked:hover { - background-color: #5d6373; } - .screenshot-ui-show-pointer-button:outlined:active, .screenshot-ui-type-button:outlined:active, .screenshot-ui-show-pointer-button:checked:active, .screenshot-ui-type-button:checked:active { - background-color: #646a7b; } - .dash-label, .window-caption { - background-color: #303340; + background-color: rgba(0, 0, 0, 0.9); color: white; - border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 99px; padding: 6px 12px; text-align: center; } @@ -265,7 +212,7 @@ stage { font-weight: 700; font-size: 15pt; } -.bt-menu-placeholder, .message-dialog-content .message-dialog-title.lightweight, .headline { +.bt-menu-placeholder.popup-menu-item, .message-dialog-content .message-dialog-title.lightweight, .headline { font-weight: 700; font-size: 13pt; } @@ -290,6 +237,148 @@ stage { .unlock-dialog-clock .unlock-dialog-clock-time, #panel, .weather-button .weather-forecast-time, .world-clocks-button .world-clocks-timezone, .world-clocks-button .world-clocks-time, .events-button .event-time, .calendar .calendar-day-base { font-feature-settings: "tnum"; } +/* OSD Elements */ +#LookingGlassDialog, .screenshot-ui-panel, .workspace-switcher, .switcher-list, .resize-popup, .osd-monitor-label, .osd-window { + color: white; + background-color: #303340; + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 999px; + padding: 12px; } + +.lg-dialog StEntry { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.7); } + .lg-dialog StEntry:hover { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); } + .lg-dialog StEntry:focus { + transition-duration: 100ms; + background-color: rgba(231, 186, 231, 0.2875); + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7); + color: white; } + .lg-dialog StEntry:insensitive { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); + color: rgba(255, 255, 255, 0.5); } + .lg-dialog StEntry StLabel.hint-text { + color: rgba(255, 255, 255, 0.7); } + +#LookingGlassDialog .notebook-tab, #LookingGlassDialog > #Toolbar .lg-toolbar-button, .screenshot-ui-show-pointer-button, .screenshot-ui-type-button { + transition-duration: 100ms; + color: white; + background-color: #444853; } + #LookingGlassDialog .notebook-tab:insensitive, #LookingGlassDialog > #Toolbar .lg-toolbar-button:insensitive, .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + color: rgba(255, 255, 255, 0.5); + background-color: rgba(255, 255, 255, 0.05); } + #LookingGlassDialog .notebook-tab:focus, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus, .screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { + transition-duration: 100ms; + color: white; + background-color: #4e415b; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } + #LookingGlassDialog .notebook-tab:focus:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:hover, .screenshot-ui-show-pointer-button:focus:hover, .screenshot-ui-type-button:focus:hover { + background-color: #544763; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + #LookingGlassDialog .notebook-tab:focus:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:focus:active, .screenshot-ui-show-pointer-button:focus:active, .screenshot-ui-type-button:focus:active { + background-color: #5a4e6a; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + #LookingGlassDialog .notebook-tab:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:hover, .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover { + transition-duration: 100ms; + color: white; + background-color: #3d414b; } + #LookingGlassDialog .notebook-tab:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:active, .screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active { + transition-duration: 100ms; + color: white; + background-color: #363942; } + #LookingGlassDialog .notebook-tab:outlined, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined, .screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, #LookingGlassDialog .notebook-tab:checked, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked { + transition-duration: 100ms; + color: white; + background-color: #2f323a; } + #LookingGlassDialog .notebook-tab:outlined:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:hover, .screenshot-ui-show-pointer-button:outlined:hover, .screenshot-ui-type-button:outlined:hover, #LookingGlassDialog .notebook-tab:checked:hover, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:hover, .screenshot-ui-show-pointer-button:checked:hover, .screenshot-ui-type-button:checked:hover { + background-color: #606575; } + #LookingGlassDialog .notebook-tab:outlined:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:outlined:active, .screenshot-ui-show-pointer-button:outlined:active, .screenshot-ui-type-button:outlined:active, #LookingGlassDialog .notebook-tab:checked:active, #LookingGlassDialog > #Toolbar .lg-toolbar-button:checked:active, .screenshot-ui-show-pointer-button:checked:active, .screenshot-ui-type-button:checked:active { + background-color: #666c7d; } + +.screenshot-ui-show-pointer-button, .screenshot-ui-type-button { + transition-duration: 100ms; + background-color: transparent; + background-color: none; + box-shadow: none; } + .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); + background-color: transparent; + color: rgba(255, 255, 255, 0.5); } + .screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive { + transition-duration: 100ms; + background-color: transparent; + background-color: none; + box-shadow: none; } + .screenshot-ui-show-pointer-button:insensitive:insensitive, .screenshot-ui-type-button:insensitive:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); + background-color: transparent; + color: rgba(255, 255, 255, 0.5); } + +/* System Elements */ +.login-dialog-prompt-entry, .search-entry { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.7); } + .login-dialog-prompt-entry:hover, .search-entry:hover { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); } + .login-dialog-prompt-entry:focus, .search-entry:focus { + transition-duration: 100ms; + background-color: rgba(231, 186, 231, 0.2875); + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7); + color: white; } + .login-dialog-prompt-entry:insensitive, .search-entry:insensitive { + transition-duration: 100ms; + background-color: rgba(255, 255, 255, 0.25); + color: rgba(255, 255, 255, 0.5); } + .login-dialog-prompt-entry StLabel.hint-text, .search-entry StLabel.hint-text { + color: rgba(255, 255, 255, 0.7); } + +.login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button { + transition-duration: 100ms; + color: white; + background-color: #464a55; } + .login-dialog-button.cancel-button:insensitive, .login-dialog-button.switch-user-button:insensitive, .login-dialog-button.login-dialog-session-list-button:insensitive { + transition-duration: 100ms; + color: rgba(255, 255, 255, 0.5); + background-color: rgba(255, 255, 255, 0.05); } + .login-dialog-button.cancel-button:focus, .login-dialog-button.switch-user-button:focus, .login-dialog-button.login-dialog-session-list-button:focus { + transition-duration: 100ms; + color: white; + background-color: #4f435d; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } + .login-dialog-button.cancel-button:focus:hover, .login-dialog-button.switch-user-button:focus:hover, .login-dialog-button.login-dialog-session-list-button:focus:hover { + background-color: #564964; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .login-dialog-button.cancel-button:focus:active, .login-dialog-button.switch-user-button:focus:active, .login-dialog-button.login-dialog-session-list-button:focus:active { + background-color: #5c506c; + box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .login-dialog-button.cancel-button:hover, .login-dialog-button.switch-user-button:hover, .login-dialog-button.login-dialog-session-list-button:hover { + transition-duration: 100ms; + color: white; + background-color: #3f434d; } + .login-dialog-button.cancel-button:active, .login-dialog-button.switch-user-button:active, .login-dialog-button.login-dialog-session-list-button:active { + transition-duration: 100ms; + color: white; + background-color: #383b44; } + .login-dialog-button.cancel-button:outlined, .login-dialog-button.switch-user-button:outlined, .login-dialog-button.login-dialog-session-list-button:outlined, .login-dialog-button.cancel-button:checked, .login-dialog-button.switch-user-button:checked, .login-dialog-button.login-dialog-session-list-button:checked { + transition-duration: 100ms; + color: white; + background-color: #31343c; } + .login-dialog-button.cancel-button:outlined:hover, .login-dialog-button.switch-user-button:outlined:hover, .login-dialog-button.login-dialog-session-list-button:outlined:hover, .login-dialog-button.cancel-button:checked:hover, .login-dialog-button.switch-user-button:checked:hover, .login-dialog-button.login-dialog-session-list-button:checked:hover { + background-color: #626777; } + .login-dialog-button.cancel-button:outlined:active, .login-dialog-button.switch-user-button:outlined:active, .login-dialog-button.login-dialog-session-list-button:outlined:active, .login-dialog-button.cancel-button:checked:active, .login-dialog-button.switch-user-button:checked:active, .login-dialog-button.login-dialog-session-list-button:checked:active { + background-color: #696f7f; } + /* WIDGETS */ .shell-link { color: #710071; } @@ -313,11 +402,10 @@ StEntry StIcon.peek-password { padding: 0 4px; } StEntry StLabel.hint-text { - margin-left: 2px; - color: rgba(92, 97, 108, 0.7); } + margin-left: 2px; } /* Buttons */ -.button, .login-dialog-button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { +.button, .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { min-height: 22px; } .icon-button, .login-dialog-button.cancel-button, .login-dialog-button.switch-user-button, .login-dialog-button.login-dialog-session-list-button, .background-app-item .close-button { @@ -359,7 +447,7 @@ StEntry StLabel.hint-text { /* Slider */ .slider { -barlevel-height: 4px; - -barlevel-background-color: rgba(92, 97, 108, 0.4); + -barlevel-background-color: rgba(92, 97, 108, 0.2); -barlevel-border-width: 2px; -barlevel-border-color: transparent; -barlevel-active-background-color: #a400a4; @@ -437,15 +525,15 @@ StScrollBar { .popup-menu-item:focus, .popup-menu-item:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .popup-menu-item:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .popup-menu-item:checked { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #d7d7da; } .popup-menu-item:checked:hover { background-color: white; } .popup-menu-item:checked:active { @@ -460,7 +548,7 @@ StScrollBar { .popup-inactive-menu-item { color: #5c616c; } .popup-inactive-menu-item:insensitive { - color: #aeb0b6; } + color: #9da0a7; } .popup-menu-arrow, .popup-menu-icon { @@ -479,7 +567,7 @@ StScrollBar { padding: 9px 12px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; border-top-width: 0; } .popup-sub-menu .popup-menu-item:ltr { padding-left: 6px; } @@ -488,15 +576,15 @@ StScrollBar { .popup-sub-menu .popup-menu-item:focus, .popup-sub-menu .popup-menu-item:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .popup-sub-menu .popup-menu-item:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .popup-sub-menu .popup-menu-item:checked { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #d7d7da; } .popup-sub-menu .popup-menu-item:checked:hover { background-color: white; } .popup-sub-menu .popup-menu-item:checked:active { @@ -578,22 +666,27 @@ StScrollBar { .datemenu-today-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .datemenu-today-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .datemenu-today-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #e8d9ea; + background-color: #e8d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } .datemenu-today-button:focus:hover { - background-color: #f0e0f1; + background-color: #efdeef; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .datemenu-today-button:focus:active { - background-color: #f6e6f6; + background-color: #f6e5f6; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .datemenu-today-button:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); + background-color: transparent; } /* Calendar */ .calendar { @@ -614,22 +707,27 @@ StScrollBar { .calendar:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .calendar:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .calendar:focus { transition-duration: 100ms; color: #5c616c; - background-color: #e8d9ea; + background-color: #e8d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } .calendar:focus:hover { - background-color: #f0e0f1; + background-color: #efdeef; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .calendar:focus:active { - background-color: #f6e6f6; + background-color: #f6e5f6; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .calendar:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); + background-color: transparent; } .calendar .calendar-month-header .calendar-change-month-back StIcon, .calendar .calendar-month-header .calendar-change-month-forward StIcon { icon-size: 1.09em; } @@ -642,9 +740,9 @@ StScrollBar { margin: 2px; border-radius: 8px; } .calendar .calendar-month-header .pager-button:hover, .calendar .calendar-month-header .pager-button:focus { - background-color: #f2f2f2; } + background-color: #e8e8e8; } .calendar .calendar-month-header .pager-button:active { - background-color: #ededed; } + background-color: #e3e3e3; } .calendar .calendar-day-base { text-align: center; margin: 2px; @@ -654,29 +752,29 @@ StScrollBar { border-radius: 99px; transition-duration: 100ms; } .calendar .calendar-day-base:hover { - background-color: #f2f2f2; } + background-color: #e8e8e8; } .calendar .calendar-day-base:focus { background-color: #edcced; - color: #ffffff; + color: inherit; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6); } .calendar .calendar-day-base:active, .calendar .calendar-day-base:selected { - color: #50555e; - background-color: #ededed; } + color: #42464e; + background-color: #e3e3e3; } .calendar .calendar-day-base:active:focus, .calendar .calendar-day-base:selected:focus { - background-color: #dfbedf; } + background-color: #d6b6d6; } .calendar .calendar-day-base.calendar-day-heading { - color: #aeb0b6; + color: #9da0a7; padding-top: 6px; - height: 16px !important; + height: 1.1em !important; font-weight: 600; } .calendar .calendar-day { font-weight: 600; } .calendar .calendar-nonwork-day { - color: #aeb0b6; } + color: #9da0a7; } .calendar .calendar-other-month-day { color: rgba(92, 97, 108, 0.5); } .calendar .calendar-other-month-day.calendar-nonwork-day { - color: rgba(174, 176, 182, 0.5); } + color: rgba(157, 160, 167, 0.5); } .calendar .calendar-today { background-color: #a400a4; font-weight: 800; @@ -701,7 +799,7 @@ StScrollBar { padding: 0 6px; border-radius: 3px; background-color: rgba(92, 97, 108, 0.1); - color: #aeb0b6; } + color: #9da0a7; } /* Events */ .events-button { @@ -709,36 +807,40 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; padding: 12px; } .events-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .events-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .events-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #e8d9ea; + background-color: #e8d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } .events-button:focus:hover { - background-color: #f0e0f1; + background-color: #efdeef; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .events-button:focus:active { - background-color: #f6e6f6; + background-color: #f6e5f6; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .events-button:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .events-button .events-box { spacing: 6px; } .events-button .events-list { - spacing: 12px; } + spacing: 12px; + color: #5c616c; } .events-button .events-title { - color: #aeb0b6; margin-bottom: 4px; } .events-button .event-time { - color: #aeb0b6; } + color: #9da0a7; } /* World clocks */ .world-clocks-button { @@ -746,32 +848,36 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; padding: 12px; } .world-clocks-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .world-clocks-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .world-clocks-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #e8d9ea; + background-color: #e8d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } .world-clocks-button:focus:hover { - background-color: #f0e0f1; + background-color: #efdeef; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .world-clocks-button:focus:active { - background-color: #f6e6f6; + background-color: #f6e5f6; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .world-clocks-button:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .world-clocks-button .world-clocks-grid { spacing-rows: 6px; spacing-columns: 12px; } .world-clocks-button .world-clocks-header { - color: #aeb0b6; } + color: #9da0a7; } .world-clocks-button .world-clocks-city { color: #5c616c; } .world-clocks-button .world-clocks-time { @@ -781,7 +887,7 @@ StScrollBar { .world-clocks-button .world-clocks-time:rtl { text-align: left; } .world-clocks-button .world-clocks-timezone { - color: #aeb0b6; } + color: #9da0a7; } /* Weather */ .weather-button { @@ -789,33 +895,37 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; padding: 12px; } .weather-button:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .weather-button:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .weather-button:focus { transition-duration: 100ms; color: #5c616c; - background-color: #e8d9ea; + background-color: #e8d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } .weather-button:focus:hover { - background-color: #f0e0f1; + background-color: #efdeef; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .weather-button:focus:active { - background-color: #f6e6f6; + background-color: #f6e5f6; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .weather-button:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .weather-button .weather-box { spacing: 10px; } .weather-button .weather-header-box { spacing: 6px; } .weather-button .weather-header { - color: #aeb0b6; } + color: #9da0a7; } .weather-button .weather-header.location { font-weight: normal; } .weather-button .weather-grid { @@ -843,7 +953,7 @@ StScrollBar { padding-left: 6px; border-left-width: 1px; } .message-list .message-list-placeholder { - color: rgba(174, 176, 182, 0.5); } + color: #9da0a7; } .message-list .message-list-placeholder > StIcon { icon-size: 3.27em; margin-bottom: 12px; @@ -878,26 +988,30 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; } + background-color: #efeff0; } .message:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .message:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .message:focus { transition-duration: 100ms; color: #5c616c; - background-color: #e8d9ea; + background-color: #e8d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } .message:focus:hover { - background-color: #f0e0f1; + background-color: #efdeef; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .message:focus:active { - background-color: #f6e6f6; + background-color: #f6e5f6; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .message:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .message .message-icon-bin { padding: 18px; } .message .message-icon-bin:ltr { @@ -931,15 +1045,15 @@ StScrollBar { text-align: left; } .message .message-close-button { color: #5c616c; - background-color: rgba(92, 97, 108, 0.1); + background-color: rgba(92, 97, 108, 0.2); border-radius: 99px; padding: 5px; margin: 1px; } .message .message-close-button:hover { - background-color: rgba(92, 97, 108, 0.2); } + background-color: rgba(92, 97, 108, 0.3); } .message .message-close-button:active { - background-color: rgba(92, 97, 108, 0.1); } - .message .message-close-button StIcon { + background-color: rgba(92, 97, 108, 0.2); } + .message .message-close-button > StIcon { icon-size: 1.09em; } .message .message-body { color: #454850; } @@ -954,13 +1068,13 @@ StScrollBar { border-radius: 8px; color: #5c616c; } .message-media-control:hover { - background-color: white; + background-color: whitesmoke; color: #5c616c; } .message-media-control:active { - background-color: #fafafa; + background-color: #f0f0f0; color: #5c616c; } .message-media-control:insensitive { - color: #bbbdc2; } + color: #aaadb3; } .message-media-control:last-child:ltr { margin-right: 12px; } .message-media-control:last-child:rtl { @@ -986,7 +1100,7 @@ StScrollBar { .candidate-index { padding: 0; padding-right: 6px; - color: #aeb0b6; } + color: #9da0a7; } .candidate-box { padding: 6px 12px 6px 12px; @@ -995,8 +1109,8 @@ StScrollBar { background-color: #a400a4; color: #ffffff; } .candidate-box:hover { - background-color: #f2f2f2; - color: #50555e; } + background-color: #e8e8e8; + color: #474b53; } .candidate-page-button-box { height: 2em; } @@ -1181,7 +1295,7 @@ StScrollBar { .audio-selection-device { border-radius: 16px; } .audio-selection-device:hover, .audio-selection-device:focus { - background-color: #f2f2f2; } + background-color: #e8e8e8; } .audio-selection-device:active { background-color: #a400a4; color: #ffffff; } @@ -1270,21 +1384,21 @@ StScrollBar { .switcher-list .item-box { background-color: transparent; } .switcher-list .item-box:hover { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(92, 97, 108, 0.1); } .switcher-list .item-box:selected, .switcher-list .item-box:focus { - background-color: rgba(255, 255, 255, 0.13); } + background-color: rgba(92, 97, 108, 0.13); } .switcher-list .item-box:selected:hover, .switcher-list .item-box:focus:hover { - background-color: rgba(255, 255, 255, 0.16); } + background-color: rgba(92, 97, 108, 0.16); } .switcher-list .item-box:selected:active, .switcher-list .item-box:focus:active { - background-color: rgba(255, 255, 255, 0.13); } + background-color: rgba(92, 97, 108, 0.13); } .switcher-list .item-box:active { - background-color: rgba(255, 255, 255, 0.16); } + background-color: rgba(92, 97, 108, 0.16); } .switcher-list .item-box:outlined, .switcher-list .item-box:checked { - background-color: rgba(255, 255, 255, 0.19); } + background-color: rgba(92, 97, 108, 0.19); } .switcher-list .item-box:outlined:active, .switcher-list .item-box:checked:active { - background-color: rgba(255, 255, 255, 0.22); } + background-color: rgba(92, 97, 108, 0.22); } .switcher-list .item-box:outlined:hover, .switcher-list .item-box:checked:hover { - background-color: rgba(255, 255, 255, 0.25); } + background-color: rgba(92, 97, 108, 0.25); } .switcher-list .item-box:drop { border: 2px solid rgba(164, 0, 164, 0.8); background-color: rgba(164, 0, 164, 0.2); } @@ -1368,7 +1482,7 @@ StScrollBar { transition-duration: 200ms; border-radius: 99px; } .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:hover, .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:focus { - background-color: #f2f2f2; } + background-color: #e8e8e8; } .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 { @@ -1397,7 +1511,7 @@ StScrollBar { .screenshot-ui-shot-cast-button:hover, .screenshot-ui-shot-cast-button:focus { background-color: #464b5d; } .screenshot-ui-shot-cast-button:active { - background-color: #fafafa; } + background-color: #f0f0f0; } .screenshot-ui-shot-cast-button:checked { background-color: white; color: black; } @@ -1424,12 +1538,12 @@ StScrollBar { .screenshot-ui-area-selector-handle { border-radius: 99px; background-color: white; - box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.2); + box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.1); width: 24px; height: 24px; } .screenshot-ui-window-selector { - background-color: #272a34; } + background-color: #323643; } .screenshot-ui-window-selector .screenshot-ui-window-selector-window-container { margin: 100px; } .screenshot-ui-window-selector:primary-monitor .screenshot-ui-window-selector-window-container { @@ -1479,15 +1593,19 @@ StScrollBar { /* Top Bar */ #panel { - background-color: #000; + background-color: red; font-weight: bold; height: 2.2em; - transition-duration: 250ms; } + transition-duration: 250ms; + box-shadow: inset 0 -1px 0 0 #f50000; } #panel.unlock-screen, #panel.login-screen, #panel:overview { - background-color: transparent; } + background-color: transparent; + box-shadow: none; } + #panel.unlock-screen .panel-button, #panel.login-screen .panel-button, #panel:overview .panel-button { + color: white !important; } #panel .panel-button { font-weight: bold; - color: white; + color: #5c616c; -natural-hpadding: 12px; -minimum-hpadding: 6px; transition-duration: 150ms; @@ -1508,31 +1626,31 @@ StScrollBar { #panel .panel-button.screen-recording-indicator StIcon, #panel .panel-button.screen-sharing-indicator StIcon { icon-size: 1.09em; } #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.2); } #panel .panel-button:active.clock-display, #panel .panel-button:overview.clock-display, #panel .panel-button:focus.clock-display, #panel .panel-button:checked.clock-display { box-shadow: none; } #panel .panel-button:active.clock-display .clock, #panel .panel-button:overview.clock-display .clock, #panel .panel-button:focus.clock-display .clock, #panel .panel-button:checked.clock-display .clock { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.2); } #panel .panel-button:active.screen-recording-indicator, #panel .panel-button:overview.screen-recording-indicator, #panel .panel-button:focus.screen-recording-indicator, #panel .panel-button:checked.screen-recording-indicator { box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.85); } #panel .panel-button:active.screen-sharing-indicator, #panel .panel-button:overview.screen-sharing-indicator, #panel .panel-button:focus.screen-sharing-indicator, #panel .panel-button:checked.screen-sharing-indicator { box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.85); } #panel .panel-button:hover { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.15); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.15); } #panel .panel-button:hover.clock-display { box-shadow: none; } #panel .panel-button:hover.clock-display .clock { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.15); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.15); } #panel .panel-button:hover.screen-recording-indicator { box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.9); } #panel .panel-button:hover.screen-sharing-indicator { box-shadow: inset 0 0 0 100px rgba(253, 125, 0, 0.9); } #panel .panel-button:active:hover, #panel .panel-button:overview:hover, #panel .panel-button:focus:hover, #panel .panel-button:checked:hover { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.25); } #panel .panel-button:active:hover.clock-display, #panel .panel-button:overview:hover.clock-display, #panel .panel-button:focus:hover.clock-display, #panel .panel-button:checked:hover.clock-display { box-shadow: none; } #panel .panel-button:active:hover.clock-display .clock, #panel .panel-button:overview:hover.clock-display .clock, #panel .panel-button:focus:hover.clock-display .clock, #panel .panel-button:checked:hover.clock-display .clock { - box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.25); } + box-shadow: inset 0 0 0 100px rgba(92, 97, 108, 0.25); } #panel .panel-button:active:hover.screen-recording-indicator, #panel .panel-button:overview:hover.screen-recording-indicator, #panel .panel-button:focus:hover.screen-recording-indicator, #panel .panel-button:checked:hover.screen-recording-indicator { box-shadow: inset 0 0 0 100px rgba(191, 23, 23, 0.8); } #panel .panel-button:active:hover.screen-sharing-indicator, #panel .panel-button:overview:hover.screen-sharing-indicator, #panel .panel-button:focus:hover.screen-sharing-indicator, #panel .panel-button:checked:hover.screen-sharing-indicator { @@ -1615,7 +1733,7 @@ StScrollBar { .quick-settings { padding: 18px; border-radius: 36px; } - .quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button, .quick-settings .login-dialog-button { + .quick-settings .icon-button, .quick-settings .login-dialog-button.cancel-button, .quick-settings .login-dialog-button.switch-user-button, .quick-settings .login-dialog-button.login-dialog-session-list-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button { padding: 10.5px; } .quick-settings-grid { @@ -1652,7 +1770,7 @@ StScrollBar { color: rgba(255, 255, 255, 0.5); } .quick-toggle > StBoxLayout { spacing: 9px; } - .quick-toggle.button, .quick-toggle.login-dialog-button, .quick-toggle.icon-button, .background-app-item .quick-toggle.close-button { + .quick-toggle.button, .quick-toggle.icon-button, .quick-toggle.login-dialog-button.cancel-button, .quick-toggle.login-dialog-button.switch-user-button, .quick-toggle.login-dialog-button.login-dialog-session-list-button, .background-app-item .quick-toggle.close-button { padding: 0; } .quick-toggle > StBoxLayout { padding: 0 12px; } @@ -1673,8 +1791,12 @@ StScrollBar { max-width: auto; } .quick-menu-toggle .quick-toggle:ltr { border-radius: 99px 0 0 99px; } + .quick-menu-toggle .quick-toggle:ltr > StBoxLayout { + padding-right: 9px; } .quick-menu-toggle .quick-toggle:rtl { border-radius: 0 99px 99px 0; } + .quick-menu-toggle .quick-toggle:rtr > StBoxLayout { + padding-left: 9px; } .quick-menu-toggle .quick-toggle:ltr:last-child { border-radius: 99px; } .quick-menu-toggle .quick-toggle:rtl:last-child { @@ -1722,13 +1844,13 @@ StScrollBar { .quick-slider .slider-bin:focus { transition-duration: 100ms; color: #5c616c; - background-color: #e8d9ea; + background-color: #e8d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } .quick-slider .slider-bin:focus:hover { - background-color: #f0e0f1; + background-color: #efdeef; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .quick-slider .slider-bin:focus:active { - background-color: #f6e6f6; + background-color: #f6e5f6; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .quick-toggle-menu { @@ -1736,29 +1858,35 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; + background-color: #ffffff !important; + color: #5c616c !important; border-radius: 24px; padding: 12px; margin: 12px 18px 0; } .quick-toggle-menu:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .quick-toggle-menu:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .quick-toggle-menu:focus { transition-duration: 100ms; color: #5c616c; - background-color: #e8d9ea; + background-color: #e8d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } .quick-toggle-menu:focus:hover { - background-color: #f0e0f1; + background-color: #efdeef; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .quick-toggle-menu:focus:active { - background-color: #f6e6f6; + background-color: #f6e5f6; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .quick-toggle-menu:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .quick-toggle-menu .popup-menu-item > StIcon { -st-icon-style: symbolic; } .quick-toggle-menu .header { @@ -1771,7 +1899,8 @@ StScrollBar { padding: 9px; background-color: rgba(92, 97, 108, 0.2); } .quick-toggle-menu .header .icon.active { - background-color: #a400a4; } + background-color: #a400a4; + color: #ffffff; } .quick-settings-system-item > StBoxLayout { spacing: 12px; } @@ -1782,7 +1911,7 @@ StScrollBar { .quick-settings-system-item .power-item:insensitive { transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; + background-color: #efeff0; background-color: transparent; } .nm-network-item .wireless-secure-icon { @@ -1791,7 +1920,7 @@ StScrollBar { .bt-device-item .popup-menu-icon { -st-icon-style: symbolic; } -.bt-menu-placeholder { +.bt-menu-placeholder.popup-menu-item { text-align: center; padding: 2em 4em; } @@ -1829,7 +1958,7 @@ StScrollBar { spacing: 6px; } .window-close, .screenshot-ui-close-button { - background-color: rgba(63, 68, 84, 0.98); + background-color: rgba(65, 70, 87, 0.98); color: white; border-radius: 99px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1); @@ -1840,14 +1969,14 @@ StScrollBar { .window-close StIcon, .screenshot-ui-close-button StIcon { icon-size: 24px; } .window-close:hover, .screenshot-ui-close-button:hover { - background-color: rgba(78, 84, 104, 0.98); } + background-color: rgba(81, 87, 107, 0.98); } .window-close:active, .screenshot-ui-close-button:active { - background-color: rgba(91, 98, 122, 0.98); } + background-color: rgba(94, 101, 125, 0.98); } .workspace-background { border-radius: 30px; background-color: rgba(3, 2, 1, 0); - box-shadow: 0 4px 16px 4px rgba(0, 0, 0, 0.3); } + box-shadow: 0 4px 16px 4px rgba(0, 0, 0, 0.1); } .search-entry { border-radius: 99px; @@ -1873,10 +2002,9 @@ StScrollBar { background-color: transparent; } .search-section-content { - background-color: #323643; - border-radius: 24px; - box-shadow: inset 0 0 0 1px solid rgba(255, 255, 255, 0.8); + background-color: #3d3f48; color: white; + border-radius: 24px; padding: 12px; margin: 0 12px; } @@ -1903,6 +2031,9 @@ StScrollBar { border: 2px solid rgba(164, 0, 164, 0.8); background-color: rgba(164, 0, 164, 0.2); } +.search-statustext { + color: rgba(255, 255, 255, 0.8); } + .grid-search-results { spacing: 30px; margin: 0 12px; } @@ -1929,7 +2060,7 @@ StScrollBar { spacing: 12px; } .list-search-result .list-search-result-description { - color: #97999f; } + color: #989aa1; } /* Dash */ #dash { @@ -1945,7 +2076,7 @@ StScrollBar { margin-bottom: 14px; } .dash-background { - background-color: #323643; + background-color: #3d3f48; border-radius: 28px; padding: 12px; spacing: 6px; @@ -1969,7 +2100,7 @@ StScrollBar { .dash-item-container .show-apps .overview-icon { background-color: transparent; } .dash-item-container .show-apps:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .dash-item-container .show-apps:selected .overview-icon, .dash-item-container .show-apps:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .dash-item-container .show-apps:selected .overview-icon:hover .overview-icon, .dash-item-container .show-apps:focus .overview-icon:hover .overview-icon { @@ -1989,12 +2120,13 @@ StScrollBar { background-color: rgba(164, 0, 164, 0.2); } .dash-item-container .show-apps, .dash-item-container .app-well-app, .dash-item-container .grid-search-result { - padding-bottom: 12px; } + padding-bottom: 12px; + color: white; } .dash-separator { width: 1px; margin: 0 4px; - background-color: #d9d9d9; + background-color: rgba(255, 255, 255, 0.1); margin-bottom: 12px; } .dash-label { @@ -2017,7 +2149,7 @@ StScrollBar { .app-well-app .overview-icon, .grid-search-result .overview-icon { background-color: transparent; } .app-well-app:hover .overview-icon, .grid-search-result:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app:selected .overview-icon, .grid-search-result:selected .overview-icon, .app-well-app:focus .overview-icon, .grid-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .app-well-app:selected .overview-icon:hover .overview-icon, .grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app:focus .overview-icon:hover .overview-icon, .grid-search-result:focus .overview-icon:hover .overview-icon { @@ -2037,30 +2169,31 @@ StScrollBar { background-color: rgba(164, 0, 164, 0.2); } .app-well-app .overview-icon, .grid-search-result .overview-icon { padding: 12px; - border-radius: 24px; } + border-radius: 24px; + color: white; } .app-well-app .overview-icon.overview-icon-with-label > StBoxLayout, .grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout { spacing: 6px; } .app-well-app.app-folder, .app-folder.grid-search-result { transition-duration: 400ms; } .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon { - background-color: rgba(92, 97, 108, 0.07); } + background-color: rgba(255, 255, 255, 0.07); } .app-well-app.app-folder:hover .overview-icon, .app-folder.grid-search-result:hover .overview-icon { - background-color: rgba(92, 97, 108, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon, .app-folder.grid-search-result:selected .overview-icon, .app-well-app.app-folder:focus .overview-icon, .app-folder.grid-search-result:focus .overview-icon { - background-color: rgba(92, 97, 108, 0.13); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon:hover .overview-icon, .app-folder.grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app.app-folder:focus .overview-icon:hover .overview-icon, .app-folder.grid-search-result:focus .overview-icon:hover .overview-icon { - background-color: rgba(92, 97, 108, 0.16); } + background-color: rgba(255, 255, 255, 0.16); } .app-well-app.app-folder:selected .overview-icon:active .overview-icon, .app-folder.grid-search-result:selected .overview-icon:active .overview-icon, .app-well-app.app-folder:focus .overview-icon:active .overview-icon, .app-folder.grid-search-result:focus .overview-icon:active .overview-icon { - background-color: rgba(92, 97, 108, 0.13); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:active .overview-icon, .app-folder.grid-search-result:active .overview-icon { - background-color: rgba(92, 97, 108, 0.16); } + background-color: rgba(255, 255, 255, 0.16); } .app-well-app.app-folder:outlined .overview-icon, .app-folder.grid-search-result:outlined .overview-icon, .app-well-app.app-folder:checked .overview-icon, .app-folder.grid-search-result:checked .overview-icon { - background-color: rgba(92, 97, 108, 0.19); } + background-color: rgba(255, 255, 255, 0.19); } .app-well-app.app-folder:outlined .overview-icon:active .overview-icon, .app-folder.grid-search-result:outlined .overview-icon:active .overview-icon, .app-well-app.app-folder:checked .overview-icon:active .overview-icon, .app-folder.grid-search-result:checked .overview-icon:active .overview-icon { - background-color: rgba(92, 97, 108, 0.22); } + background-color: rgba(255, 255, 255, 0.22); } .app-well-app.app-folder:outlined .overview-icon:hover .overview-icon, .app-folder.grid-search-result:outlined .overview-icon:hover .overview-icon, .app-well-app.app-folder:checked .overview-icon:hover .overview-icon, .app-folder.grid-search-result:checked .overview-icon:hover .overview-icon { - background-color: rgba(92, 97, 108, 0.25); } + background-color: rgba(255, 255, 255, 0.25); } .app-well-app.app-folder:drop .overview-icon, .app-folder.grid-search-result:drop .overview-icon { border: 2px solid rgba(164, 0, 164, 0.8); background-color: rgba(164, 0, 164, 0.2); } @@ -2127,7 +2260,7 @@ StScrollBar { padding: 0; } .system-action-icon { - background-color: rgba(0, 0, 0, 0.8); + background-color: rgba(255, 255, 255, 0.1); color: white; border-radius: 99px; icon-size: 48px; } @@ -2153,6 +2286,8 @@ StScrollBar { width: 24px; height: 24px; border-radius: 99px; } + .page-navigation-arrow > StIcon { + color: white; } .page-navigation-arrow:insensitive { transition-duration: 100ms; background-color: transparent; @@ -2167,11 +2302,11 @@ StScrollBar { .page-navigation-arrow:hover { transition-duration: 100ms; color: white; - background-color: rgba(102, 105, 115, 0.545); } + background-color: rgba(94, 97, 106, 0.55); } .page-navigation-arrow:active { transition-duration: 100ms; color: white; - background-color: rgba(117, 120, 131, 0.545); } + background-color: rgba(87, 89, 98, 0.55); } /* Workspace pager */ .workspace-thumbnails { @@ -2180,7 +2315,7 @@ StScrollBar { padding: 6px; } .workspace-thumbnails .workspace-thumbnail { color: white; - background-color: #3d4251; + background-color: #484d60; border-radius: 4px; border: 1px solid transparent; } .workspace-thumbnails .placeholder { @@ -2236,7 +2371,7 @@ StScrollBar { background-color: white; } .hidden { - color: rgba(0, 0, 0, 0); } + color: transparent; } .caps-lock-warning-label { text-align: center; @@ -2245,7 +2380,7 @@ StScrollBar { /* Workspace animation */ .workspace-animation { - background-color: #272a34; } + background-color: #323643; } /* Tiled window previews */ .tile-preview { @@ -2416,11 +2551,10 @@ StScrollBar { /* Looking Glass */ #LookingGlassDialog { - background-color: rgba(255, 255, 255, 0.95); + background-color: rgba(48, 51, 64, 0.98); + color: white; border-radius: 0 0 16px 16px; - border: 1px solid rgba(255, 255, 255, 0.8); border-top-width: 0; - color: #5c616c; padding: 6px; spacing: 6px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1); } @@ -2459,11 +2593,11 @@ StScrollBar { color: #3e003e; } .lg-dialog .actor-link { - color: #aeb0b6; } + color: #9da0a7; } .lg-dialog .actor-link:hover { - color: #e4e4e6; } + color: #d3d4d7; } .lg-dialog .actor-link:active { - color: #787c86; } + color: #696d75; } .lg-dialog .actor-link StIcon { icon-size: 12px; } @@ -2493,26 +2627,30 @@ StScrollBar { margin: 4px; transition-duration: 100ms; color: #5c616c; - background-color: #f0f1f2; } + background-color: #efeff0; } .lg-extension:hover { transition-duration: 100ms; color: #5c616c; - background-color: #f8f9f9; } + background-color: #e7e7e9; } .lg-extension:active { transition-duration: 100ms; color: #5c616c; - background-color: white; } + background-color: #dfdfe1; } .lg-extension:focus { transition-duration: 100ms; color: #5c616c; - background-color: #e8d9ea; + background-color: #e8d7e8; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.6) !important; } .lg-extension:focus:hover { - background-color: #f0e0f1; + background-color: #efdeef; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } .lg-extension:focus:active { - background-color: #f6e6f6; + background-color: #f6e5f6; box-shadow: inset 0 0 0 2px rgba(164, 0, 164, 0.7) !important; } + .lg-extension:insensitive { + transition-duration: 100ms; + color: rgba(92, 97, 108, 0.5); + background-color: rgba(92, 97, 108, 0.05); } .lg-extension-meta { spacing: 6px; } @@ -2524,13 +2662,13 @@ StScrollBar { padding: 6px; } .lg-debug-flag-button { - color: #5c616c; } + color: white; } .lg-debug-flag-button StLabel { padding: 6px, 12px; } .lg-debug-flag-button:hover { - color: #8f949f; } + color: white; } .lg-debug-flag-button:active { - color: #2d3035; } + color: #cccccc; } .lg-debug-flags-header { padding-top: 12px; @@ -2544,7 +2682,7 @@ StScrollBar { /* Login Dialog */ .login-dialog { - background-color: #272a34; } + background-color: #323643; } .login-dialog-button.cancel-button { padding: 9px; } @@ -2653,7 +2791,7 @@ StScrollBar { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6); } #lockDialogGroup { - background-color: #272a34; } + background-color: #323643; } .unlock-dialog-clock { color: white; @@ -2794,7 +2932,8 @@ StScrollBar { /* Top Bar */ #panel { background: rgba(255, 255, 255, 0.8); - text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } + text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); + box-shadow: none; } #panel StIcon { icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #panel.unlock-screen, #panel.login-screen, #panel.lock-screen, #panel:overview { @@ -2877,7 +3016,7 @@ StScrollBar { .app-well-app.app-folder .overview-icon, .app-folder.grid-search-result .overview-icon { background-color: rgba(255, 255, 255, 0.07); } .app-well-app.app-folder:hover .overview-icon, .app-folder.grid-search-result:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.1); } + background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon, .app-folder.grid-search-result:selected .overview-icon, .app-well-app.app-folder:focus .overview-icon, .app-folder.grid-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.13); } .app-well-app.app-folder:selected .overview-icon:hover .overview-icon, .app-folder.grid-search-result:selected .overview-icon:hover .overview-icon, .app-well-app.app-folder:focus .overview-icon:hover .overview-icon, .app-folder.grid-search-result:focus .overview-icon:hover .overview-icon { diff --git a/share/themes/Kali-Purple-Light/gtk-3.0/gtk-dark.css b/share/themes/Kali-Purple-Light/gtk-3.0/gtk-dark.css index 50b383be..32bf9278 100644 --- a/share/themes/Kali-Purple-Light/gtk-3.0/gtk-dark.css +++ b/share/themes/Kali-Purple-Light/gtk-3.0/gtk-dark.css @@ -581,7 +581,7 @@ button { notebook > header > tabs > arrow:disabled, button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -590,7 +590,7 @@ button { button:disabled:active, button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#16181d); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } notebook > header > tabs > arrow.image-button, @@ -877,7 +877,7 @@ button.suggested-action { button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -1023,7 +1023,7 @@ button.destructive-action { button.destructive-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -1186,14 +1186,14 @@ stacksidebar row.needs-attention > label, .stack-switcher > button.needs-attenti -gtk-icon-shadow: none; } .inline-toolbar toolbutton > button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:disabled:active, .inline-toolbar toolbutton > button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#16181d); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:backdrop { @@ -1840,7 +1840,7 @@ headerbar { .selection-mode .titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode.titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode headerbar button.suggested-action:disabled, headerbar.selection-mode button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -2702,7 +2702,7 @@ switch { border: 1px solid black; } switch:disabled slider { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -3160,7 +3160,7 @@ scale { border-color: #0b000b; } scale slider:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; @@ -4271,7 +4271,7 @@ infobar { -gtk-icon-shadow: none; } infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); text-shadow: none; -gtk-icon-shadow: none; diff --git a/share/themes/Kali-Purple-Light/gtk-3.0/gtk.css b/share/themes/Kali-Purple-Light/gtk-3.0/gtk.css index 8a8cf8a5..f9489a47 100644 --- a/share/themes/Kali-Purple-Light/gtk-3.0/gtk.css +++ b/share/themes/Kali-Purple-Light/gtk-3.0/gtk.css @@ -49,7 +49,7 @@ color: #5c616c; background-color: #e6e6e6; } .gtkstyle-fallback:disabled { - color: #aeb0b6; + color: #9da0a7; background-color: #fdfdfd; } .gtkstyle-fallback:selected { color: #ffffff; @@ -76,7 +76,7 @@ textview text { .view text:disabled, iconview text:disabled, textview text:disabled { - color: #aeb0b6; + color: #9da0a7; background-color: #fdfdfd; } .view:selected:focus, iconview:selected:focus, .view:selected, iconview:selected, .view text:selected:focus, @@ -122,7 +122,7 @@ label { background-color: #a400a4; color: #ffffff; } label:disabled { - color: #aeb0b6; } + color: #9da0a7; } button label:disabled { color: inherit; } label:disabled:backdrop { @@ -266,7 +266,7 @@ entry { border-color: #a400a4; } spinbutton:disabled:not(.vertical), entry:disabled { - color: #aeb0b6; + color: #9da0a7; border-color: #d9d9d9; background-color: #fdfdfd; box-shadow: none; } @@ -580,8 +580,8 @@ button { -gtk-icon-shadow: none; } notebook > header > tabs > arrow:disabled, button:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -589,8 +589,8 @@ button { notebook > header > tabs > arrow:disabled:active, notebook > header > tabs > arrow:disabled:checked, button:disabled:active, button:disabled:checked { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#eaeaea); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } notebook > header > tabs > arrow.image-button, @@ -879,8 +879,8 @@ button.suggested-action { color: rgba(164, 0, 164, 0.8); } button.suggested-action:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -1025,8 +1025,8 @@ button.destructive-action { color: rgba(212, 25, 25, 0.8); } button.destructive-action:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -1188,15 +1188,15 @@ stacksidebar row.needs-attention > label, .stack-switcher > button.needs-attenti text-shadow: none; -gtk-icon-shadow: none; } .inline-toolbar toolbutton > button:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:disabled:active, .inline-toolbar toolbutton > button:disabled:checked { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#eaeaea); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } .inline-toolbar toolbutton > button:backdrop { @@ -1438,7 +1438,7 @@ spinbutton { color: #5c616c; background-color: rgba(92, 97, 108, 0.05); } spinbutton:not(.vertical) button:disabled { - color: rgba(174, 176, 182, 0.3); + color: rgba(157, 160, 167, 0.3); background-color: transparent; } spinbutton:not(.vertical) button:active { background-color: rgba(0, 0, 0, 0.1); @@ -1513,7 +1513,7 @@ spinbutton { .osd spinbutton:not(.vertical) button:dir(rtl):first-child { border-radius: 4px 0 0 4px; } spinbutton.vertical:disabled { - color: #aeb0b6; } + color: #9da0a7; } spinbutton.vertical:backdrop:disabled { color: #d9d9d9; } spinbutton.vertical:drop(active) { @@ -1848,8 +1848,8 @@ headerbar { border-color: #580058; } .selection-mode .titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode.titlebar:not(headerbar) button.suggested-action:disabled, .selection-mode headerbar button.suggested-action:disabled, headerbar.selection-mode button.suggested-action:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -2024,7 +2024,7 @@ treeview.view { border-left-color: #d280d2; border-top-color: rgba(92, 97, 108, 0.1); } treeview.view:disabled { - color: #aeb0b6; } + color: #9da0a7; } treeview.view:disabled:selected { color: #c866c8; } treeview.view:disabled:selected:backdrop { @@ -2161,7 +2161,7 @@ menubar, color: #710071; } menubar > menuitem:disabled, .menubar > menuitem:disabled { - color: #aeb0b6; + color: #9da0a7; box-shadow: none; } menubar .csd.popup decoration, .menubar .csd.popup decoration { @@ -2199,7 +2199,7 @@ menu, menu menuitem:disabled, .menu menuitem:disabled, .context-menu menuitem:disabled { - color: #aeb0b6; } + color: #9da0a7; } menu menuitem:disabled:backdrop, .menu menuitem:disabled:backdrop, .context-menu menuitem:disabled:backdrop { @@ -2671,7 +2671,7 @@ switch { background-color: #a400a4; text-shadow: 0 1px rgba(88, 0, 88, 0.5), 0 0 2px rgba(255, 255, 255, 0.6); } switch:disabled { - color: #aeb0b6; + color: #9da0a7; border-color: #d9d9d9; background-color: #fdfdfd; text-shadow: none; } @@ -2713,8 +2713,8 @@ switch { switch:checked > slider { border: 1px solid #3e003e; } switch:disabled slider { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -3181,8 +3181,8 @@ scale { scale slider:active { border-color: #580058; } scale slider:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -4014,7 +4014,7 @@ expander title > arrow { expander title > arrow:hover { color: #aaaeb7; } expander title > arrow:disabled { - color: #aeb0b6; } + color: #9da0a7; } expander title > arrow:disabled:backdrop { color: #d9d9d9; } expander title > arrow:checked { @@ -4039,9 +4039,9 @@ calendar { calendar.button:backdrop { color: rgba(174, 176, 182, 0.45); } calendar.button:disabled { - color: rgba(174, 176, 182, 0.45); } + color: rgba(157, 160, 167, 0.45); } calendar.highlight { - color: #aeb0b6; } + color: #9da0a7; } calendar.highlight:backdrop { color: #d9d9d9; } calendar:backdrop { @@ -4144,7 +4144,7 @@ placessidebar row { placessidebar row:selected { color: #ffffff; } placessidebar row:disabled { - color: #aeb0b6; } + color: #9da0a7; } placessidebar row:backdrop { color: #aeb0b6; } placessidebar row:backdrop:selected { @@ -4292,8 +4292,8 @@ infobar { text-shadow: none; -gtk-icon-shadow: none; } infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); text-shadow: none; -gtk-icon-shadow: none; @@ -4766,7 +4766,7 @@ row.expander { row.expander:checked image.expander-row-arrow:not(:disabled) { color: #a400a4; } row.expander image.expander-row-arrow:disabled { - color: #aeb0b6; } + color: #9da0a7; } flap > dimming, deck > dimming, @@ -6461,7 +6461,7 @@ wnck-pager { color: #5c616c; font-weight: normal; } .budgie-popover:not(.budgie-menu) button.flat:not(.image-button):disabled { - color: #aeb0b6; } + color: #9da0a7; } .budgie-popover.budgie-menu .container { padding: 0; } .budgie-popover.user-menu .container { @@ -6757,7 +6757,7 @@ base background color of insensitive widgets */ @define-color insensitive_bg_color #fdfdfd; /* text foreground color of insensitive widgets */ -@define-color insensitive_fg_color #aeb0b6; +@define-color insensitive_fg_color #9da0a7; /* insensitive text widgets and the like base background color */ @define-color insensitive_base_color #fafafa; diff --git a/share/themes/Kali-Purple-Light/gtk-4.0/gtk-dark.css b/share/themes/Kali-Purple-Light/gtk-4.0/gtk-dark.css index 9f1ce136..4fb94e6e 100644 --- a/share/themes/Kali-Purple-Light/gtk-4.0/gtk-dark.css +++ b/share/themes/Kali-Purple-Light/gtk-4.0/gtk-dark.css @@ -526,14 +526,14 @@ button { notebook > header > tabs > arrow:disabled, button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); -gtk-icon-filter: opacity(0.5); } notebook > header > tabs > arrow:disabled:active, notebook > header > tabs > arrow:disabled:checked, button:disabled:active, button:disabled:checked { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#1a1c23); box-shadow: none; } button.sidebar-button, notebook > header > tabs > arrow, windowcontrols button, notebook > header > tabs > arrow.flat, @@ -746,7 +746,7 @@ button.suggested-action { button.suggested-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } button.suggested-action:disabled:active, @@ -831,7 +831,7 @@ button.destructive-action { button.destructive-action:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } button.destructive-action:disabled:active, @@ -1014,7 +1014,7 @@ modelbutton.flat arrow { box-shadow: none; } .toolbar button:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } .toolbar button:backdrop { color: #888a8d; @@ -2178,7 +2178,7 @@ switch { border: 1px solid #0b000b; } switch:disabled > slider { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } row:selected switch { outline-color: rgba(255, 255, 255, 0.3); } @@ -2449,7 +2449,7 @@ progressbar > trough, scale > trough > fill, scale > trough { background-color: #0a0a0d; } progressbar > trough:disabled, scale > trough > fill:disabled, scale > trough:disabled { background-color: #242731; - border-color: #0d0e11; } + border-color: #17191f; } row:selected progressbar > trough, row:selected scale > trough > fill, row:selected scale > trough { outline-color: rgba(255, 255, 255, 0.3); border-color: #0b000b; } @@ -2538,7 +2538,7 @@ scale { border-color: #0b000b; } scale > trough > slider:disabled { color: #888a8d; - border-color: #0d0e11; + border-color: #17191f; background-image: image(#242731); } row:selected scale > trough > slider:disabled, row:selected scale > trough > slider { border-color: #0b000b; } diff --git a/share/themes/Kali-Purple-Light/gtk-4.0/gtk.css b/share/themes/Kali-Purple-Light/gtk-4.0/gtk.css index 1649d99f..e6d8c27e 100644 --- a/share/themes/Kali-Purple-Light/gtk-4.0/gtk.css +++ b/share/themes/Kali-Purple-Light/gtk-4.0/gtk.css @@ -29,7 +29,7 @@ textview > text { background-color: #fafafa; } .view:disabled, iconview:disabled, textview > text:disabled { - color: #aeb0b6; + color: #9da0a7; background-color: #fdfdfd; } .view:selected:focus, iconview:selected:focus, .view:selected, iconview:selected, textview > text:selected:focus, @@ -120,7 +120,7 @@ label { background-color: #a400a4; color: #ffffff; } label:disabled { - color: #aeb0b6; } + color: #9da0a7; } button label:disabled { color: inherit; } label.error { @@ -271,7 +271,7 @@ entry { /* We hide placeholders on focus */ } spinbutton.vertical > text:disabled, spinbutton:disabled:not(.vertical), entry:disabled { - color: #aeb0b6; + color: #9da0a7; border-color: #d9d9d9; background-color: #fdfdfd; } spinbutton.vertical > text.error, spinbutton.error:not(.vertical), @@ -525,15 +525,15 @@ button { box-shadow: none; } notebook > header > tabs > arrow:disabled, button:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); -gtk-icon-filter: opacity(0.5); } notebook > header > tabs > arrow:disabled:active, notebook > header > tabs > arrow:disabled:checked, button:disabled:active, button:disabled:checked { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#eaeaea); box-shadow: none; } button.sidebar-button, notebook > header > tabs > arrow, windowcontrols button, notebook > header > tabs > arrow.flat, @@ -748,8 +748,8 @@ button.suggested-action { color: rgba(164, 0, 164, 0.8); } button.suggested-action:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); } button.suggested-action:disabled:active, @@ -833,8 +833,8 @@ button.destructive-action { color: rgba(212, 25, 25, 0.8); } button.destructive-action:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); } button.destructive-action:disabled:active, @@ -988,7 +988,7 @@ modelbutton.flat { modelbutton.flat:hover { background-color: #eaebec; } modelbutton.flat:disabled { - color: #aeb0b6; } + color: #9da0a7; } modelbutton.flat arrow { background: none; @@ -1016,8 +1016,8 @@ modelbutton.flat arrow { background-image: image(#dbdbdb); box-shadow: none; } .toolbar button:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); } .toolbar button:backdrop { color: #aeb0b6; @@ -1186,7 +1186,7 @@ spinbutton { background-color: #f2f2f2; } spinbutton:not(.vertical) > button.image-button.up:not(.flat):disabled, spinbutton:not(.vertical) > button.image-button.down:not(.flat):disabled { - color: rgba(174, 176, 182, 0.3); + color: rgba(157, 160, 167, 0.3); background-color: transparent; } spinbutton:not(.vertical) > button.image-button.up:not(.flat):active, spinbutton:not(.vertical) > button.image-button.down:not(.flat):active { @@ -1241,7 +1241,7 @@ spinbutton { .osd spinbutton:not(.vertical) > button.image-button.down:not(.flat):dir(rtl):first-child { border-radius: 4px 0 0 4px; } spinbutton.vertical:disabled { - color: #aeb0b6; } + color: #9da0a7; } spinbutton.vertical:drop(active) { border-color: transparent; box-shadow: none; } @@ -1607,7 +1607,7 @@ treeview.view { outline-color: rgba(255, 255, 255, 0.8); } columnview.view:disabled, treeview.view:disabled { - color: #aeb0b6; } + color: #9da0a7; } columnview.view:disabled:selected, treeview.view:disabled:selected { color: #c866c8; } @@ -1888,7 +1888,7 @@ menubar { box-shadow: inset 0 -3px #a400a4; color: #710071; } menubar > item:disabled { - color: #aeb0b6; + color: #9da0a7; box-shadow: none; } menubar > item popover.menu.background > contents { padding: 5px; } @@ -2161,7 +2161,7 @@ switch { border-color: #580058; background-color: #a400a4; } switch:disabled { - color: #aeb0b6; + color: #9da0a7; border-color: #d9d9d9; background-color: #fdfdfd; text-shadow: none; } @@ -2188,8 +2188,8 @@ switch { switch:checked > slider { border: 1px solid #580058; } switch:disabled > slider { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); } row:selected switch { outline-color: rgba(255, 255, 255, 0.8); @@ -2467,7 +2467,7 @@ progressbar > trough, scale > trough > fill, scale > trough { background-color: #dedede; } progressbar > trough:disabled, scale > trough > fill:disabled, scale > trough:disabled { background-color: #fdfdfd; - border-color: #d9d9d9; } + border-color: #e6e6e6; } row:selected progressbar > trough, row:selected scale > trough > fill, row:selected scale > trough { outline-color: rgba(255, 255, 255, 0.8); border-color: #580058; } @@ -2555,8 +2555,8 @@ scale { scale > trough > slider:active { border-color: #580058; } scale > trough > slider:disabled { - color: #aeb0b6; - border-color: #d9d9d9; + color: #9da0a7; + border-color: #e6e6e6; background-image: image(#fdfdfd); } row:selected scale > trough > slider:disabled, row:selected scale > trough > slider { border-color: #580058; } @@ -2959,8 +2959,8 @@ progressbar { /* override insensitive that is specific to progress */ border-radius: 1.5px; } progressbar > trough > progress:disabled { - background-color: #aeb0b6; - border-color: #aeb0b6; } + background-color: #9da0a7; + border-color: #9da0a7; } progressbar > trough > progress.left { border-top-left-radius: 5px; border-bottom-left-radius: 5px; } @@ -3239,7 +3239,7 @@ expander { expander:dir(rtl) { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); } expander:disabled { - color: #aeb0b6; } + color: #9da0a7; } expander:checked { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -3426,7 +3426,7 @@ separator.sidebar { .navigation-sidebar > row:selected:hover { background-color: #dddee0; } .navigation-sidebar > row:disabled { - color: #aeb0b6; } + color: #9da0a7; } /**************** * File chooser * @@ -3947,7 +3947,7 @@ row.expander { row.expander:checked image.expander-row-arrow:not(:disabled) { color: #a400a4; } row.expander image.expander-row-arrow:disabled { - color: #aeb0b6; } + color: #9da0a7; } flap > dimming, deck > dimming, @@ -4868,7 +4868,7 @@ base background color of insensitive widgets */ @define-color insensitive_bg_color #fdfdfd; /* text foreground color of insensitive widgets */ -@define-color insensitive_fg_color #aeb0b6; +@define-color insensitive_fg_color #9da0a7; /* insensitive text widgets and the like base background color */ @define-color insensitive_base_color #fafafa; diff --git a/src/themes/Kali/sass/common/_colors.scss b/src/themes/Kali/sass/common/_colors.scss index 03af6561..c4b51cfa 100644 --- a/src/themes/Kali/sass/common/_colors.scss +++ b/src/themes/Kali/sass/common/_colors.scss @@ -1,10 +1,13 @@ // When color definition differs for dark and light variant // it gets @if ed depending on $variant -$_dark_base_color: #272a34; +//@import '_palette.scss'; $is_highcontrast: false; +// base color for light theme +$_dark_base_color: #272a34; + $base_color: if($variant == 'light', darken(#ffffff, 2%), $_dark_base_color); $text_color: if($variant == 'light', black, white); $bg_color: if($variant == 'light', #ffffff, darken($_dark_base_color, 2%)); @@ -37,10 +40,14 @@ $warning_color: #fd7d00; $error_color: #bf1717; $success_color: if($variant == 'light', #3db47e, darken(#3db47e, 10%)); $destructive_color: if($variant == 'light', #d41919, darken(#d41919, 10%)); +$drop_target_color: #19a187; +// color definitions for OSD elements $osd_fg_color: white; $osd_text_color: white; $osd_bg_color: lighten($_dark_base_color, 4%); + +// derived osd colors $osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_color, 1), 10%), 0.5); $osd_insensitive_fg_color: mix($osd_fg_color, opacify($osd_bg_color, 1), 50%); $osd_borders_color: black; @@ -49,25 +56,46 @@ $osd_outer_borders_color: transparentize($osd_fg_color, 0.9); $sidebar_bg_color: mix($bg_color, $base_color, 50%); $base_hover_color: transparentize($fg_color, 0.95); -$panel_bg : transparentize($bg_color, if($variant=='light', 0.1, 0.2)); +$panel_bg: transparentize($bg_color, if($variant=='light', 0.1, 0.2)); $panel_fg: if($variant=='light', darken($fg_color, 10%), $fg_color); $tooltip_borders_color: $osd_outer_borders_color; -$shadow_color: transparentize(black, if($variant == 'light', 0.9, 0.7)); -$system_bg_color: $_dark_base_color; -// button -$button_mix_factor: 9%; +$shadow_color: transparentize(black, if($variant == 'light', 0.9, 0.7)); + +// buttons +$button_mix_factor: if($variant == 'light', 10%, 9%); // notifications $bubble_buttons_color: if($variant == 'light', darken($bg_color, 7%), lighten($bg_color, 5%)); -$drop_target_color: #19a187; +// color definitions for system elements (e.g. the overview) +$system_base_color: $_dark_base_color; // always dark +$system_fg_color: white; -//insensitive state derived colors -$insensitive_fg_color: mix($fg_color, $bg_color, 50%); +// derived system colors +$system_bg_color: lighten($system_base_color, 5%); +$system_borders_color: transparentize($system_fg_color, .9); +$system_insensitive_fg_color: mix($system_fg_color, $system_bg_color, 50%); +$system_overlay_bg_color: mix($system_base_color, $system_fg_color, 90%); // for non-transparent items, e.g. dash + +// derived global colors +// insensitive state +$insensitive_fg_color: if($variant == 'light', mix($fg_color, $bg_color, 60%), mix($fg_color, $bg_color, 50%)); $insensitive_bg_color: mix($bg_color, $base_color, 60%); -$insensitive_borders_color: $borders_color; +$insensitive_borders_color: mix($borders_color, $base_color, 60%); + +// checked state +$checked_bg_color: if($variant=='light', darken($bg_color, 7%), lighten($bg_color, 7%)); +$checked_fg_color: if($variant=='light', darken($fg_color, 7%), lighten($fg_color, 7%)); + +// hover state +$hover_bg_color: if($variant=='light', darken($bg_color,9%), lighten($bg_color, 10%)); +$hover_fg_color: if($variant=='light', darken($fg_color,9%), lighten($fg_color, 10%)); + +// active state +$active_bg_color: if($variant=='light', darken($bg_color, 11%), lighten($bg_color, 12%)); +$active_fg_color: if($variant=='light', darken($fg_color, 11%), lighten($fg_color, 12%)); //colors for the backdrop state, derived from the main colors. $backdrop_base_color: if($variant == 'light', darken($base_color, 1%), lighten($base_color, 1%)); @@ -85,18 +113,6 @@ $backdrop_scrollbar_slider_color: mix($backdrop_fg_color, $backdrop_bg_color, 40 $backdrop_menu_color: if($variant == 'light', $backdrop_base_color, mix($backdrop_bg_color, $backdrop_base_color, 20%)); -// derived checked colors -$checked_bg_color: if($variant=='light', darken($base_color, 7%), lighten($base_color, 9%)); -$checked_fg_color: if($variant=='light', darken($fg_color, 7%), lighten($fg_color, 7%)); - -// derived hover colors -$hover_bg_color: if($variant=='light', darken($base_color, 3%), lighten($base_color, 4%)); -$hover_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 10%)); - -// derived active colors -$active_bg_color: if($variant=='light', darken($base_color, 5%), lighten($base_color, 6%)); -$active_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 12%)); - //special cased widget colors $suggested_bg_color: $selected_bg_color; $suggested_border_color: $selected_borders_color; @@ -110,3 +126,8 @@ $switch_borders_color: if($variant == 'light',darken($switch_bg_color,15%),darke $focus_border_color: if($variant == 'light', transparentize($selected_bg_color, 0.5), transparentize($selected_bg_color, 0.3)); $alt_focus_border_color: if($variant == 'light', transparentize(white, 0.2), transparentize(white,0.7)); $dim_label_opacity: 0.55; + +// Gnome's color palette +$light_1: white; +$light_3: red; +$dark_5: black; diff --git a/src/themes/Kali/sass/gnome-shell/_common-tweaks.scss b/src/themes/Kali/sass/gnome-shell/_common-tweaks.scss index 0b5036e8..ea3bf70d 100644 --- a/src/themes/Kali/sass/gnome-shell/_common-tweaks.scss +++ b/src/themes/Kali/sass/gnome-shell/_common-tweaks.scss @@ -80,6 +80,7 @@ $dialog_box_shadow: 0 2px 6px -2px transparentize(black, .8); $_panel_text_shadow: 0 1px 2px transparentize(black, 0.7); background: $_panel_bg; text-shadow: $_panel_text_shadow; + box-shadow: none; StIcon { icon-shadow: $_panel_text_shadow; } diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_colors.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_colors.scss index d2f406b7..8bb3b4b5 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_colors.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_colors.scss @@ -5,66 +5,70 @@ $is_highcontrast:false; +// base color for light theme $_dark_base_color: desaturate($dark_4, 100%); $base_color: if($variant == 'light', $light_1, $_dark_base_color); $bg_color: if($variant == 'light', $light_2, lighten($base_color, 5%)); -$fg_color: if($variant == 'light', transparentize(black, .2), white); +$fg_color: if($variant == 'light', $_dark_base_color, white); $selected_fg_color: $light_1; $selected_bg_color: $blue_3; $selected_borders_color: if($variant== 'light', darken($selected_bg_color, 15%), darken($selected_bg_color, 20%)); -$borders_color: if($variant == 'light', transparentize($fg_color, .5), transparentize($fg_color, .9)); -$outer_borders_color: if($variant == 'light', rgba(255,255,255,0.8), lighten($bg_color, 5%)); +$borders_color: if($variant == 'light', transparentize($fg_color, .85), transparentize($fg_color, .9)); +$outer_borders_color: if($variant == 'light', darken($bg_color, 7%), lighten($bg_color, 5%)); $link_color: if($variant == 'light', darken($selected_bg_color, 10%), lighten($selected_bg_color, 20%)); $link_visited_color: if($variant == 'light', darken($selected_bg_color, 20%), lighten($selected_bg_color, 10%)); -$warning_color: if($variant == 'light', $yellow_5, #cd9309); +$warning_color: if($variant == 'light', $yellow_5, $yellow_3); $error_color: if($variant == 'light', $red_3, $red_4); $success_color: if($variant == 'light', $green_4, $green_5); $destructive_color: $error_color; -$osd_fg_color: $light_1; -$osd_bg_color: $_dark_base_color; //hardcoded for both light & dark +// color definitions for OSD elements +$osd_fg_color: if($variant == 'light', $_dark_base_color, $light_1); +$osd_bg_color: if($variant == 'light', $light_3, lighten($_dark_base_color, 5%)); + +// derived osd colors $osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_color, 1), 10%), 0.5); -$osd_insensitive_fg_color: if($variant == 'light', mix($osd_fg_color, $osd_bg_color, 80%), mix($osd_fg_color, $osd_bg_color, 70%)); -$osd_borders_color: transparentize(black, 0.3); -$osd_outer_borders_color: transparentize($osd_fg_color, 0.9); +$osd_insensitive_fg_color: mix($osd_fg_color, $osd_bg_color, 70%); +$osd_borders_color: transparentize($osd_fg_color, 0.9); +$osd_outer_borders_color: transparentize($osd_fg_color, 0.98); -$shadow_color: if($variant == 'light', rgba(0,0,0,0.1), rgba(0,0,0,0.2)); +$shadow_color: if($variant == 'light', rgba(0,0,0,.05), rgba(0,0,0,0.2)); -// button -$button_mix_factor: 9%; +// buttons +$button_mix_factor: if($variant == 'light', 12%, 9%); // notifications $bubble_buttons_color: if($variant == 'light', darken($bg_color, 7%), lighten($bg_color, 5%)); -// overview background color -$system_bg_color: $base_color; +// color definitions for system elements (e.g. the overview) +$system_base_color: $_dark_base_color; // always dark +$system_fg_color: $light_2; -//insensitive state derived colors -$insensitive_fg_color: mix($fg_color, $bg_color, 50%); +// derived system colors +$system_bg_color: lighten($system_base_color, 5%); +$system_borders_color: transparentize($system_fg_color, .9); +$system_insensitive_fg_color: mix($system_fg_color, $system_bg_color, 50%); +$system_overlay_bg_color: mix($system_base_color, $system_fg_color, 90%); // for non-transparent items, e.g. dash + +// derived global colors +// insensitive state +$insensitive_fg_color: if($variant == 'light', mix($fg_color, $bg_color, 60%), mix($fg_color, $bg_color, 50%)); $insensitive_bg_color: mix($bg_color, $base_color, 60%); $insensitive_borders_color: mix($borders_color, $base_color, 60%); -//colors for the backdrop state, derived from the main colors. -$backdrop_base_color: if($variant =='light', darken($base_color,1%), lighten($base_color,1%)); -$backdrop_bg_color: $bg_color; -$backdrop_fg_color: mix($fg_color, $backdrop_bg_color, 80%); -$backdrop_insensitive_color: if($variant =='light', darken($backdrop_bg_color,15%), lighten($backdrop_bg_color,15%)); -$backdrop_borders_color: mix($borders_color, $bg_color, 90%); -$backdrop_dark_fill: mix($backdrop_borders_color,$backdrop_bg_color, 35%); - -// derived checked colors +// checked state $checked_bg_color: if($variant=='light', darken($bg_color, 7%), lighten($bg_color, 7%)); $checked_fg_color: if($variant=='light', darken($fg_color, 7%), lighten($fg_color, 7%)); -// derived hover colors -$hover_bg_color: if($variant=='light', darken($bg_color, 3%), lighten($bg_color, 10%)); -$hover_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 10%)); +// hover state +$hover_bg_color: if($variant=='light', darken($bg_color,9%), lighten($bg_color, 10%)); +$hover_fg_color: if($variant=='light', darken($fg_color,9%), lighten($fg_color, 10%)); -// derived active colors -$active_bg_color: if($variant=='light', darken($bg_color, 5%), lighten($bg_color, 12%)); -$active_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 12%)); +// active state +$active_bg_color: if($variant=='light', darken($bg_color, 11%), lighten($bg_color, 12%)); +$active_fg_color: if($variant=='light', darken($fg_color, 11%), lighten($fg_color, 12%)); diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_common.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_common.scss index 47f12665..02d5bd3c 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_common.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_common.scss @@ -57,18 +57,6 @@ stage { /* Common Stylings */ -// osd panels -%osd_panel { - color: $osd_fg_color; - background-color: $osd_bg_color; - border: 1px solid $osd_outer_borders_color; - border-radius: 999px; - padding: $base_padding*2; - @if $is_highcontrast { - border: 2px solid $hc_inset_color; - } -} - // icon tiles %tile { border-radius: $base_border_radius * 2; // 16px @@ -77,19 +65,24 @@ stage { border: 2px solid transparent; transition-duration: 200ms; text-align: center; + color: inherit; + @if $is_highcontrast { border-color: $hc_inset_color; } } // normal button styling -%button { +%button_common { border-radius: $base_border_radius; border-style: solid; border-width: 1px; font-weight: bold; padding: $base_padding*.5 $base_padding*4; +} +%button { + @extend %button_common; @include button(normal); &:focus { @include button(focus);} &:hover { @include button(hover);} @@ -111,19 +104,24 @@ stage { // normal entry style -%entry { +%entry_common { border-radius: $base_border_radius; padding: $base_padding*1.5 $base_padding*1.5; - color: $fg_color; selection-background-color: $selected_bg_color; selected-color: $selected_fg_color; - - @include entry(normal); - &:hover { @include entry(hover);} - &:focus { @include entry(focus);} - &:insensitive { @include entry(insensitive);} } +%entry { + @extend %entry_common; + @include entry(normal, $c:$fg_color); + &:hover { @include entry(hover, $c:$fg_color);} + &:focus { @include entry(focus, $c:$fg_color);} + &:insensitive { @include entry(insensitive, $c:$fg_color);} + + StLabel.hint-text { + color: transparentize($fg_color, 0.3); + } +} // buttons in dialogs/notifications // lighter in color and have a greater radius @@ -166,36 +164,21 @@ stage { } } -// buttons on OSD elements -// that are undecorated by default and use OSD colors -%osd_button { - @include button(undecorated); - &:insensitive { @include button(undecorated, $tc:$osd_fg_color, $c:$osd_bg_color);} - &:focus { @include button(focus, $tc:$osd_fg_color, $c:$osd_bg_color);} - &:hover { @include button(hover, $tc:$osd_fg_color, $c:$osd_bg_color);} - &:active { @include button(active, $tc:$osd_fg_color, $c:$osd_bg_color);} - &:outlined,&:checked { @include button(checked, $tc:$osd_fg_color, $c:$osd_bg_color);} -} - - // tooltip %tooltip { - background-color: $osd_bg_color; - color: $osd_fg_color; - border:1px solid $osd_outer_borders_color; + background-color: transparentize(black, 0.1); + color: $light_1; + border-radius: 99px; padding: $base_padding $base_padding * 2; text-align: center; @if $is_highcontrast { - background-color: $osd_bg_color; - color: $osd_fg_color; - border: 1px solid $hc_inset_color; + border-color: $hc_inset_color; } } /* General Typography */ - %large_title { font-weight: 300; @include fontsize(24); @@ -243,3 +226,68 @@ stage { %monospace {font-family: monospace;} %numeric { font-feature-settings: "tnum";} + + +/* OSD Elements */ +%osd_panel { + color: $osd_fg_color; + background-color: $osd_bg_color; + border: 1px solid $osd_outer_borders_color; + border-radius: 999px; + padding: $base_padding*2; + + @if $is_highcontrast { + border: 2px solid $hc_inset_color; + } +} + +// entries +%osd_entry { + @extend %entry_common; + @include entry(normal, $c:$osd_fg_color,); + &:hover { @include entry(hover, $c:$osd_fg_color,);} + &:focus { @include entry(focus, $c:$osd_fg_color,);} + &:insensitive { @include entry(insensitive, $c:$osd_fg_color,);} + + StLabel.hint-text {color: transparentize($osd_fg_color, 0.3); } +} + +// buttons on OSD elements +%osd_button { + @extend %button_common; + @include button(normal, $tc:$osd_fg_color, $c:$osd_bg_color); + &:insensitive { @include button(insensitive, $tc:$osd_fg_color, $c:$osd_bg_color);} + &:focus { @include button(focus, $tc:$osd_fg_color, $c:$osd_bg_color);} + &:hover { @include button(hover, $tc:$osd_fg_color, $c:$osd_bg_color);} + &:active { @include button(active, $tc:$osd_fg_color, $c:$osd_bg_color);} + &:outlined,&:checked { @include button(checked, $tc:$osd_fg_color, $c:$osd_bg_color);} +} + +%osd_button_flat { + @extend %osd_button; + @include button(undecorated); + &:insensitive { @include button(undecorated, $tc:$osd_fg_color, $c:$osd_bg_color);} +} + +/* System Elements */ + +// entries +%system_entry { + @extend %entry_common; + @include entry(normal, $c:$system_fg_color,); + &:hover { @include entry(hover, $c:$system_fg_color,);} + &:focus { @include entry(focus, $c:$system_fg_color,);} + &:insensitive { @include entry(insensitive, $c:$system_fg_color,);} + + StLabel.hint-text { color: transparentize($system_fg_color, 0.3);} +} + +// buttons +%system_button { + @include button(normal, $tc:$system_fg_color, $c:$system_bg_color); + &:insensitive { @include button(insensitive, $tc:$system_fg_color, $c:$system_bg_color);} + &:focus { @include button(focus, $tc:$system_fg_color, $c:$system_bg_color);} + &:hover { @include button(hover, $tc:$system_fg_color, $c:$system_bg_color);} + &:active { @include button(active, $tc:$system_fg_color, $c:$system_bg_color);} + &:outlined,&:checked { @include button(checked, $tc:$system_fg_color, $c:$system_bg_color);} +} diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_drawing.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_drawing.scss index 80d59cb3..a69d3817 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_drawing.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_drawing.scss @@ -23,23 +23,22 @@ @else { box-shadow: $shadow1; } } -// entries -@mixin entry($t, $fc:$selected_bg_color) { +// Text entries +@mixin entry($t, $c) { // // Entries drawing function // // $t: entry type -// $fc: focus color +// $c: text color, used to derive background color of entries // -// possible $t values: -// normal, focus, insensitive +// possible $t values: normal, focus, insensitive // transition-duration: 100ms; @if $t==normal { - background-color: transparentize($fg_color, 0.9); - color: transparentize($fg_color,0.3); + background-color: transparentize($c, 0.85); + color: transparentize($c,0.3); @if $is_highcontrast { box-shadow: inset 0 0 0 1px $hc_inset_color; @@ -47,20 +46,19 @@ } @if $t==focus { - background-color: mix(transparentize($fg_color, 0.8), $selected_bg_color, 95%); - box-shadow: inset 0 0 0 2px $fc; - color: $fg_color; + background-color: mix(transparentize($c, 0.75), $selected_bg_color, 95%); + box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.3); + color: $c; &:hover {} } @if $t==hover { - background-color:transparentize($fg_color, 0.8); - color: inherit; + background-color: transparentize($c, 0.75); } @if $t==insensitive { - background-color:transparentize($insensitive_fg_color, 0.8); - color: $insensitive_fg_color; + background-color:transparentize($c, 0.75); + color: transparentize($c, 0.5); } } @@ -162,29 +160,6 @@ } } - // hover button - @else if $t==hover { - color: $tc; - background-color: lighten($button_bg_color, 3%); - @if $is_highcontrast { - box-shadow: inset 0 0 0 1px $hc_inset_color !important; - } - } - - // active button - @else if $t==active { - color: $tc; - background-color: lighten($button_bg_color, 9%); - } - - // checked button - @else if $t==checked { - color: $tc; - background-color: lighten($button_bg_color, 9%); - &:hover { background-color: lighten($button_bg_color, 12%);} - &:active { background-color: lighten($button_bg_color, 15%);} - } - // focused button @if $t==focus { color: $tc; @@ -200,6 +175,39 @@ } } + // hover button + @else if $t==hover { + color: $tc; + background-color: if($variant == 'light', darken($button_bg_color, 3%), lighten($button_bg_color, 3%)); + + @if $is_highcontrast == "true" { + box-shadow: inset 0 0 0 1px lighten($button_inset_color, 3%); + background-color: mix(lighten($button_bg_color, 3%), $button_inset_color, 10%); + } + } + + // active button + @else if $t==active { + color: $tc; + background-color: if($variant == 'light', darken($button_bg_color, 6%), lighten($button_bg_color, 6%)); + @if $is_highcontrast == "true" { + box-shadow: inset 0 0 0 1px lighten($button_inset_color, 6%); + background-color: mix(lighten($button_bg_color, 6%), $button_inset_color, 10%); + } + } + + // checked button + @else if $t==checked { + color: $tc; + background-color: if($variant == 'light', darken($button_bg_color, 9%), lighten($button_bg_color, 9%)); + @if $is_highcontrast == "true" { + box-shadow: inset 0 0 0 1px lighten($button_inset_color, 9%); + background-color: mix(lighten($button_bg_color, 9%), $button_inset_color, 10%); + } + &:hover { background-color: lighten($button_bg_color, 12%);} + &:active { background-color: lighten($button_bg_color, 15%);} + } + // insensitive button @else if $t==insensitive { color: transparentize($tc, 0.5); @@ -274,17 +282,15 @@ // overview icon, dash, app grid @mixin overview_icon($color, $flat: true) { transition-duration: 400ms; - .overview-icon { + .overview-icon { @extend %tile; } @if $flat { .overview-icon { background-color: transparent;} } @else { - .overview-icon { - background-color: transparentize($color, .93); - } + .overview-icon { background-color: transparentize($color, .93); } } - &:hover .overview-icon { background-color: transparentize($color, .9);} + &:hover .overview-icon { background-color: transparentize($color, .87);} &:selected .overview-icon, &:focus .overview-icon { @@ -319,6 +325,12 @@ &:hover {@include button(hover);} &:active {@include button(active);} &:focus {@include button(focus);} + &:insensitive { + @include button(insensitive); + @if $flat { + background-color: transparent; + } + } } // styling for all menuitems in popovers diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_palette.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_palette.scss new file mode 100644 index 00000000..78847d95 --- /dev/null +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_palette.scss @@ -0,0 +1,46 @@ +//GNOME Color Palette +$blue_1: #99c1f1; +$blue_2: #62a0ea; +$blue_3: #3584e4; +$blue_4: #1c71d8; +$blue_5: #1a5fb4; +$green_1: #8ff0a4; +$green_2: #57e389; +$green_3: #33d17a; +$green_4: #2ec27e; +$green_5: #26a269; +$yellow_1: #f9f06b; +$yellow_2: #f8e45c; +$yellow_3: #f6d32d; +$yellow_4: #f5c211; +$yellow_5: #e5a50a; +$orange_1: #ffbe6f; +$orange_2: #ffa348; +$orange_3: #ff7800; +$orange_4: #e66100; +$orange_5: #c64600; +$red_1: #f66151; +$red_2: #ed333b; +$red_3: #e01b24; +$red_4: #c01c28; +$red_5: #a51d2d; +$purple_1: #dc8add; +$purple_2: #c061cb; +$purple_3: #9141ac; +$purple_4: #813d9c; +$purple_5: #613583; +$brown_1: #cdab8f; +$brown_2: #b5835a; +$brown_3: #986a44; +$brown_4: #865e3c; +$brown_5: #63452c; +$light_1: #ffffff; +$light_2: #f6f5f4; +$light_3: #deddda; +$light_4: #c0bfbc; +$light_5: #9a9996; +$dark_1: #77767b; +$dark_2: #5e5c64; +$dark_3: #3d3846; +$dark_4: #241f31; +$dark_5: #000000; \ No newline at end of file diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_app-grid.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_app-grid.scss index 31d43829..1334a067 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_app-grid.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_app-grid.scss @@ -18,11 +18,12 @@ $app_icon_size: 96px; // Icon tiles in the app grid .app-well-app { - @include overview_icon($osd_fg_color); + @include overview_icon($system_fg_color); .overview-icon { padding: $base_padding*2; border-radius: $base_border_radius*3; + color: $system_fg_color; } .overview-icon.overview-icon-with-label { > StBoxLayout { @@ -33,7 +34,7 @@ $app_icon_size: 96px; // app folders .app-well-app.app-folder { - @include overview_icon($fg_color, $flat: false); + @include overview_icon($system_fg_color, $flat: false); } // expanded folder @@ -62,7 +63,7 @@ $app_icon_size: 96px; } /* FIXME: this is to keep the label in sync with the entry */ - & .folder-name-label { padding: 5px 7px; color: $osd_fg_color; } + & .folder-name-label { padding: 5px 7px; color: $system_fg_color; } & .edit-folder-button { @extend %button; @@ -100,7 +101,7 @@ $app_icon_size: 96px; width: 5px; border-radius:5px; margin-bottom: 8px; - background-color: $osd_fg_color; + background-color: $system_fg_color; } // Rename popup for app folders @@ -130,8 +131,8 @@ $app_icon_size: 96px; // shutdown and other actions in the grid .system-action-icon { - background-color: rgba(0,0,0,0.8); - color: white; + background-color: transparentize($system_fg_color,.9); + color: $system_fg_color; border-radius: 99px; icon-size: $app_icon_size * 0.5; @if $is_highcontrast { @@ -167,11 +168,14 @@ $app_icon_size: 96px; width: 24px; height: 24px; border-radius: 99px; + + > StIcon { color: $system_fg_color;} + @if $is_highcontrast { - @include button(normal, $osd_fg_color, transparentize($osd_bg_color, 0.5)); + @include button(normal, $system_fg_color, transparentize($system_bg_color, 0.5)); } - &:insensitive { @include button(undecorated, $osd_fg_color, transparentize($osd_bg_color, 0.5));} - &:hover { @include button(hover, $osd_fg_color, transparentize($osd_bg_color, 0.5));} - &:active { @include button(active, $osd_fg_color, transparentize($osd_bg_color, 0.5));} + &:insensitive { @include button(undecorated, $system_fg_color, transparentize($system_bg_color, 0.5));} + &:hover { @include button(hover, $system_fg_color, transparentize($system_bg_color, 0.5));} + &:active { @include button(active, $system_fg_color, transparentize($system_bg_color, 0.5));} } diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_calendar.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_calendar.scss index 0c206464..eaaf74d5 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_calendar.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_calendar.scss @@ -78,7 +78,7 @@ &:hover {background-color: $hover_bg_color;} &:focus { background-color: mix($bg_color, $selected_bg_color, 80%); - color: $selected_fg_color; + color: inherit; box-shadow:inset 0 0 0 2px transparentize($selected_bg_color, 0.4); } @@ -94,7 +94,7 @@ &.calendar-day-heading { color: $insensitive_fg_color; padding-top: $base_padding; - height: 16px !important; // force heading to be smaller height + height: 1.1em !important; // force heading to be smaller height font-weight: 600; @extend %smaller; } @@ -166,11 +166,11 @@ .events-list { spacing: 2 * $base_padding; + color: $fg_color; } .events-title { @extend %heading; - color: $insensitive_fg_color; margin-bottom: $base_margin; } diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_dash.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_dash.scss index 1ab2031f..c2c63bad 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_dash.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_dash.scss @@ -1,6 +1,8 @@ /* Dash */ -$dash_background_color: lighten($system_bg_color, 5%); +// uses system colors +$dash_background_color: $system_overlay_bg_color; + $dash_placeholder_size: 32px; $dash_padding: $base_padding*2; // 12px $dash_border_radius: $modal_radius + $dash_padding; @@ -55,10 +57,11 @@ $dash_border_radius: $modal_radius + $dash_padding; } // show apps button - .show-apps { @include overview_icon($osd_fg_color);} + .show-apps { @include overview_icon($system_fg_color);} .show-apps, .app-well-app { padding-bottom: $dash_padding; + color: $system_fg_color; } } @@ -66,7 +69,7 @@ $dash_border_radius: $modal_radius + $dash_padding; .dash-separator { width: 1px; margin: 0 $base_margin; - background-color: $borders_color; + background-color: $system_borders_color; margin-bottom: $dash_padding; @if $is_highcontrast { width: 2px; diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_entries.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_entries.scss index ed65b787..a10546fa 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_entries.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_entries.scss @@ -16,6 +16,5 @@ StEntry { StLabel.hint-text { margin-left: 2px; - color: transparentize($fg_color, 0.3); } } diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_login-lock.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_login-lock.scss index cc67cb95..212a2d38 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_login-lock.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_login-lock.scss @@ -1,5 +1,5 @@ $_gdm_bg: $system_bg_color; -$_gdm_fg: white; +$_gdm_fg: $system_fg_color; $_gdm_dialog_width: 23em; // common style for gdm and lockscreen @@ -19,12 +19,12 @@ $_gdm_dialog_width: 23em; // buttons .login-dialog-button { - @extend .button; &.cancel-button, &.switch-user-button, &.login-dialog-session-list-button { @extend .icon-button; + @extend %system_button; } &.cancel-button { @@ -145,7 +145,9 @@ $_gdm_dialog_width: 23em; width: 26em; } -.login-dialog-prompt-entry {} +.login-dialog-prompt-entry { + @extend %system_entry; +} /* Screen Shield */ diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_looking-glass.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_looking-glass.scss index adcc372d..f351794d 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_looking-glass.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_looking-glass.scss @@ -2,19 +2,21 @@ // Dialog #LookingGlassDialog { - background-color: transparentize($bg_color,0.05); + + @extend %osd_panel; + background-color: transparentize($osd_bg_color,0.02); + color: $osd_fg_color; + border-radius: 0 0 $modal_radius $modal_radius; - border: 1px solid $outer_borders_color; + border-top-width: 0; - color: $fg_color; padding: $base_padding; spacing: $base_padding; box-shadow: 0 2px 4px 0 $shadow_color; @if $is_highcontrast { border: 2px solid $hc_inset_color; - background-color: $bg_color; - border-top-width: 0; + background-color: $osd_bg_color; box-shadow:none; } @@ -26,21 +28,21 @@ spacing: $base_padding; .lg-toolbar-button { + @extend %osd_button; padding: $base_padding $base_padding*2; - @extend %button; & > StIcon { icon-size: $base_icon_size; } } } - .labels { + .labels { spacing: $base_padding; } .notebook-tab { + @extend %osd_button; -natural-hpadding: $base_padding*2; -minimum-hpadding: $base_padding*2; - @extend %button; padding: $base_padding $base_padding*2; } @@ -51,8 +53,8 @@ .lg-dialog { StEntry { + @extend %osd_entry; min-height: 22px; - @extend %entry; } .shell-link { @@ -118,9 +120,9 @@ .lg-debug-flag-button { StLabel { padding: $base_padding, 2 * $base_padding; } - color: $fg_color; - &:hover { color: lighten($fg_color, 20%); } - &:active { color: darken($fg_color, 20%); } + color: $osd_fg_color; + &:hover { color: lighten($osd_fg_color, 20%); } + &:active { color: darken($osd_fg_color, 20%); } } .lg-debug-flags-header { diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_message-list.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_message-list.scss index d0e5d855..9a9144b8 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_message-list.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_message-list.scss @@ -10,9 +10,9 @@ &:ltr {margin-left: 0; margin-right: $base_margin; padding-right: $base_padding; border-right-width: 1px; } &:rtl {margin-right: 0; margin-left: $base_margin; padding-left: $base_padding; border-left-width: 1px; } - .message-list-placeholder { + .message-list-placeholder { @extend %title_2; - color: transparentize($insensitive_fg_color, .5); + color: $insensitive_fg_color; // icon size and color > StIcon { @@ -25,7 +25,7 @@ .message-list-sections { spacing: $base_padding; - margin: 0; + margin: 0; padding-bottom: $base_padding; // to account for scrollbar @@ -117,14 +117,14 @@ // close button .message-close-button { color: $fg_color; - background-color: transparentize($fg_color, 0.9); + background-color: transparentize($fg_color, 0.8); border-radius: 99px; padding: $base_padding - 1px; margin: 1px; - &:hover {background-color: transparentize($fg_color, 0.8);} - &:active {background-color: transparentize($fg_color, 0.9);} + &:hover {background-color: transparentize($fg_color, 0.7);} + &:active {background-color: transparentize($fg_color, 0.8);} - & StIcon { icon-size: $base_icon_size; } + > StIcon { icon-size: $base_icon_size; } } // body @@ -154,7 +154,7 @@ color: $fg_color; } - &:active { + &:active { background-color: lighten($active_bg_color, 5%); color: $fg_color; } @@ -165,7 +165,7 @@ border-color: transparent; } } - + // fix margin for last button &:last-child:ltr { margin-right: $base_margin*3; } &:last-child:rtl { margin-left: $base_margin*3; } diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_misc.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_misc.scss index 0a98d570..8c127de3 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_misc.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_misc.scss @@ -30,7 +30,7 @@ .flashspot { background-color: white; } // Hidden -.hidden { color: rgba(0,0,0,0);} +.hidden { color: transparent;} // Caps-lock warning .caps-lock-warning-label { diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_overview.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_overview.scss index d8e70eaf..301875e1 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_overview.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_overview.scss @@ -5,7 +5,7 @@ } #overviewGroup { - background-color: $system_bg_color; + background-color: $system_base_color; } .overview-controls { diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_panel.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_panel.scss index 487eb0f5..650d4fa8 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_panel.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_panel.scss @@ -1,8 +1,11 @@ /* Top Bar */ // a.k.a. the panel -$panel_bg_color: #000; -$panel_fg_color: if($variant == 'light', lighten($bg_color, 10%), darken($fg_color, 5%)); +$panel_bg_color: if($variant == 'light', $light_3, $dark_5); +$panel_fg_color: if($variant == 'light', $fg_color, darken($fg_color, 5%)); +$panel_border_color: if($variant == 'light', darken($panel_bg_color, 2%), $panel_bg_color); + +$panel_system_fg_color: $system_fg_color; // always light for lockscreen, overview and other transparent panels $panel_height: 2.2em; $panel_transition_duration: 250ms; // same as the overview transition duration @@ -12,12 +15,17 @@ $panel_transition_duration: 250ms; // same as the overview transition duration height: $panel_height; @extend %numeric; transition-duration: $panel_transition_duration; + box-shadow: inset 0 -1px 0 0 $panel_border_color; // transparent panel on lock & login screens &.unlock-screen, &.login-screen, &:overview { background-color: transparent; + box-shadow: none; + .panel-button { + color: $panel_system_fg_color !important; + } } // panel menus @@ -141,13 +149,13 @@ $panel_transition_duration: 250ms; // same as the overview transition duration &:overview { .panel-button { &:active, &:overview, &:focus, &:checked { - box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.15); + box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.85); &.clock-display { box-shadow: none; .clock { - box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.15); + box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.85); } } @@ -160,11 +168,11 @@ $panel_transition_duration: 250ms; // same as the overview transition duration } &:hover { - box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.10); + box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.90); &.clock-display { box-shadow: none; .clock { - box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.10); + box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.90); } } @@ -177,11 +185,11 @@ $panel_transition_duration: 250ms; // same as the overview transition duration } &:active:hover, &:overview:hover, &:focus:hover, &:checked:hover { - box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.2); + box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.8); &.clock-display { box-shadow: none; .clock { - box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.2); + box-shadow: inset 0 0 0 100px transparentize($panel_system_fg_color, 0.8); } } diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_quick-settings.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_quick-settings.scss index 03fb7780..82a5e11a 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_quick-settings.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_quick-settings.scss @@ -48,7 +48,9 @@ max-width: auto; &:ltr { border-radius: 99px 0 0 99px; } + &:ltr > StBoxLayout { padding-right: $base_padding*1.5; } &:rtl { border-radius: 0 99px 99px 0; } + &:rtr > StBoxLayout { padding-left: $base_padding*1.5; } &:ltr:last-child { border-radius: 99px; } &:rtl:last-child { border-radius: 99px; } @@ -89,6 +91,11 @@ .quick-toggle-menu { @include card; + + // override some card styles + background-color: $bg_color !important; + color: $fg_color !important; + border-radius: $base_border_radius*3; padding: $base_padding*2; margin: $base_padding*2 $base_padding*3 0; @@ -106,7 +113,10 @@ padding: 1.5 * $base_padding; background-color: transparentize($fg_color, 0.8); - &.active { background-color: $selected_bg_color;} + &.active { + background-color: $selected_bg_color; + color: $selected_fg_color; + } } & .title { @@ -144,7 +154,7 @@ .popup-menu-icon { -st-icon-style: symbolic; } } -.bt-menu-placeholder { +.bt-menu-placeholder.popup-menu-item { @extend %title_4; text-align: center; diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_screenshot.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_screenshot.scss index 150f273b..039d977a 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_screenshot.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_screenshot.scss @@ -33,7 +33,7 @@ $screenshot_ui_button_red: $error_color; } .screenshot-ui-type-button { - @extend %osd_button; + @extend %osd_button_flat; min-width: 48px; padding: $base_padding * 2 $base_padding * 3 !important; border-radius: $screenshot_ui_panel_border_radius - $screenshot_ui_panel_padding; @@ -106,7 +106,7 @@ $screenshot_ui_button_red: $error_color; } .screenshot-ui-show-pointer-button { - @extend %osd_button; + @extend %osd_button_flat; border-radius: 99px; padding: $base_padding * 2 !important; StIcon { icon-size: $base_icon_size;} @@ -129,7 +129,7 @@ $screenshot_ui_button_red: $error_color; .screenshot-ui-area-selector-handle { border-radius: 99px; background-color: white; - box-shadow: 0 1px 3px 2px rgba(0,0,0,0.2); + box-shadow: 0 1px 3px 2px $shadow_color; width: 24px; height: 24px; } diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_search-entry.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_search-entry.scss index 4ae86187..8b766ba0 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_search-entry.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_search-entry.scss @@ -5,6 +5,8 @@ margin-bottom: $base_padding; width: 24em; + @extend %system_entry; + .search-entry-icon { icon-size: $base_icon_size; margin-top: 2px; // center vertically diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_search-results.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_search-results.scss index b7d72c9b..b281ba5b 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_search-results.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_search-results.scss @@ -23,22 +23,22 @@ // content .search-section-content { - background-color: lighten($system_bg_color, 5%); + background-color: $system_overlay_bg_color; + color: $system_fg_color; border-radius: $modal_radius*1.5; - box-shadow:inset 0 0 0 1px solid $outer_borders_color; - color: $osd_fg_color; padding: $base_padding*2; margin:0 $base_margin*3; } %search_section_content_item { - @include tile_button($osd_fg_color); + @include tile_button($system_fg_color); border-radius: $base_border_radius+3px; } // "no results" text .search-statustext { @extend %title_1; + color: transparentize($system_fg_color, .2); } .grid-search-results { @@ -64,7 +64,7 @@ // provider labels .list-search-provider-details { width: 120px; - color: $osd_fg_color; + color: $system_fg_color; } } } @@ -91,6 +91,6 @@ // list item description .list-search-result-description { - color: $osd_insensitive_fg_color; + color: $system_insensitive_fg_color; } } diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_slider.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_slider.scss index 500249aa..40ac3465 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_slider.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_slider.scss @@ -5,7 +5,7 @@ $slider_size: 16px; .slider { // slider trough -barlevel-height: 4px; - -barlevel-background-color: if($variant == 'light', transparentize($fg_color, 0.6), transparentize($fg_color, 0.8)); //background of the trough + -barlevel-background-color: transparentize($fg_color, 0.8); //background of the trough -barlevel-border-width: 2px; -barlevel-border-color: transparent; // trough border color // fill style diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_switcher-popup.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_switcher-popup.scss index 5136c3cf..b7d8353e 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_switcher-popup.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_switcher-popup.scss @@ -24,7 +24,7 @@ $switcher_padding: $base_padding*2; // each item in the list .item-box { - @include tile_button($osd_fg_color); + @include tile_button($fg_color); // override over style so mouse doesn't steal focus &:hover {background: none;} @if $is_highcontrast { diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_window-picker.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_window-picker.scss index 1847250b..b46366a8 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_window-picker.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_window-picker.scss @@ -3,9 +3,9 @@ $window_picker_spacing: $base_padding; // 6px $window_picker_padding: $base_padding * 2; // 12px -$window_thumbnail_label_color: transparentize($osd_bg_color, 0.4); +$window_thumbnail_label_color: transparentize($system_bg_color, 0.4); -$window_close_button_color: transparentize(lighten($osd_bg_color, 7%), .02); +$window_close_button_color: transparentize(lighten($system_bg_color, 7%), .02); $window_close_button_size: 30px; $window_close_button_padding: 3px; @@ -23,7 +23,7 @@ $window_close_button_padding: 3px; // Close button .window-close { background-color: $window_close_button_color; - color: $osd_fg_color; + color: $system_fg_color; border-radius: 99px; box-shadow: 0 2px 4px 0 $shadow_color; padding: $window_close_button_padding; @@ -50,5 +50,5 @@ $window_close_button_padding: 3px; // keep in sync with BACKGROUND_CORNER_RADIUS_PIXELS in workspace.js border-radius: 30px; background-color: $invisible_occluded_bg_color; - box-shadow: 0 4px 16px 4px transparentize(darken($osd_bg_color, 30%), 0.7); + box-shadow: 0 4px 16px 4px $shadow_color; } diff --git a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_workspace-thumbnails.scss b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_workspace-thumbnails.scss index 6ce0f262..5b4587a0 100644 --- a/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_workspace-thumbnails.scss +++ b/src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_workspace-thumbnails.scss @@ -7,7 +7,7 @@ padding: $base_padding; .workspace-thumbnail { - color: $osd_fg_color; + color: $system_fg_color; background-color: lighten($system_bg_color, 10%); border-radius: $base_border_radius*0.5; border: 1px solid transparent; diff --git a/src/themes/Kali/sass/gnome-shell/upstream/sync.sh b/src/themes/Kali/sass/gnome-shell/upstream/sync.sh index 75abbd9e..4fc54d8a 100755 --- a/src/themes/Kali/sass/gnome-shell/upstream/sync.sh +++ b/src/themes/Kali/sass/gnome-shell/upstream/sync.sh @@ -4,7 +4,7 @@ GREEN='\033[0;32m' YELLOW='\033[0;33m' RESET='\033[0m' -VERSION=44.rc +VERSION=44.2 echo printf " $YELLOW[ i ]$RESET Upstream version $VERSION\n" @@ -26,6 +26,7 @@ done <<- EOF pad-osd.css gnome-shell-high-contrast.scss gnome-shell-sass/_colors.scss + gnome-shell-sass/_palette.scss gnome-shell-sass/_common.scss gnome-shell-sass/_drawing.scss gnome-shell-sass/_widgets.scss