From dcad1f67c8d53bcb05e66577b875b1524a1ff231 Mon Sep 17 00:00:00 2001 From: Valeria Fadeeva Date: Sat, 27 Apr 2024 12:26:31 +0500 Subject: [PATCH] Update --- .../cinnamon/cinnamon.css | 114 +- .../gnome-shell/assets/menu.svg | 6 +- .../gnome-shell/gnome-shell.css | 1183 +++++++++------- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../gtk-3.0/gtk-dark.css | 16 +- .../Melawy-round-Dark-compact/gtk-3.0/gtk.css | 16 +- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../gtk-4.0/gtk-dark.css | 203 ++- .../Melawy-round-Dark-compact/gtk-4.0/gtk.css | 203 ++- .../Melawy-round-Dark/cinnamon/cinnamon.css | 114 +- .../gnome-shell/assets/menu.svg | 6 +- .../gnome-shell/gnome-shell.css | 1195 +++++++++------- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../Melawy-round-Dark/gtk-3.0/gtk-dark.css | 16 +- .../themes/Melawy-round-Dark/gtk-3.0/gtk.css | 16 +- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../Melawy-round-Dark/gtk-4.0/gtk-dark.css | 203 ++- .../themes/Melawy-round-Dark/gtk-4.0/gtk.css | 203 ++- .../metacity-1/metacity-theme-3.xml | 4 +- .../cinnamon/cinnamon.css | 114 +- .../gnome-shell/assets/menu.svg | 2 +- .../gnome-shell/gnome-shell.css | 1180 +++++++++------- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../gtk-3.0/gtk-dark.css | 16 +- .../gtk-3.0/gtk.css | 16 +- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../gtk-4.0/gtk-dark.css | 203 ++- .../gtk-4.0/gtk.css | 205 ++- .../Melawy-round-Light/cinnamon/cinnamon.css | 114 +- .../gnome-shell/assets/menu.svg | 2 +- .../gnome-shell/gnome-shell.css | 1196 ++++++++++------- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../Melawy-round-Light/gtk-3.0/gtk-dark.css | 16 +- .../themes/Melawy-round-Light/gtk-3.0/gtk.css | 16 +- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../Melawy-round-Light/gtk-4.0/gtk-dark.css | 203 ++- .../themes/Melawy-round-Light/gtk-4.0/gtk.css | 205 ++- .../metacity-1/metacity-theme-2.xml | 4 +- .../metacity-1/metacity-theme-3.xml | 4 +- .../cinnamon/cinnamon.css | 114 +- .../gnome-shell/assets/menu.svg | 2 +- .../gnome-shell/gnome-shell.css | 1179 +++++++++------- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../Melawy-round-compact/gtk-3.0/gtk-dark.css | 16 +- .../Melawy-round-compact/gtk-3.0/gtk.css | 16 +- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../Melawy-round-compact/gtk-4.0/gtk-dark.css | 203 ++- .../Melawy-round-compact/gtk-4.0/gtk.css | 205 ++- .../themes/Melawy-round/cinnamon/cinnamon.css | 114 +- .../Melawy-round/gnome-shell/assets/menu.svg | 2 +- .../Melawy-round/gnome-shell/gnome-shell.css | 1195 +++++++++------- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../themes/Melawy-round/gtk-3.0/gtk-dark.css | 16 +- .../share/themes/Melawy-round/gtk-3.0/gtk.css | 16 +- .../assets/scalable/check-symbolic.svg | 43 + .../assets/scalable/check-symbolic@2.svg | 44 + .../themes/Melawy-round/gtk-4.0/gtk-dark.css | 203 ++- .../share/themes/Melawy-round/gtk-4.0/gtk.css | 205 ++- .../metacity-1/metacity-theme-2.xml | 4 +- .../metacity-1/metacity-theme-3.xml | 4 +- 71 files changed, 7844 insertions(+), 3688 deletions(-) create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/assets/scalable/check-symbolic@2.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/assets/scalable/check-symbolic@2.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/assets/scalable/check-symbolic@2.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/assets/scalable/check-symbolic@2.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/assets/scalable/check-symbolic@2.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/assets/scalable/check-symbolic.svg create mode 100644 melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/assets/scalable/check-symbolic@2.svg diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/cinnamon/cinnamon.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/cinnamon/cinnamon.css index 917f794..d5079a7 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/cinnamon/cinnamon.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/cinnamon/cinnamon.css @@ -10,7 +10,7 @@ stage { min-height: 24px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); } @@ -18,36 +18,36 @@ stage { .sound-button:focus { color: white; background-color: rgba(255, 255, 255, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover { color: white; background-color: rgba(255, 255, 255, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover:focus { color: white; background-color: rgba(255, 255, 255, 0.3); - border-radius: 4px; + border-radius: 2px; } .sound-button:active { color: white; background-color: rgba(255, 255, 255, 0.3); - border-radius: 4px; + border-radius: 2px; } .sound-button:insensitive { color: rgba(255, 255, 255, 0.5); background-color: rgba(255, 255, 255, 0.04); - border-radius: 4px; + border-radius: 2px; } .notification-button, .notification-icon-button, .menu #notification .notification-button, .menu #notification .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button, #notification .notification-button, #notification .notification-icon-button, .calendar-today-home-button, .calendar-today-home-button-enabled { - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); background-color: transparent; } @@ -56,28 +56,28 @@ stage { .calendar-today-home-button-enabled:hover { color: white; background-color: rgba(255, 255, 255, 0.12); - border-radius: 4px; + border-radius: 2px; } .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active, .calendar-today-home-button:active, .calendar-today-home-button-enabled:active { color: white; background-color: rgba(255, 255, 255, 0.3); - border-radius: 4px; + border-radius: 2px; } .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive, .calendar-today-home-button:insensitive, .calendar-today-home-button-enabled:insensitive { color: rgba(255, 255, 255, 0.3); background-color: transparent; - border-radius: 4px; + border-radius: 2px; } .modal-dialog-button-box .modal-dialog-button { min-height: 24px; padding: 4px 20px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); } @@ -108,7 +108,7 @@ stage { selection-background-color: #3281EA; selected-color: white; transition-duration: 300ms; - border-radius: 4px; + border-radius: 2px; color: white; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.04); @@ -271,7 +271,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 4px; + border-radius: 2px; padding: 5px 12px; background-color: rgba(54, 54, 54, 0.9); color: white; @@ -300,8 +300,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-content { padding: 4px 0; color: white; - background-color: #3C3C3C; - border-radius: 6px; + background-color: rgba(60, 60, 60, 0.98); + border-radius: 3px; margin: 4px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } @@ -351,7 +351,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: 4px 8px; spacing: 8px; - border-radius: 4px; + border-radius: 2px; margin: 0 4px; } @@ -395,7 +395,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); @@ -525,7 +525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 1em; padding: 0px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5), 0 0 16px rgba(0, 0, 0, 0.24); - background-color: #1F1F1F; + background-color: rgba(31, 31, 31, 0.8); } .panel-top .panel-button:hover, @@ -585,7 +585,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(54, 54, 54, 0.9); color: white; spacing: 25px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -601,7 +601,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, .expo-workspaces-name-entry#selected { height: 15px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -624,13 +624,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspace-thumbnail-frame { border: 4px solid rgba(255, 255, 255, 0); background-color: rgba(255, 255, 255, 0); - border-radius: 4px; + border-radius: 2px; } .expo-workspace-thumbnail-frame#active { border: 4px solid #3281EA; background-color: black; - border-radius: 4px; + border-radius: 2px; } .expo-background { @@ -730,7 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 4px; + border-radius: 2px; background-color: #2B2B2B; padding: 4px; padding-right: 0; @@ -845,7 +845,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { text-align: center; font-size: 14px; color: white; - border-radius: 4px; + border-radius: 2px; } .calendar-day-base { @@ -930,7 +930,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; min-width: 350px; border: none; - border-radius: 4px; + border-radius: 2px; background-gradient-direction: vertical; background-gradient-start: rgba(255, 255, 255, 0.04); background-gradient-end: rgba(255, 255, 255, 0.04); @@ -940,7 +940,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-events-no-events-button { margin: 4px 0; padding: 4px; - border-radius: 4px; + border-radius: 2px; } .calendar-events-no-events-button:hover { @@ -983,7 +983,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-event-button { margin: 4px 0 4px 0; - border-radius: 4px; + border-radius: 2px; } .calendar-event-button:hover { @@ -1050,14 +1050,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 8px; + border-radius: 3px; padding: 8px; spacing-rows: 6px; spacing-columns: 6px; margin-from-right-edge-of-screen: 12px; width: 28em; color: white; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); margin: 7px 12px 17px 12px; } @@ -1068,7 +1068,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu #notification, .popup-menu #notification { border: none; - border-radius: 4px; + border-radius: 2px; background-color: rgba(255, 255, 255, 0.05); box-shadow: none; margin: 0; @@ -1136,9 +1136,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: white; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); border: none; - border-radius: 4px; + border-radius: 2px; padding: 20px; } @@ -1152,7 +1152,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 4px; + border-radius: 2px; } .switcher-list .item-box:outlined { @@ -1226,7 +1226,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(46, 46, 46, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 4px; + border-radius: 2px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1251,7 +1251,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 4px 8px; background-color: rgba(54, 54, 54, 0.9); - border-radius: 4px; + border-radius: 2px; color: white; } @@ -1283,7 +1283,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 2px 8px; - border-radius: 4px; + border-radius: 2px; caret-color: white; selected-color: white; selection-background-color: #3281EA; @@ -1412,7 +1412,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 4px; + border-radius: 2px; box-shadow: none; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); @@ -1436,7 +1436,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: white; padding: 5px; - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(54, 54, 54, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1452,17 +1452,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { transition-duration: 300; background-color: rgba(255, 255, 255, 0.05); border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button { padding: 6px; border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button:hover { - border-radius: 4px; + border-radius: 2px; background-color: rgba(255, 255, 255, 0.1); } @@ -1486,7 +1486,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 4px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1498,7 +1498,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: white; background-color: rgba(255, 255, 255, 0.12); padding: 4px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1516,7 +1516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu StScrollView.menu-application-button { padding: 2px 0; - border-radius: 4px; + border-radius: 2px; background-color: rgba(255, 255, 255, 0.04); color: rgba(255, 255, 255, 0.7); } @@ -1525,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; spacing: 0; margin: 0 2px; - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); } @@ -1557,7 +1557,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 4px; - border-radius: 4px; + border-radius: 2px; } .menu-category-button-selected { @@ -1567,7 +1567,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button-hover, .menu-category-button-selected { color: white; background-color: rgba(255, 255, 255, 0.12); - border-radius: 4px; + border-radius: 2px; } .menu-category-button-greyed { @@ -1647,12 +1647,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 4px; + border-radius: 2px; color: #3281EA; } .osd-window .level-bar { - border-radius: 4px; + border-radius: 2px; background-color: #3281EA; } @@ -1800,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #81C995; background-gradient-end: #81C995; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -1814,7 +1814,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 4px; border: none; background-color: #2B2B2B; - border-radius: 4px; + border-radius: 2px; color: white; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1830,15 +1830,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu { padding: 4px; color: white; - background-color: #3C3C3C; - border-radius: 6px; + background-color: rgba(60, 60, 60, 0.98); + border-radius: 3px; margin: 4px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } .grouped-window-list-thumbnail-menu .item-box { padding: 4px; - border-radius: 4px; + border-radius: 2px; spacing: 4px; margin: 1px; } @@ -1923,7 +1923,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #81C995; background-gradient-end: #81C995; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -2004,7 +2004,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 0; margin-top: 6px; - border-radius: 4px; + border-radius: 2px; background-color: rgba(255, 255, 255, 0.04); color: white; } @@ -2043,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 4px; background-color: rgba(0, 0, 0, 0.5); border: none; - border-radius: 0 0 4px 4px; + border-radius: 0 0 2px 2px; color: white; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gnome-shell/assets/menu.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gnome-shell/assets/menu.svg index ffcb7de..6e218fd 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gnome-shell/assets/menu.svg +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gnome-shell/assets/menu.svg @@ -7,7 +7,7 @@ viewBox="0 0 16.933333 16.933334" version="1.1" id="svg5" - inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)" + inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)" sodipodi:docname="menu.svg" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" @@ -27,7 +27,7 @@ width="120px" inkscape:zoom="11.550363" inkscape:cx="32.726244" - inkscape:cy="27.61818" + inkscape:cy="13.765801" inkscape:window-width="1920" inkscape:window-height="1012" inkscape:window-x="0" @@ -84,7 +84,7 @@ d="M 14.011719 2.9960938 C 9.0350663 2.9960938 4.9980469 7.0409257 4.9980469 12.017578 L 4.9980469 47.982422 C 4.9980469 52.959073 9.0350663 57.003906 14.011719 57.003906 L 49.982422 57.003906 C 54.959077 57.003906 59.003906 52.959073 59.003906 47.982422 L 59.003906 12.017578 C 59.003906 7.0409257 54.959077 2.9960938 49.982422 2.9960938 L 14.011719 2.9960938 z M 14.013672 4 L 49.986328 4 C 54.426283 4 58 7.5737176 58 12.013672 L 58 47.986328 C 58 52.426283 54.426283 56 49.986328 56 L 14.013672 56 C 9.5737176 56 6 52.426283 6 47.986328 L 6 12.013672 C 6 7.5737176 9.5737176 4 14.013672 4 z " transform="scale(0.26458333)" /> diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gnome-shell/gnome-shell.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gnome-shell/gnome-shell.css index 0fae419..69c558a 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gnome-shell/gnome-shell.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gnome-shell/gnome-shell.css @@ -5,6 +5,32 @@ stage { color: rgba(255, 255, 255, 0.9); } +/* Common Stylings */ +#dash .dash-item-container .show-apps, +#dash .dash-item-container .overview-tile, +#dash .dash-item-container .grid-search-result, +#dash .dash-item-container .search-provider-icon, +#dash .dash-item-container .list-search-result { + background: none; + box-shadow: none; + border: none; + border-radius: 0; + padding: 0; + margin: 0; +} + +#dash .dash-item-container .show-apps .overview-icon, +#dash .dash-item-container .overview-tile .overview-icon, +#dash .dash-item-container .grid-search-result .overview-icon, +#dash .dash-item-container .search-provider-icon .overview-icon, +#dash .dash-item-container .list-search-result .overview-icon { + border-radius: 10px; + padding: 4px; + spacing: 4px; + text-align: center; + transition-duration: 100ms; +} + .search-statustext { font-size: 45px; font-weight: 400; @@ -74,32 +100,32 @@ stage { /* General Typography */ .message-list .message-list-placeholder { font-weight: 800; - font-size: 15pt; + font-size: 1.364em; } .quick-toggle-menu .header .title { font-weight: 700; - font-size: 15pt; + font-size: 1.364em; } .bt-menu-placeholder.popup-menu-item { font-weight: 700; - font-size: 13pt; + font-size: 1.182em; } -.background-app-item .title { +.background-app-item .title, .message-list-controls, .calendar .calendar-month-header .calendar-month-label { font-weight: 700; - font-size: 11pt; + font-size: 1em; } .quick-toggle-menu .header .subtitle { font-weight: 700; - font-size: 9pt; + font-size: 0.818em; } -.background-app-item .subtitle { +.background-app-item .subtitle, .message .message-header .message-header-content .event-time { font-weight: 400; - font-size: 9pt; + font-size: 0.818em; } /* WIDGETS */ @@ -142,18 +168,18 @@ StEntry { color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.15); margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } StEntry:hover { - border: 2px solid rgba(255, 255, 255, 0.15); + border: 2px solid rgba(255, 255, 255, 0.15) !important; } StEntry:focus { color: rgba(255, 255, 255, 0.9); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #3281ea; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #3281ea !important; } StEntry:insensitive { @@ -177,47 +203,17 @@ StEntry StLabel.hint-text { } /* Buttons */ -.button { - min-height: 24px; - padding: 4px 8px; - border-width: 0; - border-radius: 5px; - font-size: 9.75pt; - font-weight: 500; - color: rgba(255, 255, 255, 0.7); - background-color: transparent; - box-shadow: none; -} - -.button:hover { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.06); - box-shadow: none; -} - -.button:active { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.15); - box-shadow: 0 0 transparent; -} - -.button:insensitive { - color: rgba(255, 255, 255, 0.3); - background-color: transparent; - box-shadow: none; -} - -.button:focus { - color: rgba(255, 255, 255, 0.9); - box-shadow: none; -} - .screenshot-ui-show-pointer-button, .screenshot-ui-type-button { color: rgba(255, 255, 255, 0.7); background-color: transparent; box-shadow: none; } +.screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { + color: rgba(255, 255, 255, 0.85); + box-shadow: none; +} + .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover { color: rgba(255, 255, 255, 0.85); background-color: rgba(255, 255, 255, 0.15); @@ -243,11 +239,156 @@ StEntry StLabel.hint-text { box-shadow: none; } -.screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { - color: rgba(255, 255, 255, 0.85); +.icon-button.flat, .background-app-item .flat.close-button, .message .message-header .flat.message-expand-button, +.message .message-header .flat.message-close-button, .button.flat { + color: rgba(255, 255, 255, 0.7); + background-color: transparent; box-shadow: none; } +.icon-button.flat:focus, .background-app-item .flat.close-button:focus, .message .message-header .flat.message-expand-button:focus, +.message .message-header .flat.message-close-button:focus, .button.flat:focus { + color: rgba(255, 255, 255, 0.9); + box-shadow: none; +} + +.icon-button.flat:hover, .background-app-item .flat.close-button:hover, .message .message-header .flat.message-expand-button:hover, +.message .message-header .flat.message-close-button:hover, .button.flat:hover { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0.06); + box-shadow: none; +} + +.icon-button.flat:selected, .background-app-item .flat.close-button:selected, .message .message-header .flat.message-expand-button:selected, +.message .message-header .flat.message-close-button:selected, .button.flat:selected, .icon-button.flat:active, .background-app-item .flat.close-button:active, .message .message-header .flat.message-expand-button:active, +.message .message-header .flat.message-close-button:active, .button.flat:active { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0.15); + box-shadow: 0 0 transparent; +} + +.icon-button.flat:checked, .background-app-item .flat.close-button:checked, .message .message-header .flat.message-expand-button:checked, +.message .message-header .flat.message-close-button:checked, .button.flat:checked { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0.15); + box-shadow: 0 0 transparent; +} + +.icon-button.flat:insensitive, .background-app-item .flat.close-button:insensitive, .message .message-header .flat.message-expand-button:insensitive, +.message .message-header .flat.message-close-button:insensitive, .button.flat:insensitive { + color: rgba(255, 255, 255, 0.3); + background-color: transparent; + box-shadow: none; +} + +.icon-button.default, .background-app-item .default.close-button, .message .message-header .default.message-expand-button, +.message .message-header .default.message-close-button, .button.default { + color: #FFFFFF; + background-color: #3281ea; + border-color: rgba(255, 255, 255, 0.08); + box-shadow: none; +} + +.icon-button.default:focus, .background-app-item .default.close-button:focus, .message .message-header .default.message-expand-button:focus, +.message .message-header .default.message-close-button:focus, .button.default:focus { + color: #3281ea; + box-shadow: none; +} + +.icon-button.default:focus:active, .background-app-item .default.close-button:focus:active, .message .message-header .default.message-expand-button:focus:active, +.message .message-header .default.message-close-button:focus:active, .button.default:focus:active { + color: white; +} + +.icon-button.default:hover, .background-app-item .default.close-button:hover, .message .message-header .default.message-expand-button:hover, +.message .message-header .default.message-close-button:hover, .button.default:hover { + color: #FFFFFF; + background-color: #3281ea; + border-color: rgba(255, 255, 255, 0.15); + box-shadow: none; +} + +.icon-button.default:insensitive, .background-app-item .default.close-button:insensitive, .message .message-header .default.message-expand-button:insensitive, +.message .message-header .default.message-close-button:insensitive, .button.default:insensitive { + color: #FFFFFF; + background-color: #3281ea; + border-color: transparent; + box-shadow: none; +} + +.icon-button.default:active, .background-app-item .default.close-button:active, .message .message-header .default.message-expand-button:active, +.message .message-header .default.message-close-button:active, .button.default:active { + color: #FFFFFF; + background-color: #1b73e8; + border-color: rgba(255, 255, 255, 0.15); + box-shadow: none; +} + +.icon-button, .background-app-item .close-button, .message .message-header .message-expand-button, +.message .message-header .message-close-button, .button { + padding: 4px 8px; + border-width: 0; + border-radius: 5px; + font-size: 9.75pt; + font-weight: 500; + color: rgba(255, 255, 255, 0.7); + background-color: transparent; + box-shadow: none; +} + +.icon-button:focus, .background-app-item .close-button:focus, .message .message-header .message-expand-button:focus, +.message .message-header .message-close-button:focus, .button:focus { + color: rgba(255, 255, 255, 0.9); + box-shadow: none; +} + +.icon-button:hover, .background-app-item .close-button:hover, .message .message-header .message-expand-button:hover, +.message .message-header .message-close-button:hover, .button:hover { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0.06); + box-shadow: none; +} + +.icon-button:selected, .background-app-item .close-button:selected, .message .message-header .message-expand-button:selected, +.message .message-header .message-close-button:selected, .button:selected, .icon-button:active, .background-app-item .close-button:active, .message .message-header .message-expand-button:active, +.message .message-header .message-close-button:active, .button:active { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0.15); + box-shadow: 0 0 transparent; +} + +.icon-button:checked, .background-app-item .close-button:checked, .message .message-header .message-expand-button:checked, +.message .message-header .message-close-button:checked, .button:checked { + color: rgba(255, 255, 255, 0.85); + background-color: #3281ea; + border-color: #3281ea; + box-shadow: none; +} + +.icon-button:insensitive, .background-app-item .close-button:insensitive, .message .message-header .message-expand-button:insensitive, +.message .message-header .message-close-button:insensitive, .button:insensitive { + color: rgba(255, 255, 255, 0.3); + background-color: transparent; + box-shadow: none; +} + +.button { + min-height: 1.5em; +} + +.icon-button, .background-app-item .close-button, .message .message-header .message-expand-button, +.message .message-header .message-close-button { + border-radius: 9999px; + padding: 0.818em; + min-height: 1.091em; +} + +.icon-button StIcon, .background-app-item .close-button StIcon, .message .message-header .message-expand-button StIcon, +.message .message-header .message-close-button StIcon { + icon-size: 1.091em; + -st-icon-style: symbolic; +} + /* Check Boxes */ .check-box StBoxLayout { spacing: .8em; @@ -311,7 +452,7 @@ StEntry StLabel.hint-text { /* Slider */ .slider { - height: 12px; + height: 16px; -barlevel-height: 2px; -barlevel-background-color: rgba(255, 255, 255, 0.15); -barlevel-border-width: 0; @@ -586,29 +727,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Date/Time Menu */ -.clock-display-box { - spacing: 2px; -} - -.clock-display-box .clock { - padding-left: 8px; - padding-right: 8px; -} - -.clock { - padding: 0; - margin: 0 6px; - border: none; - box-shadow: none; - background: none; - text-shadow: none; - color: rgba(255, 255, 255, 0.7); -} - #calendarArea { padding: 4px 0; } +.datemenu-popover { + border-radius: 19.5px; +} + .calendar { padding: 0; margin: 0 6px; @@ -619,6 +745,33 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(255, 255, 255, 0.7); } +.calendar .calendar-month-header .calendar-change-month-back StIcon, +.calendar .calendar-month-header .calendar-change-month-forward StIcon { + icon-size: 1.091em; +} + +.calendar .calendar-month-header .calendar-month-label { + background-color: transparent !important; + color: rgba(255, 255, 255, 0.9) !important; + padding: 8px 0; + width: 10em; + text-align: center; +} + +.calendar .calendar-day-heading { + width: 28px; + height: 21px; + margin-top: 2px; + padding: 7px 0 0; + border-radius: 100px; + background-color: transparent !important; + color: rgba(255, 255, 255, 0.5) !important; + font-size: 9pt; + font-weight: 400; + font-weight: bold; + text-align: center; +} + .datemenu-calendar-column { spacing: 4px; border: none; @@ -689,22 +842,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.15); } -.calendar-month-label { - height: 20px; - margin: 2px; - padding: 6px 16px; - border-radius: 5px; - color: rgba(255, 255, 255, 0.7); - font-weight: bold; - text-align: center; - text-shadow: none; -} - -.calendar-month-label:focus { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.06); -} - .pager-button { width: 28px; height: 28px; @@ -742,8 +879,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: url("assets/calendar-arrow-left.svg"); } -.calendar-day, -.calendar-day-base { +.calendar-day { font-size: 9pt; font-weight: 400; text-align: center; @@ -752,49 +888,31 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 2px !important; margin: 2px !important; border-radius: 9999px; - color: rgba(255, 255, 255, 0.7); + color: rgba(255, 255, 255, 0.7) !important; + background-color: transparent !important; border: none; font-feature-settings: "tnum"; text-shadow: none; } -.calendar-day:hover, .calendar-day:focus, -.calendar-day-base:hover, -.calendar-day-base:focus { - background-color: rgba(255, 255, 255, 0.06); +.calendar-day:hover, .calendar-day:focus { + background-color: rgba(255, 255, 255, 0.06) !important; box-shadow: none !important; } -.calendar-day:active, -.calendar-day-base:active { - color: rgba(255, 255, 255, 0.7); - background-color: rgba(255, 255, 255, 0.15); +.calendar-day:active { + color: rgba(255, 255, 255, 0.7) !important; + background-color: rgba(255, 255, 255, 0.15) !important; border-color: transparent; } -.calendar-day:selected, -.calendar-day-base:selected { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.15); +.calendar-day:selected { + color: rgba(255, 255, 255, 0.9) !important; + background-color: rgba(255, 255, 255, 0.15) !important; border-color: transparent; box-shadow: none !important; } -.calendar-day.calendar-day-heading, -.calendar-day-base.calendar-day-heading { - width: 28px; - height: 21px; - margin-top: 2px; - padding: 7px 0 0; - border-radius: 100px; - background-color: transparent; - color: rgba(255, 255, 255, 0.5); - font-size: 9pt; - font-weight: 400; - font-weight: bold; - text-align: center; -} - .calendar-day { border-width: 0; } @@ -813,26 +931,26 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-today { font-weight: bold !important; - color: white; - background-color: #3281ea; + color: white !important; + background-color: #3281ea !important; border: none; } .calendar-today:hover, .calendar-today:focus { - background-color: #408aeb; - color: white; + background-color: #408aeb !important; + color: white !important; box-shadow: none !important; } .calendar-today:active, .calendar-today:selected { - background-color: #3281ea; - color: white; + background-color: #3281ea !important; + color: white !important; box-shadow: none !important; } .calendar-today:active:hover, .calendar-today:active:focus, .calendar-today:selected:hover, .calendar-today:selected:focus { - background-color: #408aeb; - color: white; + background-color: #408aeb !important; + color: white !important; } .calendar-day-with-events { @@ -845,10 +963,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; } -.calendar-other-month, -.calendar-other-month-day { +.calendar-weekend { + color: rgba(255, 255, 255, 0.5); +} + +.calendar-other-month { color: rgba(255, 255, 255, 0.3) !important; opacity: 1; + font-weight: normal; +} + +.calendar-other-month.calendar-weekend { + color: rgba(255, 255, 255, 0.3) !important; } .calendar-week-number { @@ -996,7 +1122,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Message List */ .message-list { - width: 30em; + width: 29em; padding: 0; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1019,20 +1145,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-list .message-list-placeholder { - spacing: 8px; - color: rgba(255, 255, 255, 0.7); + color: rgba(255, 255, 255, 0.3); } .message-list .message-list-placeholder > StIcon { - icon-size: 48px; + icon-size: 96px; margin-bottom: 6px; -st-icon-style: symbolic; } .message-list-sections { - spacing: 4px; - margin: 0; - padding-bottom: 4px; + spacing: 8px; } .message-list-sections:ltr { @@ -1045,13 +1168,24 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section, .message-list-section-list { - spacing: 4px; + spacing: 8px; } .message-list-controls { - margin: 4px 8px 0; - padding: 2px; - spacing: 8px; + padding: 8px; + padding-bottom: 4px; + spacing: 4px; +} + +.message-list-controls .dnd-button { + border-width: 2px; + border-color: transparent; + border-radius: 32px; + border-style: solid; +} + +.message-list-controls .dnd-button:focus { + border-color: rgba(50, 129, 234, 0.6); } .message { @@ -1059,97 +1193,152 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 5px; color: rgba(255, 255, 255, 0.7); text-shadow: none; + padding: 0; + margin: 2px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.15); - border: 1px solid rgba(255, 255, 255, 0.05); + background-color: rgba(32, 32, 32, 0.95); + border: 1px solid transparent; +} + +.message:hover, .message:focus, .message:active { + background-color: #202020; } .popup-menu .message { - box-shadow: none; margin: 0 0 2px; + box-shadow: none; + background-color: rgba(255, 255, 255, 0.03); + border-radius: 5px; + color: rgba(255, 255, 255, 0.7); + border: 1px solid rgba(255, 255, 255, 0.05); } -.message:hover, .message:focus { +.popup-menu .message:hover, .popup-menu .message:focus { background-color: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.08); } -.message:active { +.popup-menu .message:active { background-color: rgba(255, 255, 255, 0.12); } -.message .message-icon-bin { - padding: 12px; - padding-right: 4px; +.message:ltr { + padding-right: -2px; } -.message .message-icon-bin:rtl { - padding-left: 4px; +.message:rtl { + padding-left: -2px; } -.message .message-icon-bin > StIcon { - icon-size: 40px; +.message .message-header { + padding: 0 0.409em; + margin: 4px; + margin-bottom: 0; + spacing: 4px; + color: rgba(255, 255, 255, 0.5); +} + +.message .message-header .message-source-icon { + icon-size: 1.091em; -st-icon-style: symbolic; } -.message .message-icon-bin > .fallback-app-icon { - width: 32px; - height: 32px; +.message .message-header .message-header-content { + spacing: 4px; + min-height: 1.637em; + padding-bottom: 4px; } -.message .message-content { - padding: 8px; - spacing: 2px; - margin-bottom: 4px; - color: rgba(255, 255, 255, 0.7); -} - -.message .message-title { +.message .message-header .message-header-content .message-source-title { font-weight: bold; - padding-top: 0.57em; } -.message .message-secondary-bin { - padding: 0 4px; +.message .message-header .message-header-content .event-time { + color: rgba(255, 255, 255, 0.5); + padding-bottom: 0.068em; } -.message .message-secondary-bin > .event-time { - color: rgba(255, 255, 255, 0.7); - font-size: 0.9em; - padding-bottom: 0.13em; -} - -.message .message-secondary-bin > .event-time:ltr { +.message .message-header .message-header-content .event-time:ltr { text-align: right; } -.message .message-secondary-bin > .event-time:rtl { +.message .message-header .message-header-content .event-time:rtl { text-align: left; } -.message .message-close-button { - color: rgba(255, 255, 255, 0.7); - padding: 1px; - height: 24px; - width: 24px; +.message .message-header .message-expand-button, +.message .message-header .message-close-button { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0); + padding: 4px; +} + +.message .message-header .message-expand-button:hover, +.message .message-header .message-close-button:hover { + background-color: rgba(255, 255, 255, 0.09); +} + +.message .message-header .message-expand-button:active, .message .message-header .message-expand-button:active:hover, +.message .message-header .message-close-button:active, +.message .message-header .message-close-button:active:hover { + background-color: rgba(255, 255, 255, 0.14); +} + +.message .message-header .message-expand-button:insensitive, +.message .message-header .message-close-button:insensitive { + background-color: rgba(255, 255, 255, 0); +} + +.message .message-header .message-expand-button { + padding: 6px; +} + +.message .message-header .message-expand-button:ltr { + margin-right: 4px; +} + +.message .message-header .message-expand-button:rtl { + margin-left: 4px; +} + +.message .message-box { + padding: 4px; + margin: 4px; + margin-top: 0; + spacing: 4px; +} + +.message .message-box .message-icon { + icon-size: 48px; + -st-icon-style: symbolic; +} + +.message .message-box .message-icon:ltr { + margin-right: 4px; +} + +.message .message-box .message-icon:rtl { + margin-left: 4px; +} + +.message .message-box .message-icon.message-themed-icon { border-radius: 9999px; + background-color: rgba(255, 255, 255, 0.1); + icon-size: 16px; + min-width: 48px; + min-height: 48px; } -.message .message-close-button:hover, .message .message-close-button:focus { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.06); +.message .message-box:first-child { + margin-top: 8px; } -.message .message-close-button:active { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.15); +.message .message-box .message-content { + spacing: 2px; } -.message .message-close-button:insensitive { - color: rgba(255, 255, 255, 0.3); -} - -.message .message-body { - color: rgba(255, 255, 255, 0.5); +.message .message-box .message-content .message-title { + font-weight: bold; } .url-highlighter { @@ -1158,10 +1347,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Media Controls */ .message-media-control { - margin: 20px 4px; - padding: 8px; + margin: 4px 0; + padding: 0 8px; border-radius: 9999px; color: rgba(255, 255, 255, 0.7); + border: none; } .message-media-control:hover, .message-media-control:focus { @@ -1178,33 +1368,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(255, 255, 255, 0.3); } -.message-media-control:last-child:ltr { - margin-right: 16px; - padding-right: 8px; +.message-media-control StIcon { + icon-size: 16px; } -.message-media-control:last-child:rtl { - margin-left: 16px; - padding-left: 8px; +.media-message .message-icon { + border-radius: 5px !important; } -.media-message-cover-icon { - icon-size: 48px !important; - border-radius: 5px; - border: none; -} - -.media-message-cover-icon.fallback { - color: rgba(255, 255, 255, 0.5); - background-color: rgba(255, 255, 255, 0.06); - border: none; - border-radius: 5px; +.media-message .message-icon.message-themed-icon { icon-size: 32px !important; - padding: 8px; } .candidate-popup-content { - background-color: #202020; + background-color: rgba(32, 32, 32, 0.95); border-radius: 8px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.25) !important; margin: 2px 8px 11px; @@ -1277,126 +1454,87 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { min-height: 64px; width: 34em; - font-size: 1em; - margin: 6px 8px 12px; - border-radius: 5px; - color: rgba(255, 255, 255, 0.9); - background-color: rgba(32, 32, 32, 0.92); - border: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.35); + margin: 4px; + border-radius: 12px; } -.notification-banner:hover { - background-color: rgba(32, 32, 32, 0.95); -} - -.notification-banner:focus { - background-color: #202020; -} - -.notification-banner .notification-actions { +.notification-buttons-bin { spacing: 0; } -.notification-banner .notification-button { +.notification-button { min-height: 40px; padding: 0 16px; - background-color: transparent; - color: rgba(255, 255, 255, 0.7); + background-color: transparent !important; + color: rgba(255, 255, 255, 0.7) !important; font-weight: 500; - border-width: 0; - border-top: 1px solid rgba(255, 255, 255, 0.1); + border-top: 1px solid rgba(255, 255, 255, 0.1) !important; } -.notification-banner .notification-button:first-child { - border-radius: 0 0 0 5px !important; -} - -.notification-banner .notification-button:last-child { - border-radius: 0 0 5px 0 !important; -} - -.notification-banner .notification-button:only-child, .notification-banner .notification-button:first-child:last-child { - border-radius: 0 0 5px 5px !important; -} - -.notification-banner .notification-button:focus { - background-color: transparent; - color: rgba(255, 255, 255, 0.7); +.notification-button:focus { + background-color: transparent !important; + color: rgba(255, 255, 255, 0.7) !important; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.06) !important; } -.notification-banner .notification-button:hover, .notification-banner .notification-button:focus:hover { - background-color: rgba(255, 255, 255, 0.06); - color: rgba(255, 255, 255, 0.9); +.notification-button:hover { + background-color: rgba(255, 255, 255, 0.06) !important; + color: rgba(255, 255, 255, 0.9) !important; box-shadow: none !important; } -.notification-banner .notification-button:active { - background-color: rgba(255, 255, 255, 0.15); - color: rgba(255, 255, 255, 0.9); +.notification-button:active, .notification-button:checked { + background-color: rgba(255, 255, 255, 0.15) !important; + color: rgba(255, 255, 255, 0.9) !important; } -.summary-source-counter { - font-size: 1em; - font-weight: bold; - height: 1.6em; - width: 1.6em; - -shell-counter-overlap-x: 3px; - -shell-counter-overlap-y: 3px; - background-color: #3281ea; - color: rgba(255, 255, 255, 0.85); - border: 2px solid #3281ea; - box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); - border-radius: 0.9em; +.notification-button:insensitive { + background-color: transparent !important; + color: rgba(255, 255, 255, 0.3) !important; } -.chat-body { - spacing: 5px; +.notification-button:first-child:ltr { + border-radius: 0 0 0 12px; } -.chat-response { - margin: 5px; +.notification-button:last-child:ltr { + border-radius: 0 0 12px; + margin-right: 0 !important; } -.chat-log-message { - color: rgba(255, 255, 255, 0.7); +.notification-button:first-child:rtl { + border-radius: 0 0 12px; } -.chat-new-group { - padding-top: 1em; +.notification-button:last-child:rtl { + border-radius: 0 0 0 12px; + margin-left: 0 !important; } -.chat-received { - padding-left: 4px; +.notification-button:first-child:last-child { + border-radius: 0 0 12px 12px; + margin-left: 0 !important; + margin-right: 0 !important; } -.chat-received:rtl { - padding-left: 0px; - padding-right: 4px; +.popup-menu .notification-button:first-child:ltr { + border-radius: 0 0 0 5px; } -.chat-sent { - padding-left: 18pt; - color: rgba(255, 255, 255, 0.7); +.popup-menu .notification-button:last-child:ltr { + border-radius: 0 0 5px; } -.chat-sent:rtl { - padding-left: 0; - padding-right: 18pt; +.popup-menu .notification-button:first-child:rtl { + border-radius: 0 0 5px; } -.chat-meta-message { - font-weight: bold; - padding-left: 4px; - font-size: 9pt; - font-weight: 400; - color: rgba(255, 255, 255, 0.5); +.popup-menu .notification-button:last-child:rtl { + border-radius: 0 0 0 5px; } -.chat-meta-message:rtl { - padding-left: 0; - padding-right: 4px; +.popup-menu .notification-button:first-child:last-child { + border-radius: 0 0 5px 5px; } .hotplug-notification-item { @@ -1903,21 +2041,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Top Bar */ #panel .panel-button#panelActivities { - background-image: url("assets/activities.svg"); - background-position: center center; - background-repeat: no-repeat; - background-size: auto; - color: transparent !important; - font-size: 0; - box-shadow: none; + -natural-hpadding: 10px; } -#panel .panel-button#panelActivities * { - width: 32px; +#panel .panel-button#panelActivities StBoxLayout { + spacing: 4px; } #panel .panel-button#panelActivities .workspace-dot { - background-color: transparent; + border-radius: 9999px; + min-width: 8px; + min-height: 8px; + background-color: #FFFFFF; } #panel { @@ -1927,10 +2062,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; padding: 0 2px !important; - background-color: #202020; - border-radius: 12px; - margin: 2px; - height: 34px; + background-color: rgba(0, 0, 0, 0.5); + margin: 0; + border-radius: 0; + height: 30px; } #panel #panelLeft, #panel #panelCenter { @@ -1939,7 +2074,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #202020; + -panel-corner-background-color: rgba(0, 0, 0, 0.5); -panel-corner-border-width: 0; -panel-corner-border-color: transparent; -panel-corner-opacity: 0; @@ -1963,6 +2098,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; } +#panel .panel-button.clock-display { + border: 1px solid transparent !important; + box-shadow: inset 0 1px transparent !important; +} + +#panel .panel-button.clock-display:hover { + color: rgba(255, 255, 255, 0.75); + background-color: rgba(255, 255, 255, 0.1) !important; +} + +#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:checked, #panel .panel-button.clock-display:focus { + color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.15) !important; +} + #panel .panel-button.clock-display .clock { color: rgba(255, 255, 255, 0.75); transition-duration: 150ms; @@ -1970,6 +2120,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; } +#panel .panel-button.clock-display .messages-indicator { + icon-size: 1.091em; +} + #panel .panel-button:hover { color: rgba(255, 255, 255, 0.75); background-color: rgba(255, 255, 255, 0.1); @@ -2030,10 +2184,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: transparent; } -#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { - color: rgba(255, 255, 255, 0.7); -} - #panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel.lock-screen .panel-button:hover, #panel:overview .panel-button:hover { background-color: rgba(255, 255, 255, 0.15); } @@ -2047,6 +2197,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } +#panel.unlock-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:hover { + background-color: rgba(255, 255, 255, 0.15) !important; +} + +#panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:checked, #panel.unlock-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:focus { + background-color: rgba(255, 255, 255, 0.3) !important; +} + +#panel.unlock-screen .panel-button.clock-display:hover, #panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:overview, #panel.unlock-screen .panel-button.clock-display:focus, #panel.unlock-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:overview, #panel.login-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:overview, #panel.lock-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:overview, #panel:overview .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:checked { + border: 1px solid rgba(0, 0, 0, 0.12) !important; + box-shadow: inset 0 1px rgba(255, 255, 255, 0.1) !important; +} + +#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { + color: rgba(255, 255, 255, 0.7); +} + #panel.unlock-screen .panel-button#panelActivities, #panel.login-screen .panel-button#panelActivities, #panel.lock-screen .panel-button#panelActivities, #panel:overview .panel-button#panelActivities { box-shadow: none; border: none; @@ -2057,6 +2224,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.15); } +#panel.unlock-screen .panel-button#panelActivities .workspace-dot, #panel.login-screen .panel-button#panelActivities .workspace-dot, #panel.lock-screen .panel-button#panelActivities .workspace-dot, #panel:overview .panel-button#panelActivities .workspace-dot { + background-color: rgba(255, 255, 255, 0.85); +} + #panel.unlock-screen .panel-corner, #panel.login-screen .panel-corner, #panel.lock-screen .panel-corner, #panel:overview .panel-corner { -panel-corner-opacity: 0; -panel-corner-radius: 0; @@ -2069,43 +2240,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 4px !important; } -#panel Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_ui_panel_ActivitiesButton.panel-button { - border-radius: 12px 0 0 12px !important; -} - -#panel Gjs_AggregateMenu.panel-button, -#panel Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 0 12px 12px 0 !important; -} - -#panel:overview Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel:overview Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel:overview Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel:overview Gjs_ui_panel_ActivitiesButton.panel-button, -#panel:overview Gjs_AggregateMenu.panel-button, -#panel:overview Gjs_ui_panel_AggregateMenu.panel-button, #panel.unlock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.unlock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.unlock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.unlock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.unlock-screen Gjs_AggregateMenu.panel-button, -#panel.unlock-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.login-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.login-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.login-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.login-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.login-screen Gjs_AggregateMenu.panel-button, -#panel.login-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.lock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.lock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.lock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.lock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.lock-screen Gjs_AggregateMenu.panel-button, -#panel.lock-screen Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 5px !important; -} - #panel Gjs_ArcMenu_ApplicationsButton.panel-button, #panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, #panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, @@ -2216,18 +2350,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.15); margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .search-entry:hover { - border: 2px solid rgba(255, 255, 255, 0.15); + border: 2px solid rgba(255, 255, 255, 0.15) !important; } .search-entry:focus { color: rgba(255, 255, 255, 0.9); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #3281ea; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #3281ea !important; } .search-entry:insensitive { @@ -2254,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { caret-color: rgba(0, 0, 0, 0.75); color: rgba(0, 0, 0, 0.75); background-color: rgba(255, 255, 255, 0.75) !important; - border-color: transparent; - box-shadow: none; + border: none !important; + box-shadow: none !important; } #overview .search-entry:hover { @@ -2265,9 +2399,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #overview .search-entry:focus { color: rgba(0, 0, 0, 0.85); - border-color: transparent; background-color: rgba(255, 255, 255, 0.95) !important; - border: none; + border: none !important; selection-background-color: #3281ea; selected-color: #FFFFFF !important; } @@ -2285,17 +2418,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Search */ +#searchResults { + margin: 0 4px; +} + #searchResultsContent { - max-width: 1024px; - spacing: 4px; + max-width: 1044px; } .search-section { - spacing: 4px; + spacing: 8px; } .search-section .search-section-separator { - height: 0; + height: 4px; background-color: transparent; } @@ -2314,21 +2450,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 12px; } -.list-search-result:focus, .search-provider-icon:focus, .list-search-result:hover, .search-provider-icon:hover, .list-search-result:selected, .search-provider-icon:selected { - background-color: rgba(255, 255, 255, 0.15); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - transition-duration: 100ms; -} - -.list-search-result:active, .search-provider-icon:active, .list-search-result:checked, .search-provider-icon:checked { - background-color: rgba(255, 255, 255, 0.3); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); +.search-statustext { + color: rgba(255, 255, 255, 0.7); } .grid-search-results { spacing: 24px; + margin: 0 6px; +} + +.search-provider-icon:ltr { + margin-right: 2px; +} + +.search-provider-icon:rtl { + margin-left: 2px; } .search-provider-icon .list-search-provider-content { @@ -2337,7 +2473,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .search-provider-icon .list-search-provider-content .list-search-provider-details { width: 120px; - margin-top: 0; color: rgba(255, 255, 255, 0.7); } @@ -2359,44 +2494,102 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash */ #dash { - font-size: 1em; - margin-top: 12px; - padding: 0 10px; + margin-top: 6px; } -#dash .placeholder { +#dash .dash-background { + background-color: rgba(255, 255, 255, 0.2); + border-radius: 16px; + padding-top: 8px; + padding-bottom: 8px; + padding-left: 7px; + padding-right: 7px; +} + +#dash .dash-item-container .placeholder { background-image: none; background-size: contain; height: 32px; } -#dash .empty-dash-drop-target { +#dash .dash-item-container .empty-dash-drop-target { width: 32px; height: 32px; } -#dash .overview-icon { - padding: 5px; - border-radius: 8px; +#dash .dash-item-container .show-apps, +#dash .dash-item-container .overview-tile, +#dash .dash-item-container .grid-search-result, +#dash .dash-item-container .search-provider-icon, +#dash .dash-item-container .list-search-result { + margin: 0 1px; + padding-bottom: 6px; } -.dash-background { - background-color: rgba(255, 255, 255, 0.2); - margin-bottom: 18px; - padding: 10px; - border-radius: 18px; +#dash .dash-item-container .show-apps .overview-icon, +#dash .dash-item-container .overview-tile .overview-icon, +#dash .dash-item-container .grid-search-result .overview-icon, +#dash .dash-item-container .search-provider-icon .overview-icon, +#dash .dash-item-container .list-search-result .overview-icon { + background-color: transparent; } -.dash-item-container .app-well-app, .show-apps { - padding: 10px 3px 28px; -} - -.dash-separator { - width: 1px; - margin: 0 8px 18px; +#dash .dash-item-container .show-apps:focus .overview-icon, +#dash .dash-item-container .overview-tile:focus .overview-icon, +#dash .dash-item-container .grid-search-result:focus .overview-icon, +#dash .dash-item-container .search-provider-icon:focus .overview-icon, +#dash .dash-item-container .list-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.15); } +#dash .dash-item-container .show-apps:hover .overview-icon, +#dash .dash-item-container .overview-tile:hover .overview-icon, +#dash .dash-item-container .grid-search-result:hover .overview-icon, +#dash .dash-item-container .search-provider-icon:hover .overview-icon, +#dash .dash-item-container .list-search-result:hover .overview-icon { + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-item-container .show-apps:active .overview-icon, +#dash .dash-item-container .overview-tile:active .overview-icon, +#dash .dash-item-container .grid-search-result:active .overview-icon, +#dash .dash-item-container .search-provider-icon:active .overview-icon, +#dash .dash-item-container .list-search-result:active .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:checked .overview-icon, +#dash .dash-item-container .overview-tile:checked .overview-icon, +#dash .dash-item-container .grid-search-result:checked .overview-icon, +#dash .dash-item-container .search-provider-icon:checked .overview-icon, +#dash .dash-item-container .list-search-result:checked .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:insensitive .overview-icon, +#dash .dash-item-container .overview-tile:insensitive .overview-icon, +#dash .dash-item-container .grid-search-result:insensitive .overview-icon, +#dash .dash-item-container .search-provider-icon:insensitive .overview-icon, +#dash .dash-item-container .list-search-result:insensitive .overview-icon { + background-color: transparent; +} + +#dash .dash-item-container .app-grid-running-dot { + margin-bottom: 11px; +} + +#dash .dash-separator { + width: 1px; + margin-left: 2px; + margin-right: 2px; + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-separator, +#dash .dash-background { + margin-bottom: 6px; +} + .dash-label { border-radius: 5px; padding: 4px 8px; @@ -2406,46 +2599,37 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; text-align: center; - -y-offset: 10px; + -y-offset: 2px; } /* App Grid */ - -.show-apps .overview-icon, -.app-well-app .overview-icon, -.grid-search-result .overview-icon, .search-provider-icon, .list-search-result { - color: rgba(255, 255, 255, 0.85); - border-radius: 10px; - padding: 6px; - border: 1px solid transparent; - box-shadow: inset 0 1px transparent; - transition-duration: 150ms; - text-align: center; -} - .icon-grid { row-spacing: 12px; column-spacing: 12px; - max-row-spacing: 72px; - max-column-spacing: 72px; + max-row-spacing: 36px; + max-column-spacing: 36px; page-padding-top: 24px; page-padding-bottom: 24px; - page-padding-left: 12px; - page-padding-right: 12px; + page-padding-left: 18px; + page-padding-right: 18px; } /* App Icons */ +.overview-tile, .grid-search-result, .search-provider-icon, .list-search-result { + border-radius: 24px; + padding: 12px; + spacing: 6px; + transition-duration: 150ms; + text-align: center; + background-color: transparent; + color: rgba(255, 255, 255, 0.85); + border: 1px solid transparent; + box-shadow: inset 0 1px transparent; +} -.show-apps:hover .overview-icon, -.show-apps:focus .overview-icon, -.show-apps:selected .overview-icon, -.app-well-app:hover .overview-icon, -.app-well-app:focus .overview-icon, -.app-well-app:selected .overview-icon, -.grid-search-result:hover .overview-icon, -.grid-search-result:focus .overview-icon, -.grid-search-result:selected .overview-icon { +.overview-tile:hover, .grid-search-result:hover, .search-provider-icon:hover, .list-search-result:hover, .overview-tile:focus, .grid-search-result:focus, .search-provider-icon:focus, .list-search-result:focus, .overview-tile:highlighted, .grid-search-result:highlighted, .search-provider-icon:highlighted, .list-search-result:highlighted, .overview-tile:selected, .grid-search-result:selected, .search-provider-icon:selected, .list-search-result:selected { background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.85); transition-duration: 0ms; border-image: none; background-image: none; @@ -2453,34 +2637,43 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps:active .overview-icon, -.show-apps:checked .overview-icon, -.app-well-app:active .overview-icon, -.app-well-app:checked .overview-icon, -.grid-search-result:active .overview-icon, -.grid-search-result:checked .overview-icon { +.overview-tile:active, .grid-search-result:active, .search-provider-icon:active, .list-search-result:active, .overview-tile:checked, .grid-search-result:checked, .search-provider-icon:checked, .list-search-result:checked { background-color: rgba(255, 255, 255, 0.15); transition-duration: 150ms; + color: rgba(255, 255, 255, 0.85); border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps .overview-icon.overview-icon-with-label, -.app-well-app .overview-icon.overview-icon-with-label, -.grid-search-result .overview-icon.overview-icon-with-label { - padding: 10px 8px 5px 8px; -} - - -.show-apps .overview-icon.overview-icon-with-label > StBoxLayout, -.app-well-app .overview-icon.overview-icon-with-label > StBoxLayout, -.grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout { +.overview-tile .overview-icon.overview-icon-with-label > StBoxLayout, .grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout, .search-provider-icon .overview-icon.overview-icon-with-label > StBoxLayout, .list-search-result .overview-icon.overview-icon-with-label > StBoxLayout { spacing: 4px; } -.app-well-app-running-dot { +.app-folder { + background-color: rgba(255, 255, 255, 0.13); +} + +.app-folder:focus { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:hover { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:active { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:highlighted, .app-folder:selected, .app-folder:checked { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:insensitive { + background-color: transparent; +} + +.app-grid-running-dot { width: 6px; height: 3px; border-radius: 2px; @@ -2488,33 +2681,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin-bottom: 1px; } -StWidget.focused .app-well-app-running-dot { +StWidget.focused .app-grid-running-dot { width: 18px; background-color: #3281ea; } -/* App Folders */ -.app-well-app.app-folder { - background: none; - border-radius: 10px; -} - -.app-well-app.app-folder .overview-icon { - background-color: rgba(255, 255, 255, 0.13); - border-radius: 10px; -} - -.app-well-app.app-folder:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.15); -} - -.app-well-app.app-folder:active .overview-icon { - background-color: rgba(255, 255, 255, 0.3); +.app-folder-dialog-container { + padding-top: 30px; } .app-folder-dialog { + width: 720px; + height: 720px; border-radius: 20px; background-color: rgba(34, 34, 34, 0.95); + color: white; border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } @@ -2562,7 +2743,9 @@ StWidget.focused .app-well-app-running-dot { color: rgba(255, 255, 255, 0.7); } -.app-folder-dialog .folder-name-container .edit-folder-button { +.app-folder-dialog .folder-name-container .icon-button, .app-folder-dialog .folder-name-container .background-app-item .close-button, .background-app-item .app-folder-dialog .folder-name-container .close-button, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button { background-color: rgba(255, 255, 255, 0.15); color: rgba(255, 255, 255, 0.7); border: none; @@ -2572,15 +2755,23 @@ StWidget.focused .app-well-app-running-dot { border-radius: 18px; } -.app-folder-dialog .folder-name-container .edit-folder-button > StIcon { +.app-folder-dialog .folder-name-container .icon-button > StIcon, .app-folder-dialog .folder-name-container .background-app-item .close-button > StIcon, .background-app-item .app-folder-dialog .folder-name-container .close-button > StIcon, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button > StIcon, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button > StIcon, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button > StIcon, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button > StIcon { icon-size: 16px; } -.app-folder-dialog .folder-name-container .edit-folder-button:hover { +.app-folder-dialog .folder-name-container .icon-button:hover, .app-folder-dialog .folder-name-container .background-app-item .close-button:hover, .background-app-item .app-folder-dialog .folder-name-container .close-button:hover, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:hover, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:hover, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:hover, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:hover { background-color: rgba(255, 255, 255, 0.15); } -.app-folder-dialog .folder-name-container .edit-folder-button:checked, .app-folder-dialog .folder-name-container .edit-folder-button:active { +.app-folder-dialog .folder-name-container .icon-button:checked, .app-folder-dialog .folder-name-container .background-app-item .close-button:checked, .background-app-item .app-folder-dialog .folder-name-container .close-button:checked, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:checked, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:checked, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:checked, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:checked, .app-folder-dialog .folder-name-container .icon-button:active, .app-folder-dialog .folder-name-container .background-app-item .close-button:active, .background-app-item .app-folder-dialog .folder-name-container .close-button:active, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:active, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:active, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:active, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:active { background-color: rgba(255, 255, 255, 0.3); } @@ -2597,12 +2788,6 @@ StWidget.focused .app-well-app-running-dot { margin-bottom: 18px; } -.app-folder-dialog-container { - padding: 12px; - width: 620px; - height: 620px; -} - .rename-folder-popup .rename-folder-popup-item { spacing: 4px; } @@ -2625,6 +2810,7 @@ StWidget.focused .app-well-app-running-dot { height: 10px; border-radius: 10px; background-color: white; + transition-duration: 400ms; } .apps-scroll-view { @@ -2638,10 +2824,6 @@ StWidget.focused .app-well-app-running-dot { icon-size: 8px; } -.page-navigation-hint { - width: 300px; -} - .page-navigation-hint.dnd { background: rgba(255, 255, 255, 0.1); } @@ -2667,6 +2849,11 @@ StWidget.focused .app-well-app-running-dot { height: 24px; border-radius: 9999px; color: rgba(255, 255, 255, 0.7); + background-color: transparent; +} + +.page-navigation-arrow > StIcon { + color: rgba(255, 255, 255, 0.85); } .page-navigation-arrow:insensitive { @@ -3123,11 +3310,15 @@ StWidget.focused .app-well-app-running-dot { padding: 12px 14px 16px !important; } -.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button { +.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .message .message-header .message-expand-button, .message .message-header .quick-settings .message-expand-button, +.quick-settings .message .message-header .message-close-button, +.message .message-header .quick-settings .message-close-button, .quick-settings .button { padding: 6px; } -.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .button > StIcon { +.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings .message-expand-button > StIcon, +.quick-settings .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings .message-close-button > StIcon, .quick-settings .button > StIcon { icon-size: 16px; } @@ -3301,18 +3492,24 @@ StWidget.focused .app-well-app-running-dot { icon-size: 16px; } -.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button { +.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button, .quick-slider .message .message-header .message-expand-button, .message .message-header .quick-slider .message-expand-button, +.quick-slider .message .message-header .message-close-button, +.message .message-header .quick-slider .message-close-button { min-width: 22px; min-height: 22px; background-color: transparent; color: rgba(255, 255, 255, 0.9) !important; } -.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover { +.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover, .quick-slider .message .message-header .message-expand-button:hover, .message .message-header .quick-slider .message-expand-button:hover, +.quick-slider .message .message-header .message-close-button:hover, +.message .message-header .quick-slider .message-close-button:hover { background-color: rgba(255, 255, 255, 0.06); } -.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active { +.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active, .quick-slider .message .message-header .message-expand-button:active, .message .message-header .quick-slider .message-expand-button:active, +.quick-slider .message .message-header .message-close-button:active, +.message .message-header .quick-slider .message-close-button:active { background-color: rgba(255, 255, 255, 0.12); } @@ -3365,7 +3562,9 @@ StWidget.focused .app-well-app-running-dot { spacing: 8px; } -.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button { +.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button, .quick-settings-system-item .message .message-header .message-expand-button, .message .message-header .quick-settings-system-item .message-expand-button, +.quick-settings-system-item .message .message-header .message-close-button, +.message .message-header .quick-settings-system-item .message-close-button { background-color: rgba(255, 255, 255, 0.06); color: rgba(255, 255, 255, 0.9); border-radius: 5px; @@ -3373,15 +3572,21 @@ StWidget.focused .app-well-app-running-dot { min-width: 22px; } -.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover { +.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover, .quick-settings-system-item .message .message-header .message-expand-button:hover, .message .message-header .quick-settings-system-item .message-expand-button:hover, +.quick-settings-system-item .message .message-header .message-close-button:hover, +.message .message-header .quick-settings-system-item .message-close-button:hover { background-color: rgba(255, 255, 255, 0.1); } -.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active { +.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active, .quick-settings-system-item .message .message-header .message-expand-button:active, .message .message-header .quick-settings-system-item .message-expand-button:active, +.quick-settings-system-item .message .message-header .message-close-button:active, +.message .message-header .quick-settings-system-item .message-close-button:active { background-color: rgba(255, 255, 255, 0.15); } -.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon { +.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon, .quick-settings-system-item .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings-system-item .message-expand-button > StIcon, +.quick-settings-system-item .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings-system-item .message-close-button > StIcon { -st-icon-style: symbolic; icon-size: 16px; } @@ -3665,15 +3870,15 @@ StWidget.focused .app-well-app-running-dot { color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.15); margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .login-dialog StEntry:focus, .unlock-dialog StEntry:focus { color: rgba(255, 255, 255, 0.9); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #3281ea; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #3281ea !important; } .login-dialog StEntry:insensitive, @@ -4142,7 +4347,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left #dash .dash-item-container .app-well-app, #dashtodockContainer.right #dash .dash-item-container .app-well-app { - padding: 3px 4px !important; + padding: 1px 4px !important; } #dashtodockContainer.left #dash .show-apps, #dashtodockContainer.right #dash .show-apps { @@ -4155,11 +4360,11 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.left.extended #dash .show-apps, #dashtodockContainer.left.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.left.straight-corner #dash .show-apps, #dashtodockContainer.right.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.right.extended #dash .show-apps, #dashtodockContainer.right.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.right.straight-corner #dash .show-apps { - padding: 3px 10px !important; + padding: 1px 8px !important; } #dashtodockContainer.top #dash .dash-background, #dashtodockContainer.bottom #dash .dash-background { - padding: 10px 5px !important; + padding: 8px 4px !important; } #dashtodockContainer.top.shrink #dash .dash-background, #dashtodockContainer.bottom.shrink #dash .dash-background { @@ -4172,11 +4377,11 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.top.extended #dash .dash-separator, #dashtodockContainer.top.straight-corner #dash .dash-separator, #dashtodockContainer.bottom.extended #dash .dash-separator, #dashtodockContainer.bottom.straight-corner #dash .dash-separator { - margin: 0 8px !important; + margin: 0 5px !important; } #dashtodockContainer.top.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.top.extended #dash .show-apps, #dashtodockContainer.top.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.top.straight-corner #dash .show-apps, #dashtodockContainer.bottom.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.extended #dash .show-apps, #dashtodockContainer.bottom.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.straight-corner #dash .show-apps { - padding: 10px 3px !important; + padding: 8px 1px !important; } #dashtodockContainer #dash { @@ -4185,7 +4390,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer #dash .dash-background { - background-color: #202020; + background-color: rgba(0, 0, 0, 0.5); background-clip: padding-box; } @@ -4241,7 +4446,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.transparent #dash .dash-background { - background-color: #202020; + background-color: rgba(0, 0, 0, 0.5); } #dashtodockContainer:overview #dash .dash-background { diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/gtk-dark.css index 0780c94..10b0fc5 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/gtk-dark.css @@ -1432,7 +1432,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { border-radius: 8px 8px 0 0; color: white; box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12); - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .titlebar:disabled { @@ -1984,7 +1984,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); background-clip: border-box; border: 1px solid rgba(255, 255, 255, 0.12); } @@ -2118,7 +2118,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: border-box; } @@ -4296,7 +4296,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(48, 48, 48, 0.95); border-radius: 0 0 8px 8px; - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd.unified { @@ -4304,11 +4304,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7512,8 +7512,6 @@ frame.raven-frame > border { .raven { background-color: #3C3C3C; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8013,7 +8011,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); background-color: #3C3C3C; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/gtk.css index 0780c94..10b0fc5 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-3.0/gtk.css @@ -1432,7 +1432,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { border-radius: 8px 8px 0 0; color: white; box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12); - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .titlebar:disabled { @@ -1984,7 +1984,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); background-clip: border-box; border: 1px solid rgba(255, 255, 255, 0.12); } @@ -2118,7 +2118,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: border-box; } @@ -4296,7 +4296,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(48, 48, 48, 0.95); border-radius: 0 0 8px 8px; - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd.unified { @@ -4304,11 +4304,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7512,8 +7512,6 @@ frame.raven-frame > border { .raven { background-color: #3C3C3C; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8013,7 +8011,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); background-color: #3C3C3C; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/gtk-dark.css index de4b32f..82dc829 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/gtk-dark.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1741,7 +1741,7 @@ headerbar { min-height: 36px; margin: 0; padding: 0; - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } headerbar:disabled { @@ -1912,10 +1912,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2386,8 +2382,8 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #3C3C3C; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(60, 60, 60, 0.98); border-radius: 6px; color: white; border: 1px solid rgba(255, 255, 255, 0.12); @@ -2430,6 +2426,10 @@ popover.background toolbar { background-color: #3C3C3C; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2499,9 +2499,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 20px; min-width: 20px; padding: 2px 8px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(255, 255, 255, 0.7); @@ -2766,6 +2765,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4732,7 +4736,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4881,6 +4885,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 8px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4917,7 +4925,7 @@ weekgrid.current { } popover.events { - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); padding: 0; } @@ -5346,7 +5354,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5857,6 +5865,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5970,7 +5986,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6065,7 +6081,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6190,7 +6206,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6278,7 +6294,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 16px 4px 8 2; + margin: 16px 4px 8px 2px; border-spacing: 16px; } @@ -6819,12 +6835,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); color: white; } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6978,13 +6994,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); color: white; } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7017,6 +7033,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7171,6 +7193,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 6px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #3281EA; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 4px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #3281EA; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(255, 255, 255, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/gtk.css index de4b32f..82dc829 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark-compact/gtk-4.0/gtk.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1741,7 +1741,7 @@ headerbar { min-height: 36px; margin: 0; padding: 0; - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } headerbar:disabled { @@ -1912,10 +1912,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2386,8 +2382,8 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #3C3C3C; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(60, 60, 60, 0.98); border-radius: 6px; color: white; border: 1px solid rgba(255, 255, 255, 0.12); @@ -2430,6 +2426,10 @@ popover.background toolbar { background-color: #3C3C3C; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2499,9 +2499,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 20px; min-width: 20px; padding: 2px 8px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(255, 255, 255, 0.7); @@ -2766,6 +2765,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4732,7 +4736,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4881,6 +4885,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 8px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4917,7 +4925,7 @@ weekgrid.current { } popover.events { - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); padding: 0; } @@ -5346,7 +5354,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5857,6 +5865,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5970,7 +5986,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6065,7 +6081,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6190,7 +6206,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6278,7 +6294,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 16px 4px 8 2; + margin: 16px 4px 8px 2px; border-spacing: 16px; } @@ -6819,12 +6835,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); color: white; } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6978,13 +6994,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); color: white; } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7017,6 +7033,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7171,6 +7193,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 6px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #3281EA; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 4px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #3281EA; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(255, 255, 255, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/cinnamon/cinnamon.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/cinnamon/cinnamon.css index 605b758..c173832 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/cinnamon/cinnamon.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/cinnamon/cinnamon.css @@ -10,7 +10,7 @@ stage { min-height: 24px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); } @@ -18,36 +18,36 @@ stage { .sound-button:focus { color: white; background-color: rgba(255, 255, 255, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover { color: white; background-color: rgba(255, 255, 255, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover:focus { color: white; background-color: rgba(255, 255, 255, 0.3); - border-radius: 4px; + border-radius: 2px; } .sound-button:active { color: white; background-color: rgba(255, 255, 255, 0.3); - border-radius: 4px; + border-radius: 2px; } .sound-button:insensitive { color: rgba(255, 255, 255, 0.5); background-color: rgba(255, 255, 255, 0.04); - border-radius: 4px; + border-radius: 2px; } .notification-button, .notification-icon-button, .menu #notification .notification-button, .menu #notification .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button, #notification .notification-button, #notification .notification-icon-button, .calendar-today-home-button, .calendar-today-home-button-enabled { - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); background-color: transparent; } @@ -56,28 +56,28 @@ stage { .calendar-today-home-button-enabled:hover { color: white; background-color: rgba(255, 255, 255, 0.12); - border-radius: 4px; + border-radius: 2px; } .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active, .calendar-today-home-button:active, .calendar-today-home-button-enabled:active { color: white; background-color: rgba(255, 255, 255, 0.3); - border-radius: 4px; + border-radius: 2px; } .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive, .calendar-today-home-button:insensitive, .calendar-today-home-button-enabled:insensitive { color: rgba(255, 255, 255, 0.3); background-color: transparent; - border-radius: 4px; + border-radius: 2px; } .modal-dialog-button-box .modal-dialog-button { min-height: 24px; padding: 6px 30px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); } @@ -108,7 +108,7 @@ stage { selection-background-color: #3281EA; selected-color: white; transition-duration: 300ms; - border-radius: 4px; + border-radius: 2px; color: white; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.04); @@ -271,7 +271,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 4px; + border-radius: 2px; padding: 5px 12px; background-color: rgba(54, 54, 54, 0.9); color: white; @@ -300,8 +300,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-content { padding: 6px 0; color: white; - background-color: #3C3C3C; - border-radius: 6px; + background-color: rgba(60, 60, 60, 0.98); + border-radius: 3px; margin: 6px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } @@ -351,7 +351,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: 6px 12px; spacing: 12px; - border-radius: 4px; + border-radius: 2px; margin: 0 6px; } @@ -395,7 +395,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); @@ -525,7 +525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 1em; padding: 0px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5), 0 0 16px rgba(0, 0, 0, 0.24); - background-color: #1F1F1F; + background-color: rgba(31, 31, 31, 0.8); } .panel-top .panel-button:hover, @@ -585,7 +585,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(54, 54, 54, 0.9); color: white; spacing: 25px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -601,7 +601,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, .expo-workspaces-name-entry#selected { height: 15px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -624,13 +624,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspace-thumbnail-frame { border: 4px solid rgba(255, 255, 255, 0); background-color: rgba(255, 255, 255, 0); - border-radius: 4px; + border-radius: 2px; } .expo-workspace-thumbnail-frame#active { border: 4px solid #3281EA; background-color: black; - border-radius: 4px; + border-radius: 2px; } .expo-background { @@ -730,7 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 4px; + border-radius: 2px; background-color: #2B2B2B; padding: 4px; padding-right: 0; @@ -845,7 +845,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { text-align: center; font-size: 14px; color: white; - border-radius: 4px; + border-radius: 2px; } .calendar-day-base { @@ -930,7 +930,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 8px; min-width: 350px; border: none; - border-radius: 4px; + border-radius: 2px; background-gradient-direction: vertical; background-gradient-start: rgba(255, 255, 255, 0.04); background-gradient-end: rgba(255, 255, 255, 0.04); @@ -940,7 +940,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-events-no-events-button { margin: 6px 0; padding: 6px; - border-radius: 4px; + border-radius: 2px; } .calendar-events-no-events-button:hover { @@ -983,7 +983,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-event-button { margin: 6px 0 6px 0; - border-radius: 4px; + border-radius: 2px; } .calendar-event-button:hover { @@ -1050,14 +1050,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 8px; + border-radius: 3px; padding: 12px; spacing-rows: 9px; spacing-columns: 9px; margin-from-right-edge-of-screen: 18px; width: 28em; color: white; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); margin: 7px 12px 17px 12px; } @@ -1068,7 +1068,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu #notification, .popup-menu #notification { border: none; - border-radius: 4px; + border-radius: 2px; background-color: rgba(255, 255, 255, 0.05); box-shadow: none; margin: 0; @@ -1136,9 +1136,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: white; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); border: none; - border-radius: 4px; + border-radius: 2px; padding: 20px; } @@ -1152,7 +1152,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 4px; + border-radius: 2px; } .switcher-list .item-box:outlined { @@ -1226,7 +1226,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(46, 46, 46, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 4px; + border-radius: 2px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1251,7 +1251,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 6px 12px; background-color: rgba(54, 54, 54, 0.9); - border-radius: 4px; + border-radius: 2px; color: white; } @@ -1283,7 +1283,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 3px 12px; - border-radius: 4px; + border-radius: 2px; caret-color: white; selected-color: white; selection-background-color: #3281EA; @@ -1412,7 +1412,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 4px; + border-radius: 2px; box-shadow: none; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); @@ -1436,7 +1436,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: white; padding: 5px; - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(54, 54, 54, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1452,17 +1452,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { transition-duration: 300; background-color: rgba(255, 255, 255, 0.05); border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button { padding: 9px; border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button:hover { - border-radius: 4px; + border-radius: 2px; background-color: rgba(255, 255, 255, 0.1); } @@ -1486,7 +1486,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1498,7 +1498,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: white; background-color: rgba(255, 255, 255, 0.12); padding: 6px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1516,7 +1516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu StScrollView.menu-application-button { padding: 3px 0; - border-radius: 4px; + border-radius: 2px; background-color: rgba(255, 255, 255, 0.04); color: rgba(255, 255, 255, 0.7); } @@ -1525,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; spacing: 0; margin: 0 3px; - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); } @@ -1557,7 +1557,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border-radius: 4px; + border-radius: 2px; } .menu-category-button-selected { @@ -1567,7 +1567,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button-hover, .menu-category-button-selected { color: white; background-color: rgba(255, 255, 255, 0.12); - border-radius: 4px; + border-radius: 2px; } .menu-category-button-greyed { @@ -1647,12 +1647,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 4px; + border-radius: 2px; color: #3281EA; } .osd-window .level-bar { - border-radius: 4px; + border-radius: 2px; background-color: #3281EA; } @@ -1800,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #81C995; background-gradient-end: #81C995; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -1814,7 +1814,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 6px; border: none; background-color: #2B2B2B; - border-radius: 4px; + border-radius: 2px; color: white; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1830,15 +1830,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu { padding: 6px; color: white; - background-color: #3C3C3C; - border-radius: 6px; + background-color: rgba(60, 60, 60, 0.98); + border-radius: 3px; margin: 6px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } .grouped-window-list-thumbnail-menu .item-box { padding: 6px; - border-radius: 4px; + border-radius: 2px; spacing: 6px; margin: 1px; } @@ -1923,7 +1923,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #81C995; background-gradient-end: #81C995; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -2004,7 +2004,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 0; margin-top: 6px; - border-radius: 4px; + border-radius: 2px; background-color: rgba(255, 255, 255, 0.04); color: white; } @@ -2043,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 6px; background-color: rgba(0, 0, 0, 0.5); border: none; - border-radius: 0 0 4px 4px; + border-radius: 0 0 2px 2px; color: white; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gnome-shell/assets/menu.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gnome-shell/assets/menu.svg index ffcb7de..6e218fd 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gnome-shell/assets/menu.svg +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gnome-shell/assets/menu.svg @@ -7,7 +7,7 @@ viewBox="0 0 16.933333 16.933334" version="1.1" id="svg5" - inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)" + inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)" sodipodi:docname="menu.svg" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" @@ -27,7 +27,7 @@ width="120px" inkscape:zoom="11.550363" inkscape:cx="32.726244" - inkscape:cy="27.61818" + inkscape:cy="13.765801" inkscape:window-width="1920" inkscape:window-height="1012" inkscape:window-x="0" @@ -84,7 +84,7 @@ d="M 14.011719 2.9960938 C 9.0350663 2.9960938 4.9980469 7.0409257 4.9980469 12.017578 L 4.9980469 47.982422 C 4.9980469 52.959073 9.0350663 57.003906 14.011719 57.003906 L 49.982422 57.003906 C 54.959077 57.003906 59.003906 52.959073 59.003906 47.982422 L 59.003906 12.017578 C 59.003906 7.0409257 54.959077 2.9960938 49.982422 2.9960938 L 14.011719 2.9960938 z M 14.013672 4 L 49.986328 4 C 54.426283 4 58 7.5737176 58 12.013672 L 58 47.986328 C 58 52.426283 54.426283 56 49.986328 56 L 14.013672 56 C 9.5737176 56 6 52.426283 6 47.986328 L 6 12.013672 C 6 7.5737176 9.5737176 4 14.013672 4 z " transform="scale(0.26458333)" /> diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gnome-shell/gnome-shell.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gnome-shell/gnome-shell.css index 2f0c38b..a12252e 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gnome-shell/gnome-shell.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gnome-shell/gnome-shell.css @@ -5,6 +5,32 @@ stage { color: rgba(255, 255, 255, 0.9); } +/* Common Stylings */ +#dash .dash-item-container .show-apps, +#dash .dash-item-container .overview-tile, +#dash .dash-item-container .grid-search-result, +#dash .dash-item-container .search-provider-icon, +#dash .dash-item-container .list-search-result { + background: none; + box-shadow: none; + border: none; + border-radius: 0; + padding: 0; + margin: 0; +} + +#dash .dash-item-container .show-apps .overview-icon, +#dash .dash-item-container .overview-tile .overview-icon, +#dash .dash-item-container .grid-search-result .overview-icon, +#dash .dash-item-container .search-provider-icon .overview-icon, +#dash .dash-item-container .list-search-result .overview-icon { + border-radius: 10px; + padding: 6px; + spacing: 6px; + text-align: center; + transition-duration: 100ms; +} + .search-statustext { font-size: 45px; font-weight: 400; @@ -74,32 +100,32 @@ stage { /* General Typography */ .message-list .message-list-placeholder { font-weight: 800; - font-size: 15pt; + font-size: 1.364em; } .quick-toggle-menu .header .title { font-weight: 700; - font-size: 15pt; + font-size: 1.364em; } .bt-menu-placeholder.popup-menu-item { font-weight: 700; - font-size: 13pt; + font-size: 1.182em; } -.background-app-item .title { +.background-app-item .title, .message-list-controls, .calendar .calendar-month-header .calendar-month-label { font-weight: 700; - font-size: 11pt; + font-size: 1em; } .quick-toggle-menu .header .subtitle { font-weight: 700; - font-size: 9pt; + font-size: 0.818em; } -.background-app-item .subtitle { +.background-app-item .subtitle, .message .message-header .message-header-content .event-time { font-weight: 400; - font-size: 9pt; + font-size: 0.818em; } /* WIDGETS */ @@ -142,18 +168,18 @@ StEntry { color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.15); margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } StEntry:hover { - border: 2px solid rgba(255, 255, 255, 0.15); + border: 2px solid rgba(255, 255, 255, 0.15) !important; } StEntry:focus { color: rgba(255, 255, 255, 0.9); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #3281ea; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #3281ea !important; } StEntry:insensitive { @@ -177,47 +203,17 @@ StEntry StLabel.hint-text { } /* Buttons */ -.button { - min-height: 24px; - padding: 6px 12px; - border-width: 0; - border-radius: 5px; - font-size: 10.5pt; - font-weight: 500; - color: rgba(255, 255, 255, 0.7); - background-color: transparent; - box-shadow: none; -} - -.button:hover { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.06); - box-shadow: none; -} - -.button:active { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.15); - box-shadow: 0 0 transparent; -} - -.button:insensitive { - color: rgba(255, 255, 255, 0.3); - background-color: transparent; - box-shadow: none; -} - -.button:focus { - color: rgba(255, 255, 255, 0.9); - box-shadow: none; -} - .screenshot-ui-show-pointer-button, .screenshot-ui-type-button { color: rgba(255, 255, 255, 0.7); background-color: transparent; box-shadow: none; } +.screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { + color: rgba(255, 255, 255, 0.85); + box-shadow: none; +} + .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover { color: rgba(255, 255, 255, 0.85); background-color: rgba(255, 255, 255, 0.15); @@ -243,11 +239,156 @@ StEntry StLabel.hint-text { box-shadow: none; } -.screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus { - color: rgba(255, 255, 255, 0.85); +.icon-button.flat, .background-app-item .flat.close-button, .message .message-header .flat.message-expand-button, +.message .message-header .flat.message-close-button, .button.flat { + color: rgba(255, 255, 255, 0.7); + background-color: transparent; box-shadow: none; } +.icon-button.flat:focus, .background-app-item .flat.close-button:focus, .message .message-header .flat.message-expand-button:focus, +.message .message-header .flat.message-close-button:focus, .button.flat:focus { + color: rgba(255, 255, 255, 0.9); + box-shadow: none; +} + +.icon-button.flat:hover, .background-app-item .flat.close-button:hover, .message .message-header .flat.message-expand-button:hover, +.message .message-header .flat.message-close-button:hover, .button.flat:hover { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0.06); + box-shadow: none; +} + +.icon-button.flat:selected, .background-app-item .flat.close-button:selected, .message .message-header .flat.message-expand-button:selected, +.message .message-header .flat.message-close-button:selected, .button.flat:selected, .icon-button.flat:active, .background-app-item .flat.close-button:active, .message .message-header .flat.message-expand-button:active, +.message .message-header .flat.message-close-button:active, .button.flat:active { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0.15); + box-shadow: 0 0 transparent; +} + +.icon-button.flat:checked, .background-app-item .flat.close-button:checked, .message .message-header .flat.message-expand-button:checked, +.message .message-header .flat.message-close-button:checked, .button.flat:checked { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0.15); + box-shadow: 0 0 transparent; +} + +.icon-button.flat:insensitive, .background-app-item .flat.close-button:insensitive, .message .message-header .flat.message-expand-button:insensitive, +.message .message-header .flat.message-close-button:insensitive, .button.flat:insensitive { + color: rgba(255, 255, 255, 0.3); + background-color: transparent; + box-shadow: none; +} + +.icon-button.default, .background-app-item .default.close-button, .message .message-header .default.message-expand-button, +.message .message-header .default.message-close-button, .button.default { + color: #FFFFFF; + background-color: #3281ea; + border-color: rgba(255, 255, 255, 0.08); + box-shadow: none; +} + +.icon-button.default:focus, .background-app-item .default.close-button:focus, .message .message-header .default.message-expand-button:focus, +.message .message-header .default.message-close-button:focus, .button.default:focus { + color: #3281ea; + box-shadow: none; +} + +.icon-button.default:focus:active, .background-app-item .default.close-button:focus:active, .message .message-header .default.message-expand-button:focus:active, +.message .message-header .default.message-close-button:focus:active, .button.default:focus:active { + color: white; +} + +.icon-button.default:hover, .background-app-item .default.close-button:hover, .message .message-header .default.message-expand-button:hover, +.message .message-header .default.message-close-button:hover, .button.default:hover { + color: #FFFFFF; + background-color: #3281ea; + border-color: rgba(255, 255, 255, 0.15); + box-shadow: none; +} + +.icon-button.default:insensitive, .background-app-item .default.close-button:insensitive, .message .message-header .default.message-expand-button:insensitive, +.message .message-header .default.message-close-button:insensitive, .button.default:insensitive { + color: #FFFFFF; + background-color: #3281ea; + border-color: transparent; + box-shadow: none; +} + +.icon-button.default:active, .background-app-item .default.close-button:active, .message .message-header .default.message-expand-button:active, +.message .message-header .default.message-close-button:active, .button.default:active { + color: #FFFFFF; + background-color: #1b73e8; + border-color: rgba(255, 255, 255, 0.15); + box-shadow: none; +} + +.icon-button, .background-app-item .close-button, .message .message-header .message-expand-button, +.message .message-header .message-close-button, .button { + padding: 6px 12px; + border-width: 0; + border-radius: 5px; + font-size: 10.5pt; + font-weight: 500; + color: rgba(255, 255, 255, 0.7); + background-color: transparent; + box-shadow: none; +} + +.icon-button:focus, .background-app-item .close-button:focus, .message .message-header .message-expand-button:focus, +.message .message-header .message-close-button:focus, .button:focus { + color: rgba(255, 255, 255, 0.9); + box-shadow: none; +} + +.icon-button:hover, .background-app-item .close-button:hover, .message .message-header .message-expand-button:hover, +.message .message-header .message-close-button:hover, .button:hover { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0.06); + box-shadow: none; +} + +.icon-button:selected, .background-app-item .close-button:selected, .message .message-header .message-expand-button:selected, +.message .message-header .message-close-button:selected, .button:selected, .icon-button:active, .background-app-item .close-button:active, .message .message-header .message-expand-button:active, +.message .message-header .message-close-button:active, .button:active { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0.15); + box-shadow: 0 0 transparent; +} + +.icon-button:checked, .background-app-item .close-button:checked, .message .message-header .message-expand-button:checked, +.message .message-header .message-close-button:checked, .button:checked { + color: rgba(255, 255, 255, 0.85); + background-color: #3281ea; + border-color: #3281ea; + box-shadow: none; +} + +.icon-button:insensitive, .background-app-item .close-button:insensitive, .message .message-header .message-expand-button:insensitive, +.message .message-header .message-close-button:insensitive, .button:insensitive { + color: rgba(255, 255, 255, 0.3); + background-color: transparent; + box-shadow: none; +} + +.button { + min-height: 1.5em; +} + +.icon-button, .background-app-item .close-button, .message .message-header .message-expand-button, +.message .message-header .message-close-button { + border-radius: 9999px; + padding: 0.818em; + min-height: 1.091em; +} + +.icon-button StIcon, .background-app-item .close-button StIcon, .message .message-header .message-expand-button StIcon, +.message .message-header .message-close-button StIcon { + icon-size: 1.091em; + -st-icon-style: symbolic; +} + /* Check Boxes */ .check-box StBoxLayout { spacing: .8em; @@ -311,7 +452,7 @@ StEntry StLabel.hint-text { /* Slider */ .slider { - height: 12px; + height: 16px; -barlevel-height: 2px; -barlevel-background-color: rgba(255, 255, 255, 0.15); -barlevel-border-width: 0; @@ -586,29 +727,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Date/Time Menu */ -.clock-display-box { - spacing: 2px; -} - -.clock-display-box .clock { - padding-left: 12px; - padding-right: 12px; -} - -.clock { - padding: 0; - margin: 0 6px; - border: none; - box-shadow: none; - background: none; - text-shadow: none; - color: rgba(255, 255, 255, 0.7); -} - #calendarArea { padding: 6px 0; } +.datemenu-popover { + border-radius: 25.5px; +} + .calendar { padding: 0; margin: 0 6px; @@ -619,6 +745,33 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(255, 255, 255, 0.7); } +.calendar .calendar-month-header .calendar-change-month-back StIcon, +.calendar .calendar-month-header .calendar-change-month-forward StIcon { + icon-size: 1.091em; +} + +.calendar .calendar-month-header .calendar-month-label { + background-color: transparent !important; + color: rgba(255, 255, 255, 0.9) !important; + padding: 8px 0; + width: 10em; + text-align: center; +} + +.calendar .calendar-day-heading { + width: 32px; + height: 25px; + margin-top: 2px; + padding: 7px 0 0; + border-radius: 100px; + background-color: transparent !important; + color: rgba(255, 255, 255, 0.5) !important; + font-size: 9pt; + font-weight: 400; + font-weight: bold; + text-align: center; +} + .datemenu-calendar-column { spacing: 6px; border: none; @@ -689,22 +842,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.15); } -.calendar-month-label { - height: 24px; - margin: 2px; - padding: 6px 16px; - border-radius: 5px; - color: rgba(255, 255, 255, 0.7); - font-weight: bold; - text-align: center; - text-shadow: none; -} - -.calendar-month-label:focus { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.06); -} - .pager-button { width: 32px; height: 32px; @@ -742,8 +879,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: url("assets/calendar-arrow-left.svg"); } -.calendar-day, -.calendar-day-base { +.calendar-day { font-size: 9pt; font-weight: 400; text-align: center; @@ -752,49 +888,31 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 2px !important; margin: 2px !important; border-radius: 9999px; - color: rgba(255, 255, 255, 0.7); + color: rgba(255, 255, 255, 0.7) !important; + background-color: transparent !important; border: none; font-feature-settings: "tnum"; text-shadow: none; } -.calendar-day:hover, .calendar-day:focus, -.calendar-day-base:hover, -.calendar-day-base:focus { - background-color: rgba(255, 255, 255, 0.06); +.calendar-day:hover, .calendar-day:focus { + background-color: rgba(255, 255, 255, 0.06) !important; box-shadow: none !important; } -.calendar-day:active, -.calendar-day-base:active { - color: rgba(255, 255, 255, 0.7); - background-color: rgba(255, 255, 255, 0.15); +.calendar-day:active { + color: rgba(255, 255, 255, 0.7) !important; + background-color: rgba(255, 255, 255, 0.15) !important; border-color: transparent; } -.calendar-day:selected, -.calendar-day-base:selected { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.15); +.calendar-day:selected { + color: rgba(255, 255, 255, 0.9) !important; + background-color: rgba(255, 255, 255, 0.15) !important; border-color: transparent; box-shadow: none !important; } -.calendar-day.calendar-day-heading, -.calendar-day-base.calendar-day-heading { - width: 32px; - height: 25px; - margin-top: 2px; - padding: 7px 0 0; - border-radius: 100px; - background-color: transparent; - color: rgba(255, 255, 255, 0.5); - font-size: 9pt; - font-weight: 400; - font-weight: bold; - text-align: center; -} - .calendar-day { border-width: 0; } @@ -813,26 +931,26 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-today { font-weight: bold !important; - color: white; - background-color: #3281ea; + color: white !important; + background-color: #3281ea !important; border: none; } .calendar-today:hover, .calendar-today:focus { - background-color: #408aeb; - color: white; + background-color: #408aeb !important; + color: white !important; box-shadow: none !important; } .calendar-today:active, .calendar-today:selected { - background-color: #3281ea; - color: white; + background-color: #3281ea !important; + color: white !important; box-shadow: none !important; } .calendar-today:active:hover, .calendar-today:active:focus, .calendar-today:selected:hover, .calendar-today:selected:focus { - background-color: #408aeb; - color: white; + background-color: #408aeb !important; + color: white !important; } .calendar-day-with-events { @@ -845,10 +963,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; } -.calendar-other-month, -.calendar-other-month-day { +.calendar-weekend { + color: rgba(255, 255, 255, 0.5); +} + +.calendar-other-month { color: rgba(255, 255, 255, 0.3) !important; opacity: 1; + font-weight: normal; +} + +.calendar-other-month.calendar-weekend { + color: rgba(255, 255, 255, 0.3) !important; } .calendar-week-number { @@ -996,7 +1122,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Message List */ .message-list { - width: 30em; + width: 29em; padding: 0; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1019,20 +1145,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-list .message-list-placeholder { - spacing: 12px; - color: rgba(255, 255, 255, 0.7); + color: rgba(255, 255, 255, 0.3); } .message-list .message-list-placeholder > StIcon { - icon-size: 48px; + icon-size: 96px; margin-bottom: 12px; -st-icon-style: symbolic; } .message-list-sections { - spacing: 6px; - margin: 0; - padding-bottom: 6px; + spacing: 12px; } .message-list-sections:ltr { @@ -1045,13 +1168,24 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section, .message-list-section-list { - spacing: 6px; + spacing: 12px; } .message-list-controls { - margin: 8px 16px 0; - padding: 4px; - spacing: 12px; + padding: 12px; + padding-bottom: 6px; + spacing: 6px; +} + +.message-list-controls .dnd-button { + border-width: 2px; + border-color: transparent; + border-radius: 32px; + border-style: solid; +} + +.message-list-controls .dnd-button:focus { + border-color: rgba(50, 129, 234, 0.6); } .message { @@ -1059,97 +1193,152 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 5px; color: rgba(255, 255, 255, 0.7); text-shadow: none; + padding: 0; + margin: 4px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.15); - border: 1px solid rgba(255, 255, 255, 0.05); + background-color: rgba(32, 32, 32, 0.95); + border: 1px solid transparent; +} + +.message:hover, .message:focus, .message:active { + background-color: #202020; } .popup-menu .message { - box-shadow: none; margin: 0 0 4px; + box-shadow: none; + background-color: rgba(255, 255, 255, 0.03); + border-radius: 5px; + color: rgba(255, 255, 255, 0.7); + border: 1px solid rgba(255, 255, 255, 0.05); } -.message:hover, .message:focus { +.popup-menu .message:hover, .popup-menu .message:focus { background-color: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.08); } -.message:active { +.popup-menu .message:active { background-color: rgba(255, 255, 255, 0.12); } -.message .message-icon-bin { - padding: 18px; - padding-right: 6px; +.message:ltr { + padding-right: -2px; } -.message .message-icon-bin:rtl { - padding-left: 6px; +.message:rtl { + padding-left: -2px; } -.message .message-icon-bin > StIcon { +.message .message-header { + padding: 0 0.409em; + margin: 6px; + margin-bottom: 0; + spacing: 6px; + color: rgba(255, 255, 255, 0.5); +} + +.message .message-header .message-source-icon { + icon-size: 1.091em; + -st-icon-style: symbolic; +} + +.message .message-header .message-header-content { + spacing: 6px; + min-height: 1.637em; + padding-bottom: 6px; +} + +.message .message-header .message-header-content .message-source-title { + font-weight: bold; +} + +.message .message-header .message-header-content .event-time { + color: rgba(255, 255, 255, 0.5); + padding-bottom: 0.068em; +} + +.message .message-header .message-header-content .event-time:ltr { + text-align: right; +} + +.message .message-header .message-header-content .event-time:rtl { + text-align: left; +} + +.message .message-header .message-expand-button, +.message .message-header .message-close-button { + color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0); + padding: 4px; +} + +.message .message-header .message-expand-button:hover, +.message .message-header .message-close-button:hover { + background-color: rgba(255, 255, 255, 0.09); +} + +.message .message-header .message-expand-button:active, .message .message-header .message-expand-button:active:hover, +.message .message-header .message-close-button:active, +.message .message-header .message-close-button:active:hover { + background-color: rgba(255, 255, 255, 0.14); +} + +.message .message-header .message-expand-button:insensitive, +.message .message-header .message-close-button:insensitive { + background-color: rgba(255, 255, 255, 0); +} + +.message .message-header .message-expand-button { + padding: 6px; +} + +.message .message-header .message-expand-button:ltr { + margin-right: 6px; +} + +.message .message-header .message-expand-button:rtl { + margin-left: 6px; +} + +.message .message-box { + padding: 6px; + margin: 6px; + margin-top: 0; + spacing: 6px; +} + +.message .message-box .message-icon { icon-size: 48px; -st-icon-style: symbolic; } -.message .message-icon-bin > .fallback-app-icon { - width: 32px; - height: 32px; +.message .message-box .message-icon:ltr { + margin-right: 6px; } -.message .message-content { - padding: 14px; - spacing: 4px; - margin-bottom: 8px; - color: rgba(255, 255, 255, 0.7); +.message .message-box .message-icon:rtl { + margin-left: 6px; } -.message .message-title { - font-weight: bold; - padding-top: 0.57em; -} - -.message .message-secondary-bin { - padding: 0 8px; -} - -.message .message-secondary-bin > .event-time { - color: rgba(255, 255, 255, 0.7); - font-size: 0.9em; - padding-bottom: 0.13em; -} - -.message .message-secondary-bin > .event-time:ltr { - text-align: right; -} - -.message .message-secondary-bin > .event-time:rtl { - text-align: left; -} - -.message .message-close-button { - color: rgba(255, 255, 255, 0.7); - padding: 2px; - height: 24px; - width: 24px; +.message .message-box .message-icon.message-themed-icon { border-radius: 9999px; + background-color: rgba(255, 255, 255, 0.1); + icon-size: 16px; + min-width: 48px; + min-height: 48px; } -.message .message-close-button:hover, .message .message-close-button:focus { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.06); +.message .message-box:first-child { + margin-top: 12px; } -.message .message-close-button:active { - color: rgba(255, 255, 255, 0.9); - background-color: rgba(255, 255, 255, 0.15); +.message .message-box .message-content { + spacing: 4px; } -.message .message-close-button:insensitive { - color: rgba(255, 255, 255, 0.3); -} - -.message .message-body { - color: rgba(255, 255, 255, 0.5); +.message .message-box .message-content .message-title { + font-weight: bold; } .url-highlighter { @@ -1158,10 +1347,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Media Controls */ .message-media-control { - margin: 24px 6px; - padding: 12px; + margin: 4px 0; + padding: 0 12px; border-radius: 9999px; color: rgba(255, 255, 255, 0.7); + border: none; } .message-media-control:hover, .message-media-control:focus { @@ -1178,33 +1368,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(255, 255, 255, 0.3); } -.message-media-control:last-child:ltr { - margin-right: 16px; - padding-right: 8px; +.message-media-control StIcon { + icon-size: 16px; } -.message-media-control:last-child:rtl { - margin-left: 16px; - padding-left: 8px; +.media-message .message-icon { + border-radius: 5px !important; } -.media-message-cover-icon { - icon-size: 48px !important; - border-radius: 5px; - border: none; -} - -.media-message-cover-icon.fallback { - color: rgba(255, 255, 255, 0.5); - background-color: rgba(255, 255, 255, 0.06); - border: none; - border-radius: 5px; +.media-message .message-icon.message-themed-icon { icon-size: 32px !important; - padding: 8px; } .candidate-popup-content { - background-color: #202020; + background-color: rgba(32, 32, 32, 0.95); border-radius: 8px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.25) !important; margin: 3px 8px 11px; @@ -1277,126 +1454,87 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { min-height: 64px; width: 34em; - font-size: 1em; - margin: 9px 8px 12px; - border-radius: 5px; - color: rgba(255, 255, 255, 0.9); - background-color: rgba(32, 32, 32, 0.92); - border: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.35); + margin: 6px; + border-radius: 12px; } -.notification-banner:hover { - background-color: rgba(32, 32, 32, 0.95); -} - -.notification-banner:focus { - background-color: #202020; -} - -.notification-banner .notification-actions { +.notification-buttons-bin { spacing: 0; } -.notification-banner .notification-button { +.notification-button { min-height: 40px; padding: 0 16px; - background-color: transparent; - color: rgba(255, 255, 255, 0.7); + background-color: transparent !important; + color: rgba(255, 255, 255, 0.7) !important; font-weight: 500; - border-width: 0; - border-top: 1px solid rgba(255, 255, 255, 0.1); + border-top: 1px solid rgba(255, 255, 255, 0.1) !important; } -.notification-banner .notification-button:first-child { - border-radius: 0 0 0 5px !important; -} - -.notification-banner .notification-button:last-child { - border-radius: 0 0 5px 0 !important; -} - -.notification-banner .notification-button:only-child, .notification-banner .notification-button:first-child:last-child { - border-radius: 0 0 5px 5px !important; -} - -.notification-banner .notification-button:focus { - background-color: transparent; - color: rgba(255, 255, 255, 0.7); +.notification-button:focus { + background-color: transparent !important; + color: rgba(255, 255, 255, 0.7) !important; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.06) !important; } -.notification-banner .notification-button:hover, .notification-banner .notification-button:focus:hover { - background-color: rgba(255, 255, 255, 0.06); - color: rgba(255, 255, 255, 0.9); +.notification-button:hover { + background-color: rgba(255, 255, 255, 0.06) !important; + color: rgba(255, 255, 255, 0.9) !important; box-shadow: none !important; } -.notification-banner .notification-button:active { - background-color: rgba(255, 255, 255, 0.15); - color: rgba(255, 255, 255, 0.9); +.notification-button:active, .notification-button:checked { + background-color: rgba(255, 255, 255, 0.15) !important; + color: rgba(255, 255, 255, 0.9) !important; } -.summary-source-counter { - font-size: 1em; - font-weight: bold; - height: 1.6em; - width: 1.6em; - -shell-counter-overlap-x: 3px; - -shell-counter-overlap-y: 3px; - background-color: #3281ea; - color: rgba(255, 255, 255, 0.85); - border: 2px solid #3281ea; - box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); - border-radius: 0.9em; +.notification-button:insensitive { + background-color: transparent !important; + color: rgba(255, 255, 255, 0.3) !important; } -.chat-body { - spacing: 5px; +.notification-button:first-child:ltr { + border-radius: 0 0 0 12px; } -.chat-response { - margin: 5px; +.notification-button:last-child:ltr { + border-radius: 0 0 12px; + margin-right: 0 !important; } -.chat-log-message { - color: rgba(255, 255, 255, 0.7); +.notification-button:first-child:rtl { + border-radius: 0 0 12px; } -.chat-new-group { - padding-top: 1em; +.notification-button:last-child:rtl { + border-radius: 0 0 0 12px; + margin-left: 0 !important; } -.chat-received { - padding-left: 4px; +.notification-button:first-child:last-child { + border-radius: 0 0 12px 12px; + margin-left: 0 !important; + margin-right: 0 !important; } -.chat-received:rtl { - padding-left: 0px; - padding-right: 4px; +.popup-menu .notification-button:first-child:ltr { + border-radius: 0 0 0 5px; } -.chat-sent { - padding-left: 18pt; - color: rgba(255, 255, 255, 0.7); +.popup-menu .notification-button:last-child:ltr { + border-radius: 0 0 5px; } -.chat-sent:rtl { - padding-left: 0; - padding-right: 18pt; +.popup-menu .notification-button:first-child:rtl { + border-radius: 0 0 5px; } -.chat-meta-message { - font-weight: bold; - padding-left: 4px; - font-size: 9pt; - font-weight: 400; - color: rgba(255, 255, 255, 0.5); +.popup-menu .notification-button:last-child:rtl { + border-radius: 0 0 0 5px; } -.chat-meta-message:rtl { - padding-left: 0; - padding-right: 4px; +.popup-menu .notification-button:first-child:last-child { + border-radius: 0 0 5px 5px; } .hotplug-notification-item { @@ -1903,21 +2041,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Top Bar */ #panel .panel-button#panelActivities { - background-image: url("assets/activities.svg"); - background-position: center center; - background-repeat: no-repeat; - background-size: auto; - color: transparent !important; - font-size: 0; - box-shadow: none; + -natural-hpadding: 15px; } -#panel .panel-button#panelActivities * { - width: 36px; +#panel .panel-button#panelActivities StBoxLayout { + spacing: 6px; } #panel .panel-button#panelActivities .workspace-dot { - background-color: transparent; + border-radius: 9999px; + min-width: 8px; + min-height: 8px; + background-color: #FFFFFF; } #panel { @@ -1927,10 +2062,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; padding: 0 2px !important; - background-color: #202020; - border-radius: 12px; - margin: 3px; - height: 38px; + background-color: rgba(0, 0, 0, 0.5); + margin: 0; + border-radius: 0; + height: 34px; } #panel #panelLeft, #panel #panelCenter { @@ -1939,7 +2074,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #202020; + -panel-corner-background-color: rgba(0, 0, 0, 0.5); -panel-corner-border-width: 0; -panel-corner-border-color: transparent; -panel-corner-opacity: 0; @@ -1963,6 +2098,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; } +#panel .panel-button.clock-display { + border: 1px solid transparent !important; + box-shadow: inset 0 1px transparent !important; +} + +#panel .panel-button.clock-display:hover { + color: rgba(255, 255, 255, 0.75); + background-color: rgba(255, 255, 255, 0.1) !important; +} + +#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:checked, #panel .panel-button.clock-display:focus { + color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.15) !important; +} + #panel .panel-button.clock-display .clock { color: rgba(255, 255, 255, 0.75); transition-duration: 150ms; @@ -1970,6 +2120,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; } +#panel .panel-button.clock-display .messages-indicator { + icon-size: 1.091em; +} + #panel .panel-button:hover { color: rgba(255, 255, 255, 0.75); background-color: rgba(255, 255, 255, 0.1); @@ -2030,10 +2184,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: transparent; } -#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { - color: rgba(255, 255, 255, 0.7); -} - #panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel.lock-screen .panel-button:hover, #panel:overview .panel-button:hover { background-color: rgba(255, 255, 255, 0.15); } @@ -2047,6 +2197,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } +#panel.unlock-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:hover { + background-color: rgba(255, 255, 255, 0.15) !important; +} + +#panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:checked, #panel.unlock-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:focus { + background-color: rgba(255, 255, 255, 0.3) !important; +} + +#panel.unlock-screen .panel-button.clock-display:hover, #panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:overview, #panel.unlock-screen .panel-button.clock-display:focus, #panel.unlock-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:overview, #panel.login-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:overview, #panel.lock-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:overview, #panel:overview .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:checked { + border: 1px solid rgba(0, 0, 0, 0.12) !important; + box-shadow: inset 0 1px rgba(255, 255, 255, 0.1) !important; +} + +#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { + color: rgba(255, 255, 255, 0.7); +} + #panel.unlock-screen .panel-button#panelActivities, #panel.login-screen .panel-button#panelActivities, #panel.lock-screen .panel-button#panelActivities, #panel:overview .panel-button#panelActivities { box-shadow: none; border: none; @@ -2057,6 +2224,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.15); } +#panel.unlock-screen .panel-button#panelActivities .workspace-dot, #panel.login-screen .panel-button#panelActivities .workspace-dot, #panel.lock-screen .panel-button#panelActivities .workspace-dot, #panel:overview .panel-button#panelActivities .workspace-dot { + background-color: rgba(255, 255, 255, 0.85); +} + #panel.unlock-screen .panel-corner, #panel.login-screen .panel-corner, #panel.lock-screen .panel-corner, #panel:overview .panel-corner { -panel-corner-opacity: 0; -panel-corner-radius: 0; @@ -2069,43 +2240,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px !important; } -#panel Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_ui_panel_ActivitiesButton.panel-button { - border-radius: 12px 0 0 12px !important; -} - -#panel Gjs_AggregateMenu.panel-button, -#panel Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 0 12px 12px 0 !important; -} - -#panel:overview Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel:overview Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel:overview Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel:overview Gjs_ui_panel_ActivitiesButton.panel-button, -#panel:overview Gjs_AggregateMenu.panel-button, -#panel:overview Gjs_ui_panel_AggregateMenu.panel-button, #panel.unlock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.unlock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.unlock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.unlock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.unlock-screen Gjs_AggregateMenu.panel-button, -#panel.unlock-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.login-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.login-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.login-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.login-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.login-screen Gjs_AggregateMenu.panel-button, -#panel.login-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.lock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.lock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.lock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.lock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.lock-screen Gjs_AggregateMenu.panel-button, -#panel.lock-screen Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 5px !important; -} - #panel Gjs_ArcMenu_ApplicationsButton.panel-button, #panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, #panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, @@ -2216,18 +2350,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.15); margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .search-entry:hover { - border: 2px solid rgba(255, 255, 255, 0.15); + border: 2px solid rgba(255, 255, 255, 0.15) !important; } .search-entry:focus { color: rgba(255, 255, 255, 0.9); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #3281ea; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #3281ea !important; } .search-entry:insensitive { @@ -2254,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { caret-color: rgba(0, 0, 0, 0.75); color: rgba(0, 0, 0, 0.75); background-color: rgba(255, 255, 255, 0.75) !important; - border-color: transparent; - box-shadow: none; + border: none !important; + box-shadow: none !important; } #overview .search-entry:hover { @@ -2265,9 +2399,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #overview .search-entry:focus { color: rgba(0, 0, 0, 0.85); - border-color: transparent; background-color: rgba(255, 255, 255, 0.95) !important; - border: none; + border: none !important; selection-background-color: #3281ea; selected-color: #FFFFFF !important; } @@ -2285,17 +2418,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Search */ +#searchResults { + margin: 0 8px; +} + #searchResultsContent { - max-width: 1024px; - spacing: 8px; + max-width: 1044px; } .search-section { - spacing: 8px; + spacing: 12px; } .search-section .search-section-separator { - height: 0; + height: 8px; background-color: transparent; } @@ -2314,21 +2450,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 12px; } -.list-search-result:focus, .search-provider-icon:focus, .list-search-result:hover, .search-provider-icon:hover, .list-search-result:selected, .search-provider-icon:selected { - background-color: rgba(255, 255, 255, 0.15); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - transition-duration: 100ms; -} - -.list-search-result:active, .search-provider-icon:active, .list-search-result:checked, .search-provider-icon:checked { - background-color: rgba(255, 255, 255, 0.3); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); +.search-statustext { + color: rgba(255, 255, 255, 0.7); } .grid-search-results { spacing: 36px; + margin: 0 12px; +} + +.search-provider-icon:ltr { + margin-right: 4px; +} + +.search-provider-icon:rtl { + margin-left: 4px; } .search-provider-icon .list-search-provider-content { @@ -2337,7 +2473,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .search-provider-icon .list-search-provider-content .list-search-provider-details { width: 120px; - margin-top: 0; color: rgba(255, 255, 255, 0.7); } @@ -2359,44 +2494,102 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash */ #dash { - font-size: 1em; margin-top: 12px; - padding: 0 10px; } -#dash .placeholder { +#dash .dash-background { + background-color: rgba(255, 255, 255, 0.2); + border-radius: 20px; + padding-top: 12px; + padding-bottom: 12px; + padding-left: 10px; + padding-right: 10px; +} + +#dash .dash-item-container .placeholder { background-image: none; background-size: contain; height: 32px; } -#dash .empty-dash-drop-target { +#dash .dash-item-container .empty-dash-drop-target { width: 32px; height: 32px; } -#dash .overview-icon { - padding: 5px; - border-radius: 8px; +#dash .dash-item-container .show-apps, +#dash .dash-item-container .overview-tile, +#dash .dash-item-container .grid-search-result, +#dash .dash-item-container .search-provider-icon, +#dash .dash-item-container .list-search-result { + margin: 0 2px; + padding-bottom: 12px; } -.dash-background { - background-color: rgba(255, 255, 255, 0.2); - margin-bottom: 18px; - padding: 10px; - border-radius: 18px; +#dash .dash-item-container .show-apps .overview-icon, +#dash .dash-item-container .overview-tile .overview-icon, +#dash .dash-item-container .grid-search-result .overview-icon, +#dash .dash-item-container .search-provider-icon .overview-icon, +#dash .dash-item-container .list-search-result .overview-icon { + background-color: transparent; } -.dash-item-container .app-well-app, .show-apps { - padding: 10px 3px 28px; -} - -.dash-separator { - width: 1px; - margin: 0 8px 18px; +#dash .dash-item-container .show-apps:focus .overview-icon, +#dash .dash-item-container .overview-tile:focus .overview-icon, +#dash .dash-item-container .grid-search-result:focus .overview-icon, +#dash .dash-item-container .search-provider-icon:focus .overview-icon, +#dash .dash-item-container .list-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.15); } +#dash .dash-item-container .show-apps:hover .overview-icon, +#dash .dash-item-container .overview-tile:hover .overview-icon, +#dash .dash-item-container .grid-search-result:hover .overview-icon, +#dash .dash-item-container .search-provider-icon:hover .overview-icon, +#dash .dash-item-container .list-search-result:hover .overview-icon { + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-item-container .show-apps:active .overview-icon, +#dash .dash-item-container .overview-tile:active .overview-icon, +#dash .dash-item-container .grid-search-result:active .overview-icon, +#dash .dash-item-container .search-provider-icon:active .overview-icon, +#dash .dash-item-container .list-search-result:active .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:checked .overview-icon, +#dash .dash-item-container .overview-tile:checked .overview-icon, +#dash .dash-item-container .grid-search-result:checked .overview-icon, +#dash .dash-item-container .search-provider-icon:checked .overview-icon, +#dash .dash-item-container .list-search-result:checked .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:insensitive .overview-icon, +#dash .dash-item-container .overview-tile:insensitive .overview-icon, +#dash .dash-item-container .grid-search-result:insensitive .overview-icon, +#dash .dash-item-container .search-provider-icon:insensitive .overview-icon, +#dash .dash-item-container .list-search-result:insensitive .overview-icon { + background-color: transparent; +} + +#dash .dash-item-container .app-grid-running-dot { + margin-bottom: 21px; +} + +#dash .dash-separator { + width: 1px; + margin-left: 4px; + margin-right: 4px; + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-separator, +#dash .dash-background { + margin-bottom: 12px; +} + .dash-label { border-radius: 5px; padding: 6px 12px; @@ -2406,46 +2599,37 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; text-align: center; - -y-offset: 20px; + -y-offset: 4px; } /* App Grid */ - -.show-apps .overview-icon, -.app-well-app .overview-icon, -.grid-search-result .overview-icon, .search-provider-icon, .list-search-result { - color: rgba(255, 255, 255, 0.85); - border-radius: 10px; - padding: 6px; - border: 1px solid transparent; - box-shadow: inset 0 1px transparent; - transition-duration: 150ms; - text-align: center; -} - .icon-grid { row-spacing: 12px; column-spacing: 12px; - max-row-spacing: 72px; - max-column-spacing: 72px; + max-row-spacing: 36px; + max-column-spacing: 36px; page-padding-top: 24px; page-padding-bottom: 24px; - page-padding-left: 12px; - page-padding-right: 12px; + page-padding-left: 18px; + page-padding-right: 18px; } /* App Icons */ +.overview-tile, .grid-search-result, .search-provider-icon, .list-search-result { + border-radius: 24px; + padding: 12px; + spacing: 6px; + transition-duration: 150ms; + text-align: center; + background-color: transparent; + color: rgba(255, 255, 255, 0.85); + border: 1px solid transparent; + box-shadow: inset 0 1px transparent; +} -.show-apps:hover .overview-icon, -.show-apps:focus .overview-icon, -.show-apps:selected .overview-icon, -.app-well-app:hover .overview-icon, -.app-well-app:focus .overview-icon, -.app-well-app:selected .overview-icon, -.grid-search-result:hover .overview-icon, -.grid-search-result:focus .overview-icon, -.grid-search-result:selected .overview-icon { +.overview-tile:hover, .grid-search-result:hover, .search-provider-icon:hover, .list-search-result:hover, .overview-tile:focus, .grid-search-result:focus, .search-provider-icon:focus, .list-search-result:focus, .overview-tile:highlighted, .grid-search-result:highlighted, .search-provider-icon:highlighted, .list-search-result:highlighted, .overview-tile:selected, .grid-search-result:selected, .search-provider-icon:selected, .list-search-result:selected { background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.85); transition-duration: 0ms; border-image: none; background-image: none; @@ -2453,34 +2637,43 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps:active .overview-icon, -.show-apps:checked .overview-icon, -.app-well-app:active .overview-icon, -.app-well-app:checked .overview-icon, -.grid-search-result:active .overview-icon, -.grid-search-result:checked .overview-icon { +.overview-tile:active, .grid-search-result:active, .search-provider-icon:active, .list-search-result:active, .overview-tile:checked, .grid-search-result:checked, .search-provider-icon:checked, .list-search-result:checked { background-color: rgba(255, 255, 255, 0.15); transition-duration: 150ms; + color: rgba(255, 255, 255, 0.85); border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps .overview-icon.overview-icon-with-label, -.app-well-app .overview-icon.overview-icon-with-label, -.grid-search-result .overview-icon.overview-icon-with-label { - padding: 10px 8px 5px 8px; -} - - -.show-apps .overview-icon.overview-icon-with-label > StBoxLayout, -.app-well-app .overview-icon.overview-icon-with-label > StBoxLayout, -.grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout { +.overview-tile .overview-icon.overview-icon-with-label > StBoxLayout, .grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout, .search-provider-icon .overview-icon.overview-icon-with-label > StBoxLayout, .list-search-result .overview-icon.overview-icon-with-label > StBoxLayout { spacing: 6px; } -.app-well-app-running-dot { +.app-folder { + background-color: rgba(255, 255, 255, 0.13); +} + +.app-folder:focus { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:hover { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:active { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:highlighted, .app-folder:selected, .app-folder:checked { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:insensitive { + background-color: transparent; +} + +.app-grid-running-dot { width: 6px; height: 3px; border-radius: 2px; @@ -2488,33 +2681,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin-bottom: 1px; } -StWidget.focused .app-well-app-running-dot { +StWidget.focused .app-grid-running-dot { width: 18px; background-color: #3281ea; } -/* App Folders */ -.app-well-app.app-folder { - background: none; - border-radius: 10px; -} - -.app-well-app.app-folder .overview-icon { - background-color: rgba(255, 255, 255, 0.13); - border-radius: 10px; -} - -.app-well-app.app-folder:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.15); -} - -.app-well-app.app-folder:active .overview-icon { - background-color: rgba(255, 255, 255, 0.3); +.app-folder-dialog-container { + padding-top: 34px; } .app-folder-dialog { + width: 720px; + height: 720px; border-radius: 20px; background-color: rgba(34, 34, 34, 0.95); + color: white; border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } @@ -2562,7 +2743,9 @@ StWidget.focused .app-well-app-running-dot { color: rgba(255, 255, 255, 0.7); } -.app-folder-dialog .folder-name-container .edit-folder-button { +.app-folder-dialog .folder-name-container .icon-button, .app-folder-dialog .folder-name-container .background-app-item .close-button, .background-app-item .app-folder-dialog .folder-name-container .close-button, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button { background-color: rgba(255, 255, 255, 0.15); color: rgba(255, 255, 255, 0.7); border: none; @@ -2572,15 +2755,23 @@ StWidget.focused .app-well-app-running-dot { border-radius: 18px; } -.app-folder-dialog .folder-name-container .edit-folder-button > StIcon { +.app-folder-dialog .folder-name-container .icon-button > StIcon, .app-folder-dialog .folder-name-container .background-app-item .close-button > StIcon, .background-app-item .app-folder-dialog .folder-name-container .close-button > StIcon, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button > StIcon, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button > StIcon, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button > StIcon, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button > StIcon { icon-size: 16px; } -.app-folder-dialog .folder-name-container .edit-folder-button:hover { +.app-folder-dialog .folder-name-container .icon-button:hover, .app-folder-dialog .folder-name-container .background-app-item .close-button:hover, .background-app-item .app-folder-dialog .folder-name-container .close-button:hover, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:hover, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:hover, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:hover, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:hover { background-color: rgba(255, 255, 255, 0.15); } -.app-folder-dialog .folder-name-container .edit-folder-button:checked, .app-folder-dialog .folder-name-container .edit-folder-button:active { +.app-folder-dialog .folder-name-container .icon-button:checked, .app-folder-dialog .folder-name-container .background-app-item .close-button:checked, .background-app-item .app-folder-dialog .folder-name-container .close-button:checked, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:checked, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:checked, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:checked, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:checked, .app-folder-dialog .folder-name-container .icon-button:active, .app-folder-dialog .folder-name-container .background-app-item .close-button:active, .background-app-item .app-folder-dialog .folder-name-container .close-button:active, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:active, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:active, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:active, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:active { background-color: rgba(255, 255, 255, 0.3); } @@ -2597,12 +2788,6 @@ StWidget.focused .app-well-app-running-dot { margin-bottom: 18px; } -.app-folder-dialog-container { - padding: 12px; - width: 620px; - height: 620px; -} - .rename-folder-popup .rename-folder-popup-item { spacing: 6px; } @@ -2625,6 +2810,7 @@ StWidget.focused .app-well-app-running-dot { height: 10px; border-radius: 10px; background-color: white; + transition-duration: 400ms; } .apps-scroll-view { @@ -2638,10 +2824,6 @@ StWidget.focused .app-well-app-running-dot { icon-size: 8px; } -.page-navigation-hint { - width: 300px; -} - .page-navigation-hint.dnd { background: rgba(255, 255, 255, 0.1); } @@ -2667,6 +2849,11 @@ StWidget.focused .app-well-app-running-dot { height: 24px; border-radius: 9999px; color: rgba(255, 255, 255, 0.7); + background-color: transparent; +} + +.page-navigation-arrow > StIcon { + color: rgba(255, 255, 255, 0.85); } .page-navigation-arrow:insensitive { @@ -3123,11 +3310,15 @@ StWidget.focused .app-well-app-running-dot { padding: 16px 18px 20px !important; } -.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button { +.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .message .message-header .message-expand-button, .message .message-header .quick-settings .message-expand-button, +.quick-settings .message .message-header .message-close-button, +.message .message-header .quick-settings .message-close-button, .quick-settings .button { padding: 9px; } -.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .button > StIcon { +.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings .message-expand-button > StIcon, +.quick-settings .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings .message-close-button > StIcon, .quick-settings .button > StIcon { icon-size: 16px; } @@ -3301,18 +3492,24 @@ StWidget.focused .app-well-app-running-dot { icon-size: 16px; } -.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button { +.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button, .quick-slider .message .message-header .message-expand-button, .message .message-header .quick-slider .message-expand-button, +.quick-slider .message .message-header .message-close-button, +.message .message-header .quick-slider .message-close-button { min-width: 22px; min-height: 22px; background-color: transparent; color: rgba(255, 255, 255, 0.9) !important; } -.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover { +.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover, .quick-slider .message .message-header .message-expand-button:hover, .message .message-header .quick-slider .message-expand-button:hover, +.quick-slider .message .message-header .message-close-button:hover, +.message .message-header .quick-slider .message-close-button:hover { background-color: rgba(255, 255, 255, 0.06); } -.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active { +.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active, .quick-slider .message .message-header .message-expand-button:active, .message .message-header .quick-slider .message-expand-button:active, +.quick-slider .message .message-header .message-close-button:active, +.message .message-header .quick-slider .message-close-button:active { background-color: rgba(255, 255, 255, 0.12); } @@ -3365,7 +3562,9 @@ StWidget.focused .app-well-app-running-dot { spacing: 12px; } -.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button { +.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button, .quick-settings-system-item .message .message-header .message-expand-button, .message .message-header .quick-settings-system-item .message-expand-button, +.quick-settings-system-item .message .message-header .message-close-button, +.message .message-header .quick-settings-system-item .message-close-button { background-color: rgba(255, 255, 255, 0.06); color: rgba(255, 255, 255, 0.9); border-radius: 5px; @@ -3373,15 +3572,21 @@ StWidget.focused .app-well-app-running-dot { min-width: 22px; } -.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover { +.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover, .quick-settings-system-item .message .message-header .message-expand-button:hover, .message .message-header .quick-settings-system-item .message-expand-button:hover, +.quick-settings-system-item .message .message-header .message-close-button:hover, +.message .message-header .quick-settings-system-item .message-close-button:hover { background-color: rgba(255, 255, 255, 0.1); } -.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active { +.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active, .quick-settings-system-item .message .message-header .message-expand-button:active, .message .message-header .quick-settings-system-item .message-expand-button:active, +.quick-settings-system-item .message .message-header .message-close-button:active, +.message .message-header .quick-settings-system-item .message-close-button:active { background-color: rgba(255, 255, 255, 0.15); } -.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon { +.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon, .quick-settings-system-item .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings-system-item .message-expand-button > StIcon, +.quick-settings-system-item .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings-system-item .message-close-button > StIcon { -st-icon-style: symbolic; icon-size: 16px; } @@ -3665,15 +3870,15 @@ StWidget.focused .app-well-app-running-dot { color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.15); margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .login-dialog StEntry:focus, .unlock-dialog StEntry:focus { color: rgba(255, 255, 255, 0.9); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #3281ea; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #3281ea !important; } .login-dialog StEntry:insensitive, @@ -4142,7 +4347,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left #dash .dash-item-container .app-well-app, #dashtodockContainer.right #dash .dash-item-container .app-well-app { - padding: 3px 6px !important; + padding: 2px 6px !important; } #dashtodockContainer.left #dash .show-apps, #dashtodockContainer.right #dash .show-apps { @@ -4155,11 +4360,11 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.left.extended #dash .show-apps, #dashtodockContainer.left.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.left.straight-corner #dash .show-apps, #dashtodockContainer.right.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.right.extended #dash .show-apps, #dashtodockContainer.right.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.right.straight-corner #dash .show-apps { - padding: 3px 10px !important; + padding: 2px 12px !important; } #dashtodockContainer.top #dash .dash-background, #dashtodockContainer.bottom #dash .dash-background { - padding: 10px 5px !important; + padding: 12px 6px !important; } #dashtodockContainer.top.shrink #dash .dash-background, #dashtodockContainer.bottom.shrink #dash .dash-background { @@ -4176,7 +4381,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.top.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.top.extended #dash .show-apps, #dashtodockContainer.top.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.top.straight-corner #dash .show-apps, #dashtodockContainer.bottom.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.extended #dash .show-apps, #dashtodockContainer.bottom.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.straight-corner #dash .show-apps { - padding: 10px 3px !important; + padding: 12px 2px !important; } #dashtodockContainer #dash { @@ -4185,7 +4390,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer #dash .dash-background { - background-color: #202020; + background-color: rgba(0, 0, 0, 0.5); background-clip: padding-box; } @@ -4241,7 +4446,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.transparent #dash .dash-background { - background-color: #202020; + background-color: rgba(0, 0, 0, 0.5); } #dashtodockContainer:overview #dash .dash-background { diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/gtk-dark.css index 6e393cd..109d8d6 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/gtk-dark.css @@ -1432,7 +1432,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { border-radius: 8px 8px 0 0; color: white; box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12); - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .titlebar:disabled { @@ -1984,7 +1984,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); background-clip: border-box; border: 1px solid rgba(255, 255, 255, 0.12); } @@ -2118,7 +2118,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: border-box; } @@ -4296,7 +4296,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(48, 48, 48, 0.95); border-radius: 0 0 8px 8px; - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd.unified { @@ -4304,11 +4304,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7512,8 +7512,6 @@ frame.raven-frame > border { .raven { background-color: #3C3C3C; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8013,7 +8011,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); background-color: #3C3C3C; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/gtk.css index 6e393cd..109d8d6 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-3.0/gtk.css @@ -1432,7 +1432,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { border-radius: 8px 8px 0 0; color: white; box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12); - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .titlebar:disabled { @@ -1984,7 +1984,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); background-clip: border-box; border: 1px solid rgba(255, 255, 255, 0.12); } @@ -2118,7 +2118,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: border-box; } @@ -4296,7 +4296,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(48, 48, 48, 0.95); border-radius: 0 0 8px 8px; - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd.unified { @@ -4304,11 +4304,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7512,8 +7512,6 @@ frame.raven-frame > border { .raven { background-color: #3C3C3C; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8013,7 +8011,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); background-color: #3C3C3C; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/gtk-dark.css index e698ec6..efc633a 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/gtk-dark.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1741,7 +1741,7 @@ headerbar { min-height: 44px; margin: 0; padding: 0; - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } headerbar:disabled { @@ -1912,10 +1912,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2386,8 +2382,8 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 6px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #3C3C3C; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(60, 60, 60, 0.98); border-radius: 6px; color: white; border: 1px solid rgba(255, 255, 255, 0.12); @@ -2430,6 +2426,10 @@ popover.background toolbar { background-color: #3C3C3C; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2499,9 +2499,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 22px; min-width: 22px; padding: 3px 12px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(255, 255, 255, 0.7); @@ -2766,6 +2765,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4732,7 +4736,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4881,6 +4885,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 12px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4917,7 +4925,7 @@ weekgrid.current { } popover.events { - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); padding: 0; } @@ -5346,7 +5354,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5857,6 +5865,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5970,7 +5986,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6065,7 +6081,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6190,7 +6206,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6278,7 +6294,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 24px 6px 8 2; + margin: 24px 6px 8px 2px; border-spacing: 24px; } @@ -6819,12 +6835,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); color: white; } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6978,13 +6994,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); color: white; } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7017,6 +7033,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7171,6 +7193,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 9px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #3281EA; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 6px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #3281EA; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(255, 255, 255, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/gtk.css index e698ec6..efc633a 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/gtk-4.0/gtk.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1741,7 +1741,7 @@ headerbar { min-height: 44px; margin: 0; padding: 0; - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } headerbar:disabled { @@ -1912,10 +1912,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2386,8 +2382,8 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 6px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #3C3C3C; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(60, 60, 60, 0.98); border-radius: 6px; color: white; border: 1px solid rgba(255, 255, 255, 0.12); @@ -2430,6 +2426,10 @@ popover.background toolbar { background-color: #3C3C3C; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2499,9 +2499,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 22px; min-width: 22px; padding: 3px 12px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(255, 255, 255, 0.7); @@ -2766,6 +2765,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4732,7 +4736,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4881,6 +4885,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 12px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4917,7 +4925,7 @@ weekgrid.current { } popover.events { - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); padding: 0; } @@ -5346,7 +5354,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5857,6 +5865,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5970,7 +5986,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6065,7 +6081,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6190,7 +6206,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6278,7 +6294,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 24px 6px 8 2; + margin: 24px 6px 8px 2px; border-spacing: 24px; } @@ -6819,12 +6835,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); color: white; } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6978,13 +6994,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); color: white; } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7017,6 +7033,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7171,6 +7193,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 9px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #3281EA; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 6px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #3281EA; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(255, 255, 255, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/metacity-1/metacity-theme-3.xml b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/metacity-1/metacity-theme-3.xml index 90a08df..15c1671 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/metacity-1/metacity-theme-3.xml +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Dark/metacity-1/metacity-theme-3.xml @@ -1,11 +1,11 @@ - Melawy-round + Fluent-round vinceliucie GPL 2020 - Melawy-round Metacity theme + Fluent-round Metacity theme diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/cinnamon/cinnamon.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/cinnamon/cinnamon.css index 367dbfe..830cd6d 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/cinnamon/cinnamon.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/cinnamon/cinnamon.css @@ -10,7 +10,7 @@ stage { min-height: 24px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); background-color: rgba(0, 0, 0, 0.04); } @@ -18,36 +18,36 @@ stage { .sound-button:focus { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover:focus { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .sound-button:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .sound-button:insensitive { color: rgba(0, 0, 0, 0.38); background-color: rgba(0, 0, 0, 0.04); - border-radius: 4px; + border-radius: 2px; } .notification-button, .notification-icon-button, .menu #notification .notification-button, .menu #notification .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button, #notification .notification-button, #notification .notification-icon-button, .calendar-today-home-button, .calendar-today-home-button-enabled { - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); background-color: transparent; } @@ -56,28 +56,28 @@ stage { .calendar-today-home-button-enabled:hover { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active, .calendar-today-home-button:active, .calendar-today-home-button-enabled:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive, .calendar-today-home-button:insensitive, .calendar-today-home-button-enabled:insensitive { color: rgba(0, 0, 0, 0.26); background-color: transparent; - border-radius: 4px; + border-radius: 2px; } .modal-dialog-button-box .modal-dialog-button { min-height: 24px; padding: 4px 20px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); } @@ -108,7 +108,7 @@ stage { selection-background-color: #1A73E8; selected-color: white; transition-duration: 300ms; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.87); border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.04); @@ -271,7 +271,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 4px; + border-radius: 2px; padding: 5px 12px; background-color: rgba(54, 54, 54, 0.9); color: white; @@ -300,8 +300,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-content { padding: 4px 0; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; - border-radius: 6px; + background-color: rgba(255, 255, 255, 0.98); + border-radius: 3px; margin: 4px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } @@ -351,7 +351,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: 4px 8px; spacing: 8px; - border-radius: 4px; + border-radius: 2px; margin: 0 4px; } @@ -395,7 +395,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); @@ -525,7 +525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 1em; padding: 0px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5), 0 0 16px rgba(0, 0, 0, 0.24); - background-color: #F7F7F7; + background-color: rgba(247, 247, 247, 0.8); } .panel-top .panel-button:hover, @@ -585,7 +585,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(54, 54, 54, 0.9); color: white; spacing: 25px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -601,7 +601,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, .expo-workspaces-name-entry#selected { height: 15px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -624,13 +624,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspace-thumbnail-frame { border: 4px solid rgba(255, 255, 255, 0); background-color: rgba(255, 255, 255, 0); - border-radius: 4px; + border-radius: 2px; } .expo-workspace-thumbnail-frame#active { border: 4px solid #1A73E8; background-color: black; - border-radius: 4px; + border-radius: 2px; } .expo-background { @@ -730,7 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; background-color: #FFFFFF; padding: 4px; padding-right: 0; @@ -845,7 +845,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { text-align: center; font-size: 14px; color: rgba(0, 0, 0, 0.87); - border-radius: 4px; + border-radius: 2px; } .calendar-day-base { @@ -930,7 +930,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; min-width: 350px; border: none; - border-radius: 4px; + border-radius: 2px; background-gradient-direction: vertical; background-gradient-start: rgba(0, 0, 0, 0.04); background-gradient-end: rgba(0, 0, 0, 0.04); @@ -940,7 +940,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-events-no-events-button { margin: 4px 0; padding: 4px; - border-radius: 4px; + border-radius: 2px; } .calendar-events-no-events-button:hover { @@ -983,7 +983,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-event-button { margin: 4px 0 4px 0; - border-radius: 4px; + border-radius: 2px; } .calendar-event-button:hover { @@ -1050,14 +1050,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 8px; + border-radius: 3px; padding: 8px; spacing-rows: 6px; spacing-columns: 6px; margin-from-right-edge-of-screen: 12px; width: 28em; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); margin: 7px 12px 17px 12px; } @@ -1068,7 +1068,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu #notification, .popup-menu #notification { border: none; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.05); box-shadow: none; margin: 0; @@ -1136,9 +1136,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); border: none; - border-radius: 4px; + border-radius: 2px; padding: 20px; } @@ -1152,7 +1152,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 4px; + border-radius: 2px; } .switcher-list .item-box:outlined { @@ -1226,7 +1226,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(46, 46, 46, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 4px; + border-radius: 2px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1251,7 +1251,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 4px 8px; background-color: rgba(54, 54, 54, 0.9); - border-radius: 4px; + border-radius: 2px; color: white; } @@ -1283,7 +1283,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 2px 8px; - border-radius: 4px; + border-radius: 2px; caret-color: white; selected-color: white; selection-background-color: #1A73E8; @@ -1412,7 +1412,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 4px; + border-radius: 2px; box-shadow: none; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); @@ -1436,7 +1436,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: white; padding: 5px; - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(54, 54, 54, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1452,17 +1452,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { transition-duration: 300; background-color: rgba(0, 0, 0, 0.05); border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button { padding: 6px; border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button:hover { - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.1); } @@ -1486,7 +1486,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 4px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1498,7 +1498,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); padding: 4px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1516,7 +1516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu StScrollView.menu-application-button { padding: 2px 0; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.6); } @@ -1525,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; spacing: 0; margin: 0 2px; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); } @@ -1557,7 +1557,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 4px; - border-radius: 4px; + border-radius: 2px; } .menu-category-button-selected { @@ -1567,7 +1567,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button-hover, .menu-category-button-selected { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .menu-category-button-greyed { @@ -1647,12 +1647,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 4px; + border-radius: 2px; color: #1A73E8; } .osd-window .level-bar { - border-radius: 4px; + border-radius: 2px; background-color: #1A73E8; } @@ -1800,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0F9D58; background-gradient-end: #0F9D58; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -1814,7 +1814,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 4px; border: none; background-color: #FFFFFF; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.87); box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1830,15 +1830,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu { padding: 4px; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; - border-radius: 6px; + background-color: rgba(255, 255, 255, 0.98); + border-radius: 3px; margin: 4px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } .grouped-window-list-thumbnail-menu .item-box { padding: 4px; - border-radius: 4px; + border-radius: 2px; spacing: 4px; margin: 1px; } @@ -1923,7 +1923,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0F9D58; background-gradient-end: #0F9D58; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -2004,7 +2004,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 0; margin-top: 6px; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } @@ -2043,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 4px; background-color: rgba(0, 0, 0, 0.5); border: none; - border-radius: 0 0 4px 4px; + border-radius: 0 0 2px 2px; color: white; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gnome-shell/assets/menu.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gnome-shell/assets/menu.svg index 12f85d3..fa3dc0b 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gnome-shell/assets/menu.svg +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gnome-shell/assets/menu.svg @@ -73,7 +73,7 @@ d="M 14 3 C 9.0140007 3 5 7.0140007 5 12 L 5 100 C 5 104.986 9.0140007 109 14 109 L 102 109 C 106.986 109 111 104.986 111 100 L 111 12 C 111 7.0140007 106.986 3 102 3 L 14 3 z M 14 4 L 102 4 C 106.432 4 110 7.5680012 110 12 L 110 100 C 110 104.432 106.432 108 102 108 L 14 108 C 9.5680012 108 6 104.432 6 100 L 6 12 C 6 7.5680012 9.5680012 4 14 4 z " transform="scale(0.26458333)" /> StIcon { - icon-size: 48px; + icon-size: 96px; margin-bottom: 6px; -st-icon-style: symbolic; } .message-list-sections { - spacing: 4px; - margin: 0; - padding-bottom: 4px; + spacing: 8px; } .message-list-sections:ltr { @@ -1045,13 +1168,24 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section, .message-list-section-list { - spacing: 4px; + spacing: 8px; } .message-list-controls { - margin: 4px 8px 0; - padding: 2px; - spacing: 8px; + padding: 8px; + padding-bottom: 4px; + spacing: 4px; +} + +.message-list-controls .dnd-button { + border-width: 2px; + border-color: transparent; + border-radius: 32px; + border-style: solid; +} + +.message-list-controls .dnd-button:focus { + border-color: rgba(26, 115, 232, 0.6); } .message { @@ -1059,97 +1193,152 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 5px; color: rgba(0, 0, 0, 0.54); text-shadow: none; + padding: 0; + margin: 2px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.15); - border: 1px solid rgba(0, 0, 0, 0.12); + background-color: rgba(255, 255, 255, 0.95); + border: 1px solid transparent; +} + +.message:hover, .message:focus, .message:active { + background-color: #ffffff; } .popup-menu .message { - box-shadow: none; margin: 0 0 2px; + box-shadow: none; + background-color: rgba(255, 255, 255, 0.35); + border-radius: 5px; + color: rgba(0, 0, 0, 0.54); + border: 1px solid rgba(0, 0, 0, 0.12); } -.message:hover, .message:focus { +.popup-menu .message:hover, .popup-menu .message:focus { background-color: rgba(0, 0, 0, 0.06); border-color: rgba(0, 0, 0, 0.15); } -.message:active { +.popup-menu .message:active { background-color: rgba(0, 0, 0, 0.08); } -.message .message-icon-bin { - padding: 12px; - padding-right: 4px; +.message:ltr { + padding-right: -2px; } -.message .message-icon-bin:rtl { - padding-left: 4px; +.message:rtl { + padding-left: -2px; } -.message .message-icon-bin > StIcon { - icon-size: 40px; +.message .message-header { + padding: 0 0.409em; + margin: 4px; + margin-bottom: 0; + spacing: 4px; + color: rgba(0, 0, 0, 0.38); +} + +.message .message-header .message-source-icon { + icon-size: 1.091em; -st-icon-style: symbolic; } -.message .message-icon-bin > .fallback-app-icon { - width: 32px; - height: 32px; +.message .message-header .message-header-content { + spacing: 4px; + min-height: 1.637em; + padding-bottom: 4px; } -.message .message-content { - padding: 8px; - spacing: 2px; - margin-bottom: 4px; - color: rgba(0, 0, 0, 0.54); -} - -.message .message-title { +.message .message-header .message-header-content .message-source-title { font-weight: bold; - padding-top: 0.57em; } -.message .message-secondary-bin { - padding: 0 4px; +.message .message-header .message-header-content .event-time { + color: rgba(0, 0, 0, 0.38); + padding-bottom: 0.068em; } -.message .message-secondary-bin > .event-time { - color: rgba(0, 0, 0, 0.54); - font-size: 0.9em; - padding-bottom: 0.13em; -} - -.message .message-secondary-bin > .event-time:ltr { +.message .message-header .message-header-content .event-time:ltr { text-align: right; } -.message .message-secondary-bin > .event-time:rtl { +.message .message-header .message-header-content .event-time:rtl { text-align: left; } -.message .message-close-button { - color: rgba(0, 0, 0, 0.54); - padding: 1px; - height: 24px; - width: 24px; - border-radius: 9999px; +.message .message-header .message-expand-button, +.message .message-header .message-close-button { + color: rgba(0, 0, 0, 0.87); + background-color: rgba(0, 0, 0, 0); + padding: 4px; } -.message .message-close-button:hover, .message .message-close-button:focus { - color: rgba(0, 0, 0, 0.87); +.message .message-header .message-expand-button:hover, +.message .message-header .message-close-button:hover { background-color: rgba(0, 0, 0, 0.06); } -.message .message-close-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); +.message .message-header .message-expand-button:active, .message .message-header .message-expand-button:active:hover, +.message .message-header .message-close-button:active, +.message .message-header .message-close-button:active:hover { + background-color: rgba(0, 0, 0, 0.11); } -.message .message-close-button:insensitive { - color: rgba(0, 0, 0, 0.26); +.message .message-header .message-expand-button:insensitive, +.message .message-header .message-close-button:insensitive { + background-color: rgba(0, 0, 0, 0); } -.message .message-body { - color: rgba(0, 0, 0, 0.38); +.message .message-header .message-expand-button { + padding: 6px; +} + +.message .message-header .message-expand-button:ltr { + margin-right: 4px; +} + +.message .message-header .message-expand-button:rtl { + margin-left: 4px; +} + +.message .message-box { + padding: 4px; + margin: 4px; + margin-top: 0; + spacing: 4px; +} + +.message .message-box .message-icon { + icon-size: 48px; + -st-icon-style: symbolic; +} + +.message .message-box .message-icon:ltr { + margin-right: 4px; +} + +.message .message-box .message-icon:rtl { + margin-left: 4px; +} + +.message .message-box .message-icon.message-themed-icon { + border-radius: 9999px; + background-color: rgba(0, 0, 0, 0.07); + icon-size: 16px; + min-width: 48px; + min-height: 48px; +} + +.message .message-box:first-child { + margin-top: 8px; +} + +.message .message-box .message-content { + spacing: 2px; +} + +.message .message-box .message-content .message-title { + font-weight: bold; } .url-highlighter { @@ -1158,10 +1347,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Media Controls */ .message-media-control { - margin: 20px 4px; - padding: 8px; + margin: 4px 0; + padding: 0 8px; border-radius: 9999px; color: rgba(0, 0, 0, 0.54); + border: none; } .message-media-control:hover, .message-media-control:focus { @@ -1178,33 +1368,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.26); } -.message-media-control:last-child:ltr { - margin-right: 16px; - padding-right: 8px; +.message-media-control StIcon { + icon-size: 16px; } -.message-media-control:last-child:rtl { - margin-left: 16px; - padding-left: 8px; +.media-message .message-icon { + border-radius: 5px !important; } -.media-message-cover-icon { - icon-size: 48px !important; - border-radius: 5px; - border: none; -} - -.media-message-cover-icon.fallback { - color: rgba(0, 0, 0, 0.38); - background-color: rgba(0, 0, 0, 0.06); - border: none; - border-radius: 5px; +.media-message .message-icon.message-themed-icon { icon-size: 32px !important; - padding: 8px; } .candidate-popup-content { - background-color: #ffffff; + background-color: rgba(255, 255, 255, 0.95); border-radius: 8px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.25) !important; margin: 2px 8px 11px; @@ -1277,126 +1454,87 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { min-height: 64px; width: 34em; - font-size: 1em; - margin: 6px 8px 12px; - border-radius: 5px; - color: rgba(0, 0, 0, 0.87); - background-color: rgba(255, 255, 255, 0.92); - border: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.35); + margin: 4px; + border-radius: 12px; } -.notification-banner:hover { - background-color: rgba(255, 255, 255, 0.95); -} - -.notification-banner:focus { - background-color: #ffffff; -} - -.notification-banner .notification-actions { +.notification-buttons-bin { spacing: 0; } -.notification-banner .notification-button { +.notification-button { min-height: 40px; padding: 0 16px; - background-color: transparent; - color: rgba(0, 0, 0, 0.54); + background-color: transparent !important; + color: rgba(0, 0, 0, 0.54) !important; font-weight: 500; - border-width: 0; - border-top: 1px solid rgba(0, 0, 0, 0.12); + border-top: 1px solid rgba(0, 0, 0, 0.12) !important; } -.notification-banner .notification-button:first-child { - border-radius: 0 0 0 5px !important; -} - -.notification-banner .notification-button:last-child { - border-radius: 0 0 5px 0 !important; -} - -.notification-banner .notification-button:only-child, .notification-banner .notification-button:first-child:last-child { - border-radius: 0 0 5px 5px !important; -} - -.notification-banner .notification-button:focus { - background-color: transparent; - color: rgba(0, 0, 0, 0.54); +.notification-button:focus { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.54) !important; box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.06) !important; } -.notification-banner .notification-button:hover, .notification-banner .notification-button:focus:hover { - background-color: rgba(0, 0, 0, 0.06); - color: rgba(0, 0, 0, 0.87); +.notification-button:hover { + background-color: rgba(0, 0, 0, 0.06) !important; + color: rgba(0, 0, 0, 0.87) !important; box-shadow: none !important; } -.notification-banner .notification-button:active { - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); +.notification-button:active, .notification-button:checked { + background-color: rgba(0, 0, 0, 0.2) !important; + color: rgba(0, 0, 0, 0.87) !important; } -.summary-source-counter { - font-size: 1em; - font-weight: bold; - height: 1.6em; - width: 1.6em; - -shell-counter-overlap-x: 3px; - -shell-counter-overlap-y: 3px; - background-color: #1A73E8; - color: rgba(255, 255, 255, 0.85); - border: 2px solid #1A73E8; - box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); - border-radius: 0.9em; +.notification-button:insensitive { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.26) !important; } -.chat-body { - spacing: 5px; +.notification-button:first-child:ltr { + border-radius: 0 0 0 12px; } -.chat-response { - margin: 5px; +.notification-button:last-child:ltr { + border-radius: 0 0 12px; + margin-right: 0 !important; } -.chat-log-message { - color: rgba(0, 0, 0, 0.54); +.notification-button:first-child:rtl { + border-radius: 0 0 12px; } -.chat-new-group { - padding-top: 1em; +.notification-button:last-child:rtl { + border-radius: 0 0 0 12px; + margin-left: 0 !important; } -.chat-received { - padding-left: 4px; +.notification-button:first-child:last-child { + border-radius: 0 0 12px 12px; + margin-left: 0 !important; + margin-right: 0 !important; } -.chat-received:rtl { - padding-left: 0px; - padding-right: 4px; +.popup-menu .notification-button:first-child:ltr { + border-radius: 0 0 0 5px; } -.chat-sent { - padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); +.popup-menu .notification-button:last-child:ltr { + border-radius: 0 0 5px; } -.chat-sent:rtl { - padding-left: 0; - padding-right: 18pt; +.popup-menu .notification-button:first-child:rtl { + border-radius: 0 0 5px; } -.chat-meta-message { - font-weight: bold; - padding-left: 4px; - font-size: 9pt; - font-weight: 400; - color: rgba(0, 0, 0, 0.38); +.popup-menu .notification-button:last-child:rtl { + border-radius: 0 0 0 5px; } -.chat-meta-message:rtl { - padding-left: 0; - padding-right: 4px; +.popup-menu .notification-button:first-child:last-child { + border-radius: 0 0 5px 5px; } .hotplug-notification-item { @@ -1903,21 +2041,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Top Bar */ #panel .panel-button#panelActivities { - background-image: url("assets/activities.svg"); - background-position: center center; - background-repeat: no-repeat; - background-size: auto; - color: transparent !important; - font-size: 0; - box-shadow: none; + -natural-hpadding: 10px; } -#panel .panel-button#panelActivities * { - width: 32px; +#panel .panel-button#panelActivities StBoxLayout { + spacing: 4px; } #panel .panel-button#panelActivities .workspace-dot { - background-color: transparent; + border-radius: 9999px; + min-width: 8px; + min-height: 8px; + background-color: rgba(0, 0, 0, 0.88); } #panel { @@ -1927,10 +2062,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; padding: 0 2px !important; - background-color: #f3f3f3; - border-radius: 12px; - margin: 2px; - height: 34px; + background-color: rgba(255, 255, 255, 0.75); + margin: 0; + border-radius: 0; + height: 30px; } #panel #panelLeft, #panel #panelCenter { @@ -1939,7 +2074,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #f3f3f3; + -panel-corner-background-color: rgba(255, 255, 255, 0.75); -panel-corner-border-width: 0; -panel-corner-border-color: transparent; -panel-corner-opacity: 0; @@ -1963,6 +2098,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; } +#panel .panel-button.clock-display { + border: 1px solid transparent !important; + box-shadow: inset 0 1px transparent !important; +} + +#panel .panel-button.clock-display:hover { + color: rgba(0, 0, 0, 0.75); + background-color: rgba(255, 255, 255, 0.35) !important; +} + +#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:checked, #panel .panel-button.clock-display:focus { + color: rgba(0, 0, 0, 0.88); + background-color: rgba(255, 255, 255, 0.5) !important; +} + #panel .panel-button.clock-display .clock { color: rgba(0, 0, 0, 0.75); transition-duration: 150ms; @@ -1970,6 +2120,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; } +#panel .panel-button.clock-display .messages-indicator { + icon-size: 1.091em; +} + #panel .panel-button:hover { color: rgba(0, 0, 0, 0.75); background-color: rgba(255, 255, 255, 0.35); @@ -2030,10 +2184,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: transparent; } -#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { - color: rgba(255, 255, 255, 0.7); -} - #panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel.lock-screen .panel-button:hover, #panel:overview .panel-button:hover { background-color: rgba(255, 255, 255, 0.15); } @@ -2047,17 +2197,37 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } +#panel.unlock-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:hover { + background-color: rgba(255, 255, 255, 0.15) !important; +} + +#panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:checked, #panel.unlock-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:focus { + background-color: rgba(255, 255, 255, 0.3) !important; +} + +#panel.unlock-screen .panel-button.clock-display:hover, #panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:overview, #panel.unlock-screen .panel-button.clock-display:focus, #panel.unlock-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:overview, #panel.login-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:overview, #panel.lock-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:overview, #panel:overview .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:checked { + border: 1px solid rgba(0, 0, 0, 0.12) !important; + box-shadow: inset 0 1px rgba(255, 255, 255, 0.1) !important; +} + +#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { + color: rgba(255, 255, 255, 0.7); +} + #panel.unlock-screen .panel-button#panelActivities, #panel.login-screen .panel-button#panelActivities, #panel.lock-screen .panel-button#panelActivities, #panel:overview .panel-button#panelActivities { box-shadow: none; border: none; background-color: transparent; - background-image: url("assets/activities-white.svg") !important; } #panel.unlock-screen .panel-button#panelActivities:hover, #panel.login-screen .panel-button#panelActivities:hover, #panel.lock-screen .panel-button#panelActivities:hover, #panel:overview .panel-button#panelActivities:hover { background-color: rgba(255, 255, 255, 0.15); } +#panel.unlock-screen .panel-button#panelActivities .workspace-dot, #panel.login-screen .panel-button#panelActivities .workspace-dot, #panel.lock-screen .panel-button#panelActivities .workspace-dot, #panel:overview .panel-button#panelActivities .workspace-dot { + background-color: rgba(255, 255, 255, 0.85); +} + #panel.unlock-screen .panel-corner, #panel.login-screen .panel-corner, #panel.lock-screen .panel-corner, #panel:overview .panel-corner { -panel-corner-opacity: 0; -panel-corner-radius: 0; @@ -2070,43 +2240,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 4px !important; } -#panel Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_ui_panel_ActivitiesButton.panel-button { - border-radius: 12px 0 0 12px !important; -} - -#panel Gjs_AggregateMenu.panel-button, -#panel Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 0 12px 12px 0 !important; -} - -#panel:overview Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel:overview Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel:overview Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel:overview Gjs_ui_panel_ActivitiesButton.panel-button, -#panel:overview Gjs_AggregateMenu.panel-button, -#panel:overview Gjs_ui_panel_AggregateMenu.panel-button, #panel.unlock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.unlock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.unlock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.unlock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.unlock-screen Gjs_AggregateMenu.panel-button, -#panel.unlock-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.login-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.login-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.login-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.login-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.login-screen Gjs_AggregateMenu.panel-button, -#panel.login-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.lock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.lock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.lock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.lock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.lock-screen Gjs_AggregateMenu.panel-button, -#panel.lock-screen Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 5px !important; -} - #panel Gjs_ArcMenu_ApplicationsButton.panel-button, #panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, #panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, @@ -2217,18 +2350,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.54); background-color: #ffffff; margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .search-entry:hover { - border: 2px solid rgba(0, 0, 0, 0.2); + border: 2px solid rgba(0, 0, 0, 0.2) !important; } .search-entry:focus { color: rgba(0, 0, 0, 0.87); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #1A73E8; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #1A73E8 !important; } .search-entry:insensitive { @@ -2255,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { caret-color: rgba(0, 0, 0, 0.75); color: rgba(0, 0, 0, 0.75); background-color: rgba(255, 255, 255, 0.75) !important; - border-color: transparent; - box-shadow: none; + border: none !important; + box-shadow: none !important; } #overview .search-entry:hover { @@ -2266,9 +2399,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #overview .search-entry:focus { color: rgba(0, 0, 0, 0.85); - border-color: transparent; background-color: rgba(255, 255, 255, 0.95) !important; - border: none; + border: none !important; selection-background-color: #1A73E8; selected-color: #FFFFFF !important; } @@ -2286,17 +2418,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Search */ +#searchResults { + margin: 0 4px; +} + #searchResultsContent { - max-width: 1024px; - spacing: 4px; + max-width: 1044px; } .search-section { - spacing: 4px; + spacing: 8px; } .search-section .search-section-separator { - height: 0; + height: 4px; background-color: transparent; } @@ -2315,21 +2450,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 12px; } -.list-search-result:focus, .search-provider-icon:focus, .list-search-result:hover, .search-provider-icon:hover, .list-search-result:selected, .search-provider-icon:selected { - background-color: rgba(255, 255, 255, 0.15); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - transition-duration: 100ms; -} - -.list-search-result:active, .search-provider-icon:active, .list-search-result:checked, .search-provider-icon:checked { - background-color: rgba(255, 255, 255, 0.3); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); +.search-statustext { + color: rgba(255, 255, 255, 0.7); } .grid-search-results { spacing: 24px; + margin: 0 6px; +} + +.search-provider-icon:ltr { + margin-right: 2px; +} + +.search-provider-icon:rtl { + margin-left: 2px; } .search-provider-icon .list-search-provider-content { @@ -2338,7 +2473,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .search-provider-icon .list-search-provider-content .list-search-provider-details { width: 120px; - margin-top: 0; color: rgba(255, 255, 255, 0.7); } @@ -2360,44 +2494,102 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash */ #dash { - font-size: 1em; - margin-top: 12px; - padding: 0 10px; + margin-top: 6px; } -#dash .placeholder { +#dash .dash-background { + background-color: rgba(255, 255, 255, 0.2); + border-radius: 16px; + padding-top: 8px; + padding-bottom: 8px; + padding-left: 7px; + padding-right: 7px; +} + +#dash .dash-item-container .placeholder { background-image: none; background-size: contain; height: 32px; } -#dash .empty-dash-drop-target { +#dash .dash-item-container .empty-dash-drop-target { width: 32px; height: 32px; } -#dash .overview-icon { - padding: 5px; - border-radius: 8px; +#dash .dash-item-container .show-apps, +#dash .dash-item-container .overview-tile, +#dash .dash-item-container .grid-search-result, +#dash .dash-item-container .search-provider-icon, +#dash .dash-item-container .list-search-result { + margin: 0 1px; + padding-bottom: 6px; } -.dash-background { - background-color: rgba(255, 255, 255, 0.2); - margin-bottom: 18px; - padding: 10px; - border-radius: 18px; +#dash .dash-item-container .show-apps .overview-icon, +#dash .dash-item-container .overview-tile .overview-icon, +#dash .dash-item-container .grid-search-result .overview-icon, +#dash .dash-item-container .search-provider-icon .overview-icon, +#dash .dash-item-container .list-search-result .overview-icon { + background-color: transparent; } -.dash-item-container .app-well-app, .show-apps { - padding: 10px 3px 28px; -} - -.dash-separator { - width: 1px; - margin: 0 8px 18px; +#dash .dash-item-container .show-apps:focus .overview-icon, +#dash .dash-item-container .overview-tile:focus .overview-icon, +#dash .dash-item-container .grid-search-result:focus .overview-icon, +#dash .dash-item-container .search-provider-icon:focus .overview-icon, +#dash .dash-item-container .list-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.15); } +#dash .dash-item-container .show-apps:hover .overview-icon, +#dash .dash-item-container .overview-tile:hover .overview-icon, +#dash .dash-item-container .grid-search-result:hover .overview-icon, +#dash .dash-item-container .search-provider-icon:hover .overview-icon, +#dash .dash-item-container .list-search-result:hover .overview-icon { + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-item-container .show-apps:active .overview-icon, +#dash .dash-item-container .overview-tile:active .overview-icon, +#dash .dash-item-container .grid-search-result:active .overview-icon, +#dash .dash-item-container .search-provider-icon:active .overview-icon, +#dash .dash-item-container .list-search-result:active .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:checked .overview-icon, +#dash .dash-item-container .overview-tile:checked .overview-icon, +#dash .dash-item-container .grid-search-result:checked .overview-icon, +#dash .dash-item-container .search-provider-icon:checked .overview-icon, +#dash .dash-item-container .list-search-result:checked .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:insensitive .overview-icon, +#dash .dash-item-container .overview-tile:insensitive .overview-icon, +#dash .dash-item-container .grid-search-result:insensitive .overview-icon, +#dash .dash-item-container .search-provider-icon:insensitive .overview-icon, +#dash .dash-item-container .list-search-result:insensitive .overview-icon { + background-color: transparent; +} + +#dash .dash-item-container .app-grid-running-dot { + margin-bottom: 11px; +} + +#dash .dash-separator { + width: 1px; + margin-left: 2px; + margin-right: 2px; + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-separator, +#dash .dash-background { + margin-bottom: 6px; +} + .dash-label { border-radius: 5px; padding: 4px 8px; @@ -2407,46 +2599,37 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; text-align: center; - -y-offset: 10px; + -y-offset: 2px; } /* App Grid */ - -.show-apps .overview-icon, -.app-well-app .overview-icon, -.grid-search-result .overview-icon, .search-provider-icon, .list-search-result { - color: rgba(255, 255, 255, 0.85); - border-radius: 10px; - padding: 6px; - border: 1px solid transparent; - box-shadow: inset 0 1px transparent; - transition-duration: 150ms; - text-align: center; -} - .icon-grid { row-spacing: 12px; column-spacing: 12px; - max-row-spacing: 72px; - max-column-spacing: 72px; + max-row-spacing: 36px; + max-column-spacing: 36px; page-padding-top: 24px; page-padding-bottom: 24px; - page-padding-left: 12px; - page-padding-right: 12px; + page-padding-left: 18px; + page-padding-right: 18px; } /* App Icons */ +.overview-tile, .grid-search-result, .search-provider-icon, .list-search-result { + border-radius: 24px; + padding: 12px; + spacing: 6px; + transition-duration: 150ms; + text-align: center; + background-color: transparent; + color: rgba(255, 255, 255, 0.85); + border: 1px solid transparent; + box-shadow: inset 0 1px transparent; +} -.show-apps:hover .overview-icon, -.show-apps:focus .overview-icon, -.show-apps:selected .overview-icon, -.app-well-app:hover .overview-icon, -.app-well-app:focus .overview-icon, -.app-well-app:selected .overview-icon, -.grid-search-result:hover .overview-icon, -.grid-search-result:focus .overview-icon, -.grid-search-result:selected .overview-icon { +.overview-tile:hover, .grid-search-result:hover, .search-provider-icon:hover, .list-search-result:hover, .overview-tile:focus, .grid-search-result:focus, .search-provider-icon:focus, .list-search-result:focus, .overview-tile:highlighted, .grid-search-result:highlighted, .search-provider-icon:highlighted, .list-search-result:highlighted, .overview-tile:selected, .grid-search-result:selected, .search-provider-icon:selected, .list-search-result:selected { background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.85); transition-duration: 0ms; border-image: none; background-image: none; @@ -2454,34 +2637,43 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps:active .overview-icon, -.show-apps:checked .overview-icon, -.app-well-app:active .overview-icon, -.app-well-app:checked .overview-icon, -.grid-search-result:active .overview-icon, -.grid-search-result:checked .overview-icon { +.overview-tile:active, .grid-search-result:active, .search-provider-icon:active, .list-search-result:active, .overview-tile:checked, .grid-search-result:checked, .search-provider-icon:checked, .list-search-result:checked { background-color: rgba(255, 255, 255, 0.15); transition-duration: 150ms; + color: rgba(255, 255, 255, 0.85); border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps .overview-icon.overview-icon-with-label, -.app-well-app .overview-icon.overview-icon-with-label, -.grid-search-result .overview-icon.overview-icon-with-label { - padding: 10px 8px 5px 8px; -} - - -.show-apps .overview-icon.overview-icon-with-label > StBoxLayout, -.app-well-app .overview-icon.overview-icon-with-label > StBoxLayout, -.grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout { +.overview-tile .overview-icon.overview-icon-with-label > StBoxLayout, .grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout, .search-provider-icon .overview-icon.overview-icon-with-label > StBoxLayout, .list-search-result .overview-icon.overview-icon-with-label > StBoxLayout { spacing: 4px; } -.app-well-app-running-dot { +.app-folder { + background-color: rgba(255, 255, 255, 0.13); +} + +.app-folder:focus { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:hover { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:active { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:highlighted, .app-folder:selected, .app-folder:checked { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:insensitive { + background-color: transparent; +} + +.app-grid-running-dot { width: 6px; height: 3px; border-radius: 2px; @@ -2489,33 +2681,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin-bottom: 1px; } -StWidget.focused .app-well-app-running-dot { +StWidget.focused .app-grid-running-dot { width: 18px; background-color: #1A73E8; } -/* App Folders */ -.app-well-app.app-folder { - background: none; - border-radius: 10px; -} - -.app-well-app.app-folder .overview-icon { - background-color: rgba(255, 255, 255, 0.13); - border-radius: 10px; -} - -.app-well-app.app-folder:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.15); -} - -.app-well-app.app-folder:active .overview-icon { - background-color: rgba(255, 255, 255, 0.3); +.app-folder-dialog-container { + padding-top: 30px; } .app-folder-dialog { + width: 720px; + height: 720px; border-radius: 20px; background-color: rgba(34, 34, 34, 0.95); + color: white; border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } @@ -2563,7 +2743,9 @@ StWidget.focused .app-well-app-running-dot { color: rgba(255, 255, 255, 0.7); } -.app-folder-dialog .folder-name-container .edit-folder-button { +.app-folder-dialog .folder-name-container .icon-button, .app-folder-dialog .folder-name-container .background-app-item .close-button, .background-app-item .app-folder-dialog .folder-name-container .close-button, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button { background-color: rgba(255, 255, 255, 0.15); color: rgba(255, 255, 255, 0.7); border: none; @@ -2573,15 +2755,23 @@ StWidget.focused .app-well-app-running-dot { border-radius: 18px; } -.app-folder-dialog .folder-name-container .edit-folder-button > StIcon { +.app-folder-dialog .folder-name-container .icon-button > StIcon, .app-folder-dialog .folder-name-container .background-app-item .close-button > StIcon, .background-app-item .app-folder-dialog .folder-name-container .close-button > StIcon, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button > StIcon, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button > StIcon, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button > StIcon, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button > StIcon { icon-size: 16px; } -.app-folder-dialog .folder-name-container .edit-folder-button:hover { +.app-folder-dialog .folder-name-container .icon-button:hover, .app-folder-dialog .folder-name-container .background-app-item .close-button:hover, .background-app-item .app-folder-dialog .folder-name-container .close-button:hover, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:hover, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:hover, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:hover, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:hover { background-color: rgba(255, 255, 255, 0.15); } -.app-folder-dialog .folder-name-container .edit-folder-button:checked, .app-folder-dialog .folder-name-container .edit-folder-button:active { +.app-folder-dialog .folder-name-container .icon-button:checked, .app-folder-dialog .folder-name-container .background-app-item .close-button:checked, .background-app-item .app-folder-dialog .folder-name-container .close-button:checked, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:checked, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:checked, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:checked, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:checked, .app-folder-dialog .folder-name-container .icon-button:active, .app-folder-dialog .folder-name-container .background-app-item .close-button:active, .background-app-item .app-folder-dialog .folder-name-container .close-button:active, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:active, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:active, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:active, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:active { background-color: rgba(255, 255, 255, 0.3); } @@ -2598,12 +2788,6 @@ StWidget.focused .app-well-app-running-dot { margin-bottom: 18px; } -.app-folder-dialog-container { - padding: 12px; - width: 620px; - height: 620px; -} - .rename-folder-popup .rename-folder-popup-item { spacing: 4px; } @@ -2626,6 +2810,7 @@ StWidget.focused .app-well-app-running-dot { height: 10px; border-radius: 10px; background-color: white; + transition-duration: 400ms; } .apps-scroll-view { @@ -2639,10 +2824,6 @@ StWidget.focused .app-well-app-running-dot { icon-size: 8px; } -.page-navigation-hint { - width: 300px; -} - .page-navigation-hint.dnd { background: rgba(255, 255, 255, 0.1); } @@ -2668,6 +2849,11 @@ StWidget.focused .app-well-app-running-dot { height: 24px; border-radius: 9999px; color: rgba(255, 255, 255, 0.7); + background-color: transparent; +} + +.page-navigation-arrow > StIcon { + color: rgba(255, 255, 255, 0.85); } .page-navigation-arrow:insensitive { @@ -3124,11 +3310,15 @@ StWidget.focused .app-well-app-running-dot { padding: 12px 14px 16px !important; } -.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button { +.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .message .message-header .message-expand-button, .message .message-header .quick-settings .message-expand-button, +.quick-settings .message .message-header .message-close-button, +.message .message-header .quick-settings .message-close-button, .quick-settings .button { padding: 6px; } -.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .button > StIcon { +.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings .message-expand-button > StIcon, +.quick-settings .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings .message-close-button > StIcon, .quick-settings .button > StIcon { icon-size: 16px; } @@ -3302,18 +3492,24 @@ StWidget.focused .app-well-app-running-dot { icon-size: 16px; } -.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button { +.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button, .quick-slider .message .message-header .message-expand-button, .message .message-header .quick-slider .message-expand-button, +.quick-slider .message .message-header .message-close-button, +.message .message-header .quick-slider .message-close-button { min-width: 22px; min-height: 22px; background-color: transparent; color: rgba(0, 0, 0, 0.87) !important; } -.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover { +.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover, .quick-slider .message .message-header .message-expand-button:hover, .message .message-header .quick-slider .message-expand-button:hover, +.quick-slider .message .message-header .message-close-button:hover, +.message .message-header .quick-slider .message-close-button:hover { background-color: rgba(0, 0, 0, 0.06); } -.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active { +.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active, .quick-slider .message .message-header .message-expand-button:active, .message .message-header .quick-slider .message-expand-button:active, +.quick-slider .message .message-header .message-close-button:active, +.message .message-header .quick-slider .message-close-button:active { background-color: rgba(0, 0, 0, 0.12); } @@ -3366,7 +3562,9 @@ StWidget.focused .app-well-app-running-dot { spacing: 8px; } -.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button { +.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button, .quick-settings-system-item .message .message-header .message-expand-button, .message .message-header .quick-settings-system-item .message-expand-button, +.quick-settings-system-item .message .message-header .message-close-button, +.message .message-header .quick-settings-system-item .message-close-button { background-color: rgba(0, 0, 0, 0.06); color: rgba(0, 0, 0, 0.87); border-radius: 5px; @@ -3374,15 +3572,21 @@ StWidget.focused .app-well-app-running-dot { min-width: 22px; } -.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover { +.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover, .quick-settings-system-item .message .message-header .message-expand-button:hover, .message .message-header .quick-settings-system-item .message-expand-button:hover, +.quick-settings-system-item .message .message-header .message-close-button:hover, +.message .message-header .quick-settings-system-item .message-close-button:hover { background-color: rgba(0, 0, 0, 0.12); } -.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active { +.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active, .quick-settings-system-item .message .message-header .message-expand-button:active, .message .message-header .quick-settings-system-item .message-expand-button:active, +.quick-settings-system-item .message .message-header .message-close-button:active, +.message .message-header .quick-settings-system-item .message-close-button:active { background-color: rgba(0, 0, 0, 0.2); } -.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon { +.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon, .quick-settings-system-item .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings-system-item .message-expand-button > StIcon, +.quick-settings-system-item .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings-system-item .message-close-button > StIcon { -st-icon-style: symbolic; icon-size: 16px; } @@ -3666,15 +3870,15 @@ StWidget.focused .app-well-app-running-dot { color: rgba(0, 0, 0, 0.54); background-color: #ffffff; margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .login-dialog StEntry:focus, .unlock-dialog StEntry:focus { color: rgba(0, 0, 0, 0.87); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #1A73E8; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #1A73E8 !important; } .login-dialog StEntry:insensitive, @@ -4143,7 +4347,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left #dash .dash-item-container .app-well-app, #dashtodockContainer.right #dash .dash-item-container .app-well-app { - padding: 3px 4px !important; + padding: 1px 4px !important; } #dashtodockContainer.left #dash .show-apps, #dashtodockContainer.right #dash .show-apps { @@ -4156,11 +4360,11 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.left.extended #dash .show-apps, #dashtodockContainer.left.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.left.straight-corner #dash .show-apps, #dashtodockContainer.right.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.right.extended #dash .show-apps, #dashtodockContainer.right.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.right.straight-corner #dash .show-apps { - padding: 3px 10px !important; + padding: 1px 8px !important; } #dashtodockContainer.top #dash .dash-background, #dashtodockContainer.bottom #dash .dash-background { - padding: 10px 5px !important; + padding: 8px 4px !important; } #dashtodockContainer.top.shrink #dash .dash-background, #dashtodockContainer.bottom.shrink #dash .dash-background { @@ -4173,11 +4377,11 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.top.extended #dash .dash-separator, #dashtodockContainer.top.straight-corner #dash .dash-separator, #dashtodockContainer.bottom.extended #dash .dash-separator, #dashtodockContainer.bottom.straight-corner #dash .dash-separator { - margin: 0 8px !important; + margin: 0 5px !important; } #dashtodockContainer.top.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.top.extended #dash .show-apps, #dashtodockContainer.top.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.top.straight-corner #dash .show-apps, #dashtodockContainer.bottom.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.extended #dash .show-apps, #dashtodockContainer.bottom.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.straight-corner #dash .show-apps { - padding: 10px 3px !important; + padding: 8px 1px !important; } #dashtodockContainer #dash { @@ -4186,7 +4390,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer #dash .dash-background { - background-color: #f3f3f3; + background-color: rgba(255, 255, 255, 0.75); background-clip: padding-box; } @@ -4242,7 +4446,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.transparent #dash .dash-background { - background-color: #f3f3f3; + background-color: rgba(255, 255, 255, 0.75); } #dashtodockContainer:overview #dash .dash-background { diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/gtk-dark.css index 0780c94..10b0fc5 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/gtk-dark.css @@ -1432,7 +1432,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { border-radius: 8px 8px 0 0; color: white; box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12); - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .titlebar:disabled { @@ -1984,7 +1984,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); background-clip: border-box; border: 1px solid rgba(255, 255, 255, 0.12); } @@ -2118,7 +2118,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: border-box; } @@ -4296,7 +4296,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(48, 48, 48, 0.95); border-radius: 0 0 8px 8px; - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd.unified { @@ -4304,11 +4304,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7512,8 +7512,6 @@ frame.raven-frame > border { .raven { background-color: #3C3C3C; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8013,7 +8011,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); background-color: #3C3C3C; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/gtk.css index 0322a26..c69e3ff 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-3.0/gtk.css @@ -1432,7 +1432,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { border-radius: 8px 8px 0 0; color: rgba(0, 0, 0, 0.87); box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12); - background-color: #F7F7F7; + background-color: rgba(247, 247, 247, 0.98); } .titlebar:disabled { @@ -1984,7 +1984,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); background-clip: border-box; border: 1px solid rgba(0, 0, 0, 0.12); } @@ -2118,7 +2118,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: padding-box; } @@ -4296,7 +4296,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(250, 250, 250, 0.95); border-radius: 0 0 8px 8px; - background-color: #FAFAFA; + background-color: rgba(250, 250, 250, 0.95); } .nautilus-window.background.csd.unified { @@ -4304,11 +4304,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #F7F7F7; + background-color: rgba(247, 247, 247, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #FAFAFA; + background-color: rgba(250, 250, 250, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7512,8 +7512,6 @@ frame.raven-frame > border { .raven { background-color: #FFFFFF; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8001,7 +7999,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/gtk-dark.css index de4b32f..82dc829 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/gtk-dark.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1741,7 +1741,7 @@ headerbar { min-height: 36px; margin: 0; padding: 0; - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } headerbar:disabled { @@ -1912,10 +1912,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2386,8 +2382,8 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #3C3C3C; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(60, 60, 60, 0.98); border-radius: 6px; color: white; border: 1px solid rgba(255, 255, 255, 0.12); @@ -2430,6 +2426,10 @@ popover.background toolbar { background-color: #3C3C3C; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2499,9 +2499,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 20px; min-width: 20px; padding: 2px 8px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(255, 255, 255, 0.7); @@ -2766,6 +2765,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4732,7 +4736,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4881,6 +4885,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 8px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4917,7 +4925,7 @@ weekgrid.current { } popover.events { - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); padding: 0; } @@ -5346,7 +5354,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5857,6 +5865,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5970,7 +5986,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6065,7 +6081,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6190,7 +6206,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6278,7 +6294,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 16px 4px 8 2; + margin: 16px 4px 8px 2px; border-spacing: 16px; } @@ -6819,12 +6835,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); color: white; } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6978,13 +6994,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); color: white; } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7017,6 +7033,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7171,6 +7193,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 6px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #3281EA; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 4px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #3281EA; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(255, 255, 255, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/gtk.css index 88266ca..021c6dc 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light-compact/gtk-4.0/gtk.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1741,7 +1741,7 @@ headerbar { min-height: 36px; margin: 0; padding: 0; - background-color: #F7F7F7; + background-color: rgba(247, 247, 247, 0.98); } headerbar:disabled { @@ -1912,10 +1912,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2386,12 +2382,12 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #FFFFFF; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(255, 255, 255, 0.98); border-radius: 6px; color: rgba(0, 0, 0, 0.87); border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.12); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.12); } popover.background:backdrop > arrow, @@ -2430,6 +2426,10 @@ popover.background toolbar { background-color: #FFFFFF; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2499,9 +2499,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 20px; min-width: 20px; padding: 2px 8px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(0, 0, 0, 0.6); @@ -2766,6 +2765,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4732,7 +4736,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4881,6 +4885,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 8px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4917,7 +4925,7 @@ weekgrid.current { } popover.events { - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); padding: 0; } @@ -5346,7 +5354,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5857,6 +5865,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5970,7 +5986,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6065,7 +6081,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6190,7 +6206,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6278,7 +6294,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 16px 4px 8 2; + margin: 16px 4px 8px 2px; border-spacing: 16px; } @@ -6819,12 +6835,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#1A73E8, #FAFAFA, 30%); + background-color: mix(#1A73E8,#FAFAFA,0.7); color: rgba(0, 0, 0, 0.87); } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#1A73E8, #FAFAFA, 30%); + background-color: mix(#1A73E8,#FAFAFA,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6978,13 +6994,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#1A73E8, #FFFFFF, 30%); + background-color: mix(#1A73E8,#FFFFFF,0.7); color: rgba(0, 0, 0, 0.87); } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#1A73E8, #FFFFFF, 30%); + background-color: mix(#1A73E8,#FFFFFF,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7017,6 +7033,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7171,6 +7193,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 6px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #1A73E8; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #1A73E8; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 4px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #1A73E8; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #1A73E8; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(0, 0, 0, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/cinnamon/cinnamon.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/cinnamon/cinnamon.css index fb3bcea..5e73233 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/cinnamon/cinnamon.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/cinnamon/cinnamon.css @@ -10,7 +10,7 @@ stage { min-height: 24px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); background-color: rgba(0, 0, 0, 0.04); } @@ -18,36 +18,36 @@ stage { .sound-button:focus { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover:focus { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .sound-button:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .sound-button:insensitive { color: rgba(0, 0, 0, 0.38); background-color: rgba(0, 0, 0, 0.04); - border-radius: 4px; + border-radius: 2px; } .notification-button, .notification-icon-button, .menu #notification .notification-button, .menu #notification .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button, #notification .notification-button, #notification .notification-icon-button, .calendar-today-home-button, .calendar-today-home-button-enabled { - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); background-color: transparent; } @@ -56,28 +56,28 @@ stage { .calendar-today-home-button-enabled:hover { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active, .calendar-today-home-button:active, .calendar-today-home-button-enabled:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive, .calendar-today-home-button:insensitive, .calendar-today-home-button-enabled:insensitive { color: rgba(0, 0, 0, 0.26); background-color: transparent; - border-radius: 4px; + border-radius: 2px; } .modal-dialog-button-box .modal-dialog-button { min-height: 24px; padding: 6px 30px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); } @@ -108,7 +108,7 @@ stage { selection-background-color: #1A73E8; selected-color: white; transition-duration: 300ms; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.87); border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.04); @@ -271,7 +271,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 4px; + border-radius: 2px; padding: 5px 12px; background-color: rgba(54, 54, 54, 0.9); color: white; @@ -300,8 +300,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-content { padding: 6px 0; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; - border-radius: 6px; + background-color: rgba(255, 255, 255, 0.98); + border-radius: 3px; margin: 6px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } @@ -351,7 +351,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: 6px 12px; spacing: 12px; - border-radius: 4px; + border-radius: 2px; margin: 0 6px; } @@ -395,7 +395,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); @@ -525,7 +525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 1em; padding: 0px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5), 0 0 16px rgba(0, 0, 0, 0.24); - background-color: #F7F7F7; + background-color: rgba(247, 247, 247, 0.8); } .panel-top .panel-button:hover, @@ -585,7 +585,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(54, 54, 54, 0.9); color: white; spacing: 25px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -601,7 +601,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, .expo-workspaces-name-entry#selected { height: 15px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -624,13 +624,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspace-thumbnail-frame { border: 4px solid rgba(255, 255, 255, 0); background-color: rgba(255, 255, 255, 0); - border-radius: 4px; + border-radius: 2px; } .expo-workspace-thumbnail-frame#active { border: 4px solid #1A73E8; background-color: black; - border-radius: 4px; + border-radius: 2px; } .expo-background { @@ -730,7 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; background-color: #FFFFFF; padding: 4px; padding-right: 0; @@ -845,7 +845,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { text-align: center; font-size: 14px; color: rgba(0, 0, 0, 0.87); - border-radius: 4px; + border-radius: 2px; } .calendar-day-base { @@ -930,7 +930,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 8px; min-width: 350px; border: none; - border-radius: 4px; + border-radius: 2px; background-gradient-direction: vertical; background-gradient-start: rgba(0, 0, 0, 0.04); background-gradient-end: rgba(0, 0, 0, 0.04); @@ -940,7 +940,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-events-no-events-button { margin: 6px 0; padding: 6px; - border-radius: 4px; + border-radius: 2px; } .calendar-events-no-events-button:hover { @@ -983,7 +983,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-event-button { margin: 6px 0 6px 0; - border-radius: 4px; + border-radius: 2px; } .calendar-event-button:hover { @@ -1050,14 +1050,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 8px; + border-radius: 3px; padding: 12px; spacing-rows: 9px; spacing-columns: 9px; margin-from-right-edge-of-screen: 18px; width: 28em; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); margin: 7px 12px 17px 12px; } @@ -1068,7 +1068,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu #notification, .popup-menu #notification { border: none; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.05); box-shadow: none; margin: 0; @@ -1136,9 +1136,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); border: none; - border-radius: 4px; + border-radius: 2px; padding: 20px; } @@ -1152,7 +1152,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 4px; + border-radius: 2px; } .switcher-list .item-box:outlined { @@ -1226,7 +1226,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(46, 46, 46, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 4px; + border-radius: 2px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1251,7 +1251,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 6px 12px; background-color: rgba(54, 54, 54, 0.9); - border-radius: 4px; + border-radius: 2px; color: white; } @@ -1283,7 +1283,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 3px 12px; - border-radius: 4px; + border-radius: 2px; caret-color: white; selected-color: white; selection-background-color: #1A73E8; @@ -1412,7 +1412,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 4px; + border-radius: 2px; box-shadow: none; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); @@ -1436,7 +1436,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: white; padding: 5px; - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(54, 54, 54, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1452,17 +1452,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { transition-duration: 300; background-color: rgba(0, 0, 0, 0.05); border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button { padding: 9px; border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button:hover { - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.1); } @@ -1486,7 +1486,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1498,7 +1498,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); padding: 6px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1516,7 +1516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu StScrollView.menu-application-button { padding: 3px 0; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.6); } @@ -1525,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; spacing: 0; margin: 0 3px; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); } @@ -1557,7 +1557,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border-radius: 4px; + border-radius: 2px; } .menu-category-button-selected { @@ -1567,7 +1567,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button-hover, .menu-category-button-selected { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .menu-category-button-greyed { @@ -1647,12 +1647,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 4px; + border-radius: 2px; color: #1A73E8; } .osd-window .level-bar { - border-radius: 4px; + border-radius: 2px; background-color: #1A73E8; } @@ -1800,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0F9D58; background-gradient-end: #0F9D58; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -1814,7 +1814,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 6px; border: none; background-color: #FFFFFF; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.87); box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1830,15 +1830,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu { padding: 6px; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; - border-radius: 6px; + background-color: rgba(255, 255, 255, 0.98); + border-radius: 3px; margin: 6px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } .grouped-window-list-thumbnail-menu .item-box { padding: 6px; - border-radius: 4px; + border-radius: 2px; spacing: 6px; margin: 1px; } @@ -1923,7 +1923,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0F9D58; background-gradient-end: #0F9D58; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -2004,7 +2004,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 0; margin-top: 6px; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } @@ -2043,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 6px; background-color: rgba(0, 0, 0, 0.5); border: none; - border-radius: 0 0 4px 4px; + border-radius: 0 0 2px 2px; color: white; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gnome-shell/assets/menu.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gnome-shell/assets/menu.svg index 12f85d3..fa3dc0b 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gnome-shell/assets/menu.svg +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gnome-shell/assets/menu.svg @@ -73,7 +73,7 @@ d="M 14 3 C 9.0140007 3 5 7.0140007 5 12 L 5 100 C 5 104.986 9.0140007 109 14 109 L 102 109 C 106.986 109 111 104.986 111 100 L 111 12 C 111 7.0140007 106.986 3 102 3 L 14 3 z M 14 4 L 102 4 C 106.432 4 110 7.5680012 110 12 L 110 100 C 110 104.432 106.432 108 102 108 L 14 108 C 9.5680012 108 6 104.432 6 100 L 6 12 C 6 7.5680012 9.5680012 4 14 4 z " transform="scale(0.26458333)" /> StIcon { - icon-size: 48px; + icon-size: 96px; margin-bottom: 12px; -st-icon-style: symbolic; } .message-list-sections { - spacing: 6px; - margin: 0; - padding-bottom: 6px; + spacing: 12px; } .message-list-sections:ltr { @@ -1045,13 +1168,24 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section, .message-list-section-list { - spacing: 6px; + spacing: 12px; } .message-list-controls { - margin: 8px 16px 0; - padding: 4px; - spacing: 12px; + padding: 12px; + padding-bottom: 6px; + spacing: 6px; +} + +.message-list-controls .dnd-button { + border-width: 2px; + border-color: transparent; + border-radius: 32px; + border-style: solid; +} + +.message-list-controls .dnd-button:focus { + border-color: rgba(26, 115, 232, 0.6); } .message { @@ -1059,97 +1193,152 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 5px; color: rgba(0, 0, 0, 0.54); text-shadow: none; + padding: 0; + margin: 4px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.15); - border: 1px solid rgba(0, 0, 0, 0.12); + background-color: rgba(255, 255, 255, 0.95); + border: 1px solid transparent; +} + +.message:hover, .message:focus, .message:active { + background-color: #ffffff; } .popup-menu .message { - box-shadow: none; margin: 0 0 4px; + box-shadow: none; + background-color: rgba(255, 255, 255, 0.35); + border-radius: 5px; + color: rgba(0, 0, 0, 0.54); + border: 1px solid rgba(0, 0, 0, 0.12); } -.message:hover, .message:focus { +.popup-menu .message:hover, .popup-menu .message:focus { background-color: rgba(0, 0, 0, 0.06); border-color: rgba(0, 0, 0, 0.15); } -.message:active { +.popup-menu .message:active { background-color: rgba(0, 0, 0, 0.08); } -.message .message-icon-bin { - padding: 18px; - padding-right: 6px; +.message:ltr { + padding-right: -2px; } -.message .message-icon-bin:rtl { - padding-left: 6px; +.message:rtl { + padding-left: -2px; } -.message .message-icon-bin > StIcon { +.message .message-header { + padding: 0 0.409em; + margin: 6px; + margin-bottom: 0; + spacing: 6px; + color: rgba(0, 0, 0, 0.38); +} + +.message .message-header .message-source-icon { + icon-size: 1.091em; + -st-icon-style: symbolic; +} + +.message .message-header .message-header-content { + spacing: 6px; + min-height: 1.637em; + padding-bottom: 6px; +} + +.message .message-header .message-header-content .message-source-title { + font-weight: bold; +} + +.message .message-header .message-header-content .event-time { + color: rgba(0, 0, 0, 0.38); + padding-bottom: 0.068em; +} + +.message .message-header .message-header-content .event-time:ltr { + text-align: right; +} + +.message .message-header .message-header-content .event-time:rtl { + text-align: left; +} + +.message .message-header .message-expand-button, +.message .message-header .message-close-button { + color: rgba(0, 0, 0, 0.87); + background-color: rgba(0, 0, 0, 0); + padding: 4px; +} + +.message .message-header .message-expand-button:hover, +.message .message-header .message-close-button:hover { + background-color: rgba(0, 0, 0, 0.06); +} + +.message .message-header .message-expand-button:active, .message .message-header .message-expand-button:active:hover, +.message .message-header .message-close-button:active, +.message .message-header .message-close-button:active:hover { + background-color: rgba(0, 0, 0, 0.11); +} + +.message .message-header .message-expand-button:insensitive, +.message .message-header .message-close-button:insensitive { + background-color: rgba(0, 0, 0, 0); +} + +.message .message-header .message-expand-button { + padding: 6px; +} + +.message .message-header .message-expand-button:ltr { + margin-right: 6px; +} + +.message .message-header .message-expand-button:rtl { + margin-left: 6px; +} + +.message .message-box { + padding: 6px; + margin: 6px; + margin-top: 0; + spacing: 6px; +} + +.message .message-box .message-icon { icon-size: 48px; -st-icon-style: symbolic; } -.message .message-icon-bin > .fallback-app-icon { - width: 32px; - height: 32px; +.message .message-box .message-icon:ltr { + margin-right: 6px; } -.message .message-content { - padding: 14px; - spacing: 4px; - margin-bottom: 8px; - color: rgba(0, 0, 0, 0.54); +.message .message-box .message-icon:rtl { + margin-left: 6px; } -.message .message-title { - font-weight: bold; - padding-top: 0.57em; -} - -.message .message-secondary-bin { - padding: 0 8px; -} - -.message .message-secondary-bin > .event-time { - color: rgba(0, 0, 0, 0.54); - font-size: 0.9em; - padding-bottom: 0.13em; -} - -.message .message-secondary-bin > .event-time:ltr { - text-align: right; -} - -.message .message-secondary-bin > .event-time:rtl { - text-align: left; -} - -.message .message-close-button { - color: rgba(0, 0, 0, 0.54); - padding: 2px; - height: 24px; - width: 24px; +.message .message-box .message-icon.message-themed-icon { border-radius: 9999px; + background-color: rgba(0, 0, 0, 0.07); + icon-size: 16px; + min-width: 48px; + min-height: 48px; } -.message .message-close-button:hover, .message .message-close-button:focus { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.06); +.message .message-box:first-child { + margin-top: 12px; } -.message .message-close-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); +.message .message-box .message-content { + spacing: 4px; } -.message .message-close-button:insensitive { - color: rgba(0, 0, 0, 0.26); -} - -.message .message-body { - color: rgba(0, 0, 0, 0.38); +.message .message-box .message-content .message-title { + font-weight: bold; } .url-highlighter { @@ -1158,10 +1347,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Media Controls */ .message-media-control { - margin: 24px 6px; - padding: 12px; + margin: 4px 0; + padding: 0 12px; border-radius: 9999px; color: rgba(0, 0, 0, 0.54); + border: none; } .message-media-control:hover, .message-media-control:focus { @@ -1178,33 +1368,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.26); } -.message-media-control:last-child:ltr { - margin-right: 16px; - padding-right: 8px; +.message-media-control StIcon { + icon-size: 16px; } -.message-media-control:last-child:rtl { - margin-left: 16px; - padding-left: 8px; +.media-message .message-icon { + border-radius: 5px !important; } -.media-message-cover-icon { - icon-size: 48px !important; - border-radius: 5px; - border: none; -} - -.media-message-cover-icon.fallback { - color: rgba(0, 0, 0, 0.38); - background-color: rgba(0, 0, 0, 0.06); - border: none; - border-radius: 5px; +.media-message .message-icon.message-themed-icon { icon-size: 32px !important; - padding: 8px; } .candidate-popup-content { - background-color: #ffffff; + background-color: rgba(255, 255, 255, 0.95); border-radius: 8px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.25) !important; margin: 3px 8px 11px; @@ -1277,126 +1454,87 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { min-height: 64px; width: 34em; - font-size: 1em; - margin: 9px 8px 12px; - border-radius: 5px; - color: rgba(0, 0, 0, 0.87); - background-color: rgba(255, 255, 255, 0.92); - border: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.35); + margin: 6px; + border-radius: 12px; } -.notification-banner:hover { - background-color: rgba(255, 255, 255, 0.95); -} - -.notification-banner:focus { - background-color: #ffffff; -} - -.notification-banner .notification-actions { +.notification-buttons-bin { spacing: 0; } -.notification-banner .notification-button { +.notification-button { min-height: 40px; padding: 0 16px; - background-color: transparent; - color: rgba(0, 0, 0, 0.54); + background-color: transparent !important; + color: rgba(0, 0, 0, 0.54) !important; font-weight: 500; - border-width: 0; - border-top: 1px solid rgba(0, 0, 0, 0.12); + border-top: 1px solid rgba(0, 0, 0, 0.12) !important; } -.notification-banner .notification-button:first-child { - border-radius: 0 0 0 5px !important; -} - -.notification-banner .notification-button:last-child { - border-radius: 0 0 5px 0 !important; -} - -.notification-banner .notification-button:only-child, .notification-banner .notification-button:first-child:last-child { - border-radius: 0 0 5px 5px !important; -} - -.notification-banner .notification-button:focus { - background-color: transparent; - color: rgba(0, 0, 0, 0.54); +.notification-button:focus { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.54) !important; box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.06) !important; } -.notification-banner .notification-button:hover, .notification-banner .notification-button:focus:hover { - background-color: rgba(0, 0, 0, 0.06); - color: rgba(0, 0, 0, 0.87); +.notification-button:hover { + background-color: rgba(0, 0, 0, 0.06) !important; + color: rgba(0, 0, 0, 0.87) !important; box-shadow: none !important; } -.notification-banner .notification-button:active { - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); +.notification-button:active, .notification-button:checked { + background-color: rgba(0, 0, 0, 0.2) !important; + color: rgba(0, 0, 0, 0.87) !important; } -.summary-source-counter { - font-size: 1em; - font-weight: bold; - height: 1.6em; - width: 1.6em; - -shell-counter-overlap-x: 3px; - -shell-counter-overlap-y: 3px; - background-color: #1A73E8; - color: rgba(255, 255, 255, 0.85); - border: 2px solid #1A73E8; - box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); - border-radius: 0.9em; +.notification-button:insensitive { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.26) !important; } -.chat-body { - spacing: 5px; +.notification-button:first-child:ltr { + border-radius: 0 0 0 12px; } -.chat-response { - margin: 5px; +.notification-button:last-child:ltr { + border-radius: 0 0 12px; + margin-right: 0 !important; } -.chat-log-message { - color: rgba(0, 0, 0, 0.54); +.notification-button:first-child:rtl { + border-radius: 0 0 12px; } -.chat-new-group { - padding-top: 1em; +.notification-button:last-child:rtl { + border-radius: 0 0 0 12px; + margin-left: 0 !important; } -.chat-received { - padding-left: 4px; +.notification-button:first-child:last-child { + border-radius: 0 0 12px 12px; + margin-left: 0 !important; + margin-right: 0 !important; } -.chat-received:rtl { - padding-left: 0px; - padding-right: 4px; +.popup-menu .notification-button:first-child:ltr { + border-radius: 0 0 0 5px; } -.chat-sent { - padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); +.popup-menu .notification-button:last-child:ltr { + border-radius: 0 0 5px; } -.chat-sent:rtl { - padding-left: 0; - padding-right: 18pt; +.popup-menu .notification-button:first-child:rtl { + border-radius: 0 0 5px; } -.chat-meta-message { - font-weight: bold; - padding-left: 4px; - font-size: 9pt; - font-weight: 400; - color: rgba(0, 0, 0, 0.38); +.popup-menu .notification-button:last-child:rtl { + border-radius: 0 0 0 5px; } -.chat-meta-message:rtl { - padding-left: 0; - padding-right: 4px; +.popup-menu .notification-button:first-child:last-child { + border-radius: 0 0 5px 5px; } .hotplug-notification-item { @@ -1903,21 +2041,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Top Bar */ #panel .panel-button#panelActivities { - background-image: url("assets/activities.svg"); - background-position: center center; - background-repeat: no-repeat; - background-size: auto; - color: transparent !important; - font-size: 0; - box-shadow: none; + -natural-hpadding: 15px; } -#panel .panel-button#panelActivities * { - width: 36px; +#panel .panel-button#panelActivities StBoxLayout { + spacing: 6px; } #panel .panel-button#panelActivities .workspace-dot { - background-color: transparent; + border-radius: 9999px; + min-width: 8px; + min-height: 8px; + background-color: rgba(0, 0, 0, 0.88); } #panel { @@ -1927,10 +2062,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; padding: 0 2px !important; - background-color: #f3f3f3; - border-radius: 12px; - margin: 3px; - height: 38px; + background-color: rgba(255, 255, 255, 0.75); + margin: 0; + border-radius: 0; + height: 34px; } #panel #panelLeft, #panel #panelCenter { @@ -1939,7 +2074,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #f3f3f3; + -panel-corner-background-color: rgba(255, 255, 255, 0.75); -panel-corner-border-width: 0; -panel-corner-border-color: transparent; -panel-corner-opacity: 0; @@ -1963,6 +2098,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; } +#panel .panel-button.clock-display { + border: 1px solid transparent !important; + box-shadow: inset 0 1px transparent !important; +} + +#panel .panel-button.clock-display:hover { + color: rgba(0, 0, 0, 0.75); + background-color: rgba(255, 255, 255, 0.35) !important; +} + +#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:checked, #panel .panel-button.clock-display:focus { + color: rgba(0, 0, 0, 0.88); + background-color: rgba(255, 255, 255, 0.5) !important; +} + #panel .panel-button.clock-display .clock { color: rgba(0, 0, 0, 0.75); transition-duration: 150ms; @@ -1970,6 +2120,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; } +#panel .panel-button.clock-display .messages-indicator { + icon-size: 1.091em; +} + #panel .panel-button:hover { color: rgba(0, 0, 0, 0.75); background-color: rgba(255, 255, 255, 0.35); @@ -2030,10 +2184,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: transparent; } -#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { - color: rgba(255, 255, 255, 0.7); -} - #panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel.lock-screen .panel-button:hover, #panel:overview .panel-button:hover { background-color: rgba(255, 255, 255, 0.15); } @@ -2047,17 +2197,37 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } +#panel.unlock-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:hover { + background-color: rgba(255, 255, 255, 0.15) !important; +} + +#panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:checked, #panel.unlock-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:focus { + background-color: rgba(255, 255, 255, 0.3) !important; +} + +#panel.unlock-screen .panel-button.clock-display:hover, #panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:overview, #panel.unlock-screen .panel-button.clock-display:focus, #panel.unlock-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:overview, #panel.login-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:overview, #panel.lock-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:overview, #panel:overview .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:checked { + border: 1px solid rgba(0, 0, 0, 0.12) !important; + box-shadow: inset 0 1px rgba(255, 255, 255, 0.1) !important; +} + +#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { + color: rgba(255, 255, 255, 0.7); +} + #panel.unlock-screen .panel-button#panelActivities, #panel.login-screen .panel-button#panelActivities, #panel.lock-screen .panel-button#panelActivities, #panel:overview .panel-button#panelActivities { box-shadow: none; border: none; background-color: transparent; - background-image: url("assets/activities-white.svg") !important; } #panel.unlock-screen .panel-button#panelActivities:hover, #panel.login-screen .panel-button#panelActivities:hover, #panel.lock-screen .panel-button#panelActivities:hover, #panel:overview .panel-button#panelActivities:hover { background-color: rgba(255, 255, 255, 0.15); } +#panel.unlock-screen .panel-button#panelActivities .workspace-dot, #panel.login-screen .panel-button#panelActivities .workspace-dot, #panel.lock-screen .panel-button#panelActivities .workspace-dot, #panel:overview .panel-button#panelActivities .workspace-dot { + background-color: rgba(255, 255, 255, 0.85); +} + #panel.unlock-screen .panel-corner, #panel.login-screen .panel-corner, #panel.lock-screen .panel-corner, #panel:overview .panel-corner { -panel-corner-opacity: 0; -panel-corner-radius: 0; @@ -2070,43 +2240,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px !important; } -#panel Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_ui_panel_ActivitiesButton.panel-button { - border-radius: 12px 0 0 12px !important; -} - -#panel Gjs_AggregateMenu.panel-button, -#panel Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 0 12px 12px 0 !important; -} - -#panel:overview Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel:overview Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel:overview Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel:overview Gjs_ui_panel_ActivitiesButton.panel-button, -#panel:overview Gjs_AggregateMenu.panel-button, -#panel:overview Gjs_ui_panel_AggregateMenu.panel-button, #panel.unlock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.unlock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.unlock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.unlock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.unlock-screen Gjs_AggregateMenu.panel-button, -#panel.unlock-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.login-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.login-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.login-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.login-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.login-screen Gjs_AggregateMenu.panel-button, -#panel.login-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.lock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.lock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.lock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.lock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.lock-screen Gjs_AggregateMenu.panel-button, -#panel.lock-screen Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 5px !important; -} - #panel Gjs_ArcMenu_ApplicationsButton.panel-button, #panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, #panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, @@ -2217,18 +2350,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.54); background-color: #ffffff; margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .search-entry:hover { - border: 2px solid rgba(0, 0, 0, 0.2); + border: 2px solid rgba(0, 0, 0, 0.2) !important; } .search-entry:focus { color: rgba(0, 0, 0, 0.87); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #1A73E8; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #1A73E8 !important; } .search-entry:insensitive { @@ -2255,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { caret-color: rgba(0, 0, 0, 0.75); color: rgba(0, 0, 0, 0.75); background-color: rgba(255, 255, 255, 0.75) !important; - border-color: transparent; - box-shadow: none; + border: none !important; + box-shadow: none !important; } #overview .search-entry:hover { @@ -2266,9 +2399,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #overview .search-entry:focus { color: rgba(0, 0, 0, 0.85); - border-color: transparent; background-color: rgba(255, 255, 255, 0.95) !important; - border: none; + border: none !important; selection-background-color: #1A73E8; selected-color: #FFFFFF !important; } @@ -2286,17 +2418,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Search */ +#searchResults { + margin: 0 8px; +} + #searchResultsContent { - max-width: 1024px; - spacing: 8px; + max-width: 1044px; } .search-section { - spacing: 8px; + spacing: 12px; } .search-section .search-section-separator { - height: 0; + height: 8px; background-color: transparent; } @@ -2315,21 +2450,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 12px; } -.list-search-result:focus, .search-provider-icon:focus, .list-search-result:hover, .search-provider-icon:hover, .list-search-result:selected, .search-provider-icon:selected { - background-color: rgba(255, 255, 255, 0.15); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - transition-duration: 100ms; -} - -.list-search-result:active, .search-provider-icon:active, .list-search-result:checked, .search-provider-icon:checked { - background-color: rgba(255, 255, 255, 0.3); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); +.search-statustext { + color: rgba(255, 255, 255, 0.7); } .grid-search-results { spacing: 36px; + margin: 0 12px; +} + +.search-provider-icon:ltr { + margin-right: 4px; +} + +.search-provider-icon:rtl { + margin-left: 4px; } .search-provider-icon .list-search-provider-content { @@ -2338,7 +2473,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .search-provider-icon .list-search-provider-content .list-search-provider-details { width: 120px; - margin-top: 0; color: rgba(255, 255, 255, 0.7); } @@ -2360,44 +2494,102 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash */ #dash { - font-size: 1em; margin-top: 12px; - padding: 0 10px; } -#dash .placeholder { +#dash .dash-background { + background-color: rgba(255, 255, 255, 0.2); + border-radius: 20px; + padding-top: 12px; + padding-bottom: 12px; + padding-left: 10px; + padding-right: 10px; +} + +#dash .dash-item-container .placeholder { background-image: none; background-size: contain; height: 32px; } -#dash .empty-dash-drop-target { +#dash .dash-item-container .empty-dash-drop-target { width: 32px; height: 32px; } -#dash .overview-icon { - padding: 5px; - border-radius: 8px; +#dash .dash-item-container .show-apps, +#dash .dash-item-container .overview-tile, +#dash .dash-item-container .grid-search-result, +#dash .dash-item-container .search-provider-icon, +#dash .dash-item-container .list-search-result { + margin: 0 2px; + padding-bottom: 12px; } -.dash-background { - background-color: rgba(255, 255, 255, 0.2); - margin-bottom: 18px; - padding: 10px; - border-radius: 18px; +#dash .dash-item-container .show-apps .overview-icon, +#dash .dash-item-container .overview-tile .overview-icon, +#dash .dash-item-container .grid-search-result .overview-icon, +#dash .dash-item-container .search-provider-icon .overview-icon, +#dash .dash-item-container .list-search-result .overview-icon { + background-color: transparent; } -.dash-item-container .app-well-app, .show-apps { - padding: 10px 3px 28px; -} - -.dash-separator { - width: 1px; - margin: 0 8px 18px; +#dash .dash-item-container .show-apps:focus .overview-icon, +#dash .dash-item-container .overview-tile:focus .overview-icon, +#dash .dash-item-container .grid-search-result:focus .overview-icon, +#dash .dash-item-container .search-provider-icon:focus .overview-icon, +#dash .dash-item-container .list-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.15); } +#dash .dash-item-container .show-apps:hover .overview-icon, +#dash .dash-item-container .overview-tile:hover .overview-icon, +#dash .dash-item-container .grid-search-result:hover .overview-icon, +#dash .dash-item-container .search-provider-icon:hover .overview-icon, +#dash .dash-item-container .list-search-result:hover .overview-icon { + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-item-container .show-apps:active .overview-icon, +#dash .dash-item-container .overview-tile:active .overview-icon, +#dash .dash-item-container .grid-search-result:active .overview-icon, +#dash .dash-item-container .search-provider-icon:active .overview-icon, +#dash .dash-item-container .list-search-result:active .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:checked .overview-icon, +#dash .dash-item-container .overview-tile:checked .overview-icon, +#dash .dash-item-container .grid-search-result:checked .overview-icon, +#dash .dash-item-container .search-provider-icon:checked .overview-icon, +#dash .dash-item-container .list-search-result:checked .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:insensitive .overview-icon, +#dash .dash-item-container .overview-tile:insensitive .overview-icon, +#dash .dash-item-container .grid-search-result:insensitive .overview-icon, +#dash .dash-item-container .search-provider-icon:insensitive .overview-icon, +#dash .dash-item-container .list-search-result:insensitive .overview-icon { + background-color: transparent; +} + +#dash .dash-item-container .app-grid-running-dot { + margin-bottom: 21px; +} + +#dash .dash-separator { + width: 1px; + margin-left: 4px; + margin-right: 4px; + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-separator, +#dash .dash-background { + margin-bottom: 12px; +} + .dash-label { border-radius: 5px; padding: 6px 12px; @@ -2407,46 +2599,37 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; text-align: center; - -y-offset: 20px; + -y-offset: 4px; } /* App Grid */ - -.show-apps .overview-icon, -.app-well-app .overview-icon, -.grid-search-result .overview-icon, .search-provider-icon, .list-search-result { - color: rgba(255, 255, 255, 0.85); - border-radius: 10px; - padding: 6px; - border: 1px solid transparent; - box-shadow: inset 0 1px transparent; - transition-duration: 150ms; - text-align: center; -} - .icon-grid { row-spacing: 12px; column-spacing: 12px; - max-row-spacing: 72px; - max-column-spacing: 72px; + max-row-spacing: 36px; + max-column-spacing: 36px; page-padding-top: 24px; page-padding-bottom: 24px; - page-padding-left: 12px; - page-padding-right: 12px; + page-padding-left: 18px; + page-padding-right: 18px; } /* App Icons */ +.overview-tile, .grid-search-result, .search-provider-icon, .list-search-result { + border-radius: 24px; + padding: 12px; + spacing: 6px; + transition-duration: 150ms; + text-align: center; + background-color: transparent; + color: rgba(255, 255, 255, 0.85); + border: 1px solid transparent; + box-shadow: inset 0 1px transparent; +} -.show-apps:hover .overview-icon, -.show-apps:focus .overview-icon, -.show-apps:selected .overview-icon, -.app-well-app:hover .overview-icon, -.app-well-app:focus .overview-icon, -.app-well-app:selected .overview-icon, -.grid-search-result:hover .overview-icon, -.grid-search-result:focus .overview-icon, -.grid-search-result:selected .overview-icon { +.overview-tile:hover, .grid-search-result:hover, .search-provider-icon:hover, .list-search-result:hover, .overview-tile:focus, .grid-search-result:focus, .search-provider-icon:focus, .list-search-result:focus, .overview-tile:highlighted, .grid-search-result:highlighted, .search-provider-icon:highlighted, .list-search-result:highlighted, .overview-tile:selected, .grid-search-result:selected, .search-provider-icon:selected, .list-search-result:selected { background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.85); transition-duration: 0ms; border-image: none; background-image: none; @@ -2454,34 +2637,43 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps:active .overview-icon, -.show-apps:checked .overview-icon, -.app-well-app:active .overview-icon, -.app-well-app:checked .overview-icon, -.grid-search-result:active .overview-icon, -.grid-search-result:checked .overview-icon { +.overview-tile:active, .grid-search-result:active, .search-provider-icon:active, .list-search-result:active, .overview-tile:checked, .grid-search-result:checked, .search-provider-icon:checked, .list-search-result:checked { background-color: rgba(255, 255, 255, 0.15); transition-duration: 150ms; + color: rgba(255, 255, 255, 0.85); border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps .overview-icon.overview-icon-with-label, -.app-well-app .overview-icon.overview-icon-with-label, -.grid-search-result .overview-icon.overview-icon-with-label { - padding: 10px 8px 5px 8px; -} - - -.show-apps .overview-icon.overview-icon-with-label > StBoxLayout, -.app-well-app .overview-icon.overview-icon-with-label > StBoxLayout, -.grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout { +.overview-tile .overview-icon.overview-icon-with-label > StBoxLayout, .grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout, .search-provider-icon .overview-icon.overview-icon-with-label > StBoxLayout, .list-search-result .overview-icon.overview-icon-with-label > StBoxLayout { spacing: 6px; } -.app-well-app-running-dot { +.app-folder { + background-color: rgba(255, 255, 255, 0.13); +} + +.app-folder:focus { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:hover { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:active { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:highlighted, .app-folder:selected, .app-folder:checked { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:insensitive { + background-color: transparent; +} + +.app-grid-running-dot { width: 6px; height: 3px; border-radius: 2px; @@ -2489,33 +2681,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin-bottom: 1px; } -StWidget.focused .app-well-app-running-dot { +StWidget.focused .app-grid-running-dot { width: 18px; background-color: #1A73E8; } -/* App Folders */ -.app-well-app.app-folder { - background: none; - border-radius: 10px; -} - -.app-well-app.app-folder .overview-icon { - background-color: rgba(255, 255, 255, 0.13); - border-radius: 10px; -} - -.app-well-app.app-folder:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.15); -} - -.app-well-app.app-folder:active .overview-icon { - background-color: rgba(255, 255, 255, 0.3); +.app-folder-dialog-container { + padding-top: 34px; } .app-folder-dialog { + width: 720px; + height: 720px; border-radius: 20px; background-color: rgba(34, 34, 34, 0.95); + color: white; border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } @@ -2563,7 +2743,9 @@ StWidget.focused .app-well-app-running-dot { color: rgba(255, 255, 255, 0.7); } -.app-folder-dialog .folder-name-container .edit-folder-button { +.app-folder-dialog .folder-name-container .icon-button, .app-folder-dialog .folder-name-container .background-app-item .close-button, .background-app-item .app-folder-dialog .folder-name-container .close-button, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button { background-color: rgba(255, 255, 255, 0.15); color: rgba(255, 255, 255, 0.7); border: none; @@ -2573,15 +2755,23 @@ StWidget.focused .app-well-app-running-dot { border-radius: 18px; } -.app-folder-dialog .folder-name-container .edit-folder-button > StIcon { +.app-folder-dialog .folder-name-container .icon-button > StIcon, .app-folder-dialog .folder-name-container .background-app-item .close-button > StIcon, .background-app-item .app-folder-dialog .folder-name-container .close-button > StIcon, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button > StIcon, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button > StIcon, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button > StIcon, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button > StIcon { icon-size: 16px; } -.app-folder-dialog .folder-name-container .edit-folder-button:hover { +.app-folder-dialog .folder-name-container .icon-button:hover, .app-folder-dialog .folder-name-container .background-app-item .close-button:hover, .background-app-item .app-folder-dialog .folder-name-container .close-button:hover, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:hover, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:hover, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:hover, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:hover { background-color: rgba(255, 255, 255, 0.15); } -.app-folder-dialog .folder-name-container .edit-folder-button:checked, .app-folder-dialog .folder-name-container .edit-folder-button:active { +.app-folder-dialog .folder-name-container .icon-button:checked, .app-folder-dialog .folder-name-container .background-app-item .close-button:checked, .background-app-item .app-folder-dialog .folder-name-container .close-button:checked, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:checked, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:checked, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:checked, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:checked, .app-folder-dialog .folder-name-container .icon-button:active, .app-folder-dialog .folder-name-container .background-app-item .close-button:active, .background-app-item .app-folder-dialog .folder-name-container .close-button:active, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:active, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:active, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:active, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:active { background-color: rgba(255, 255, 255, 0.3); } @@ -2598,12 +2788,6 @@ StWidget.focused .app-well-app-running-dot { margin-bottom: 18px; } -.app-folder-dialog-container { - padding: 12px; - width: 620px; - height: 620px; -} - .rename-folder-popup .rename-folder-popup-item { spacing: 6px; } @@ -2626,6 +2810,7 @@ StWidget.focused .app-well-app-running-dot { height: 10px; border-radius: 10px; background-color: white; + transition-duration: 400ms; } .apps-scroll-view { @@ -2639,10 +2824,6 @@ StWidget.focused .app-well-app-running-dot { icon-size: 8px; } -.page-navigation-hint { - width: 300px; -} - .page-navigation-hint.dnd { background: rgba(255, 255, 255, 0.1); } @@ -2668,6 +2849,11 @@ StWidget.focused .app-well-app-running-dot { height: 24px; border-radius: 9999px; color: rgba(255, 255, 255, 0.7); + background-color: transparent; +} + +.page-navigation-arrow > StIcon { + color: rgba(255, 255, 255, 0.85); } .page-navigation-arrow:insensitive { @@ -3124,11 +3310,15 @@ StWidget.focused .app-well-app-running-dot { padding: 16px 18px 20px !important; } -.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button { +.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .message .message-header .message-expand-button, .message .message-header .quick-settings .message-expand-button, +.quick-settings .message .message-header .message-close-button, +.message .message-header .quick-settings .message-close-button, .quick-settings .button { padding: 9px; } -.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .button > StIcon { +.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings .message-expand-button > StIcon, +.quick-settings .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings .message-close-button > StIcon, .quick-settings .button > StIcon { icon-size: 16px; } @@ -3302,18 +3492,24 @@ StWidget.focused .app-well-app-running-dot { icon-size: 16px; } -.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button { +.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button, .quick-slider .message .message-header .message-expand-button, .message .message-header .quick-slider .message-expand-button, +.quick-slider .message .message-header .message-close-button, +.message .message-header .quick-slider .message-close-button { min-width: 22px; min-height: 22px; background-color: transparent; color: rgba(0, 0, 0, 0.87) !important; } -.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover { +.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover, .quick-slider .message .message-header .message-expand-button:hover, .message .message-header .quick-slider .message-expand-button:hover, +.quick-slider .message .message-header .message-close-button:hover, +.message .message-header .quick-slider .message-close-button:hover { background-color: rgba(0, 0, 0, 0.06); } -.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active { +.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active, .quick-slider .message .message-header .message-expand-button:active, .message .message-header .quick-slider .message-expand-button:active, +.quick-slider .message .message-header .message-close-button:active, +.message .message-header .quick-slider .message-close-button:active { background-color: rgba(0, 0, 0, 0.12); } @@ -3366,7 +3562,9 @@ StWidget.focused .app-well-app-running-dot { spacing: 12px; } -.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button { +.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button, .quick-settings-system-item .message .message-header .message-expand-button, .message .message-header .quick-settings-system-item .message-expand-button, +.quick-settings-system-item .message .message-header .message-close-button, +.message .message-header .quick-settings-system-item .message-close-button { background-color: rgba(0, 0, 0, 0.06); color: rgba(0, 0, 0, 0.87); border-radius: 5px; @@ -3374,15 +3572,21 @@ StWidget.focused .app-well-app-running-dot { min-width: 22px; } -.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover { +.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover, .quick-settings-system-item .message .message-header .message-expand-button:hover, .message .message-header .quick-settings-system-item .message-expand-button:hover, +.quick-settings-system-item .message .message-header .message-close-button:hover, +.message .message-header .quick-settings-system-item .message-close-button:hover { background-color: rgba(0, 0, 0, 0.12); } -.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active { +.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active, .quick-settings-system-item .message .message-header .message-expand-button:active, .message .message-header .quick-settings-system-item .message-expand-button:active, +.quick-settings-system-item .message .message-header .message-close-button:active, +.message .message-header .quick-settings-system-item .message-close-button:active { background-color: rgba(0, 0, 0, 0.2); } -.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon { +.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon, .quick-settings-system-item .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings-system-item .message-expand-button > StIcon, +.quick-settings-system-item .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings-system-item .message-close-button > StIcon { -st-icon-style: symbolic; icon-size: 16px; } @@ -3666,15 +3870,15 @@ StWidget.focused .app-well-app-running-dot { color: rgba(0, 0, 0, 0.54); background-color: #ffffff; margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .login-dialog StEntry:focus, .unlock-dialog StEntry:focus { color: rgba(0, 0, 0, 0.87); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #1A73E8; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #1A73E8 !important; } .login-dialog StEntry:insensitive, @@ -4143,7 +4347,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left #dash .dash-item-container .app-well-app, #dashtodockContainer.right #dash .dash-item-container .app-well-app { - padding: 3px 6px !important; + padding: 2px 6px !important; } #dashtodockContainer.left #dash .show-apps, #dashtodockContainer.right #dash .show-apps { @@ -4156,11 +4360,11 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.left.extended #dash .show-apps, #dashtodockContainer.left.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.left.straight-corner #dash .show-apps, #dashtodockContainer.right.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.right.extended #dash .show-apps, #dashtodockContainer.right.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.right.straight-corner #dash .show-apps { - padding: 3px 10px !important; + padding: 2px 12px !important; } #dashtodockContainer.top #dash .dash-background, #dashtodockContainer.bottom #dash .dash-background { - padding: 10px 5px !important; + padding: 12px 6px !important; } #dashtodockContainer.top.shrink #dash .dash-background, #dashtodockContainer.bottom.shrink #dash .dash-background { @@ -4177,7 +4381,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.top.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.top.extended #dash .show-apps, #dashtodockContainer.top.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.top.straight-corner #dash .show-apps, #dashtodockContainer.bottom.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.extended #dash .show-apps, #dashtodockContainer.bottom.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.straight-corner #dash .show-apps { - padding: 10px 3px !important; + padding: 12px 2px !important; } #dashtodockContainer #dash { @@ -4186,7 +4390,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer #dash .dash-background { - background-color: #f3f3f3; + background-color: rgba(255, 255, 255, 0.75); background-clip: padding-box; } @@ -4242,7 +4446,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.transparent #dash .dash-background { - background-color: #f3f3f3; + background-color: rgba(255, 255, 255, 0.75); } #dashtodockContainer:overview #dash .dash-background { diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/gtk-dark.css index 6e393cd..109d8d6 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/gtk-dark.css @@ -1432,7 +1432,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { border-radius: 8px 8px 0 0; color: white; box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12); - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .titlebar:disabled { @@ -1984,7 +1984,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); background-clip: border-box; border: 1px solid rgba(255, 255, 255, 0.12); } @@ -2118,7 +2118,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: border-box; } @@ -4296,7 +4296,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(48, 48, 48, 0.95); border-radius: 0 0 8px 8px; - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd.unified { @@ -4304,11 +4304,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7512,8 +7512,6 @@ frame.raven-frame > border { .raven { background-color: #3C3C3C; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8013,7 +8011,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); background-color: #3C3C3C; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/gtk.css index 42f64df..ecd2b86 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-3.0/gtk.css @@ -1432,7 +1432,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { border-radius: 8px 8px 0 0; color: rgba(0, 0, 0, 0.87); box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12); - background-color: #F7F7F7; + background-color: rgba(247, 247, 247, 0.98); } .titlebar:disabled { @@ -1984,7 +1984,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); background-clip: border-box; border: 1px solid rgba(0, 0, 0, 0.12); } @@ -2118,7 +2118,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: padding-box; } @@ -4296,7 +4296,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(250, 250, 250, 0.95); border-radius: 0 0 8px 8px; - background-color: #FAFAFA; + background-color: rgba(250, 250, 250, 0.95); } .nautilus-window.background.csd.unified { @@ -4304,11 +4304,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #F7F7F7; + background-color: rgba(247, 247, 247, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #FAFAFA; + background-color: rgba(250, 250, 250, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7512,8 +7512,6 @@ frame.raven-frame > border { .raven { background-color: #FFFFFF; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8001,7 +7999,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/gtk-dark.css index e698ec6..efc633a 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/gtk-dark.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1741,7 +1741,7 @@ headerbar { min-height: 44px; margin: 0; padding: 0; - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } headerbar:disabled { @@ -1912,10 +1912,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2386,8 +2382,8 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 6px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #3C3C3C; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(60, 60, 60, 0.98); border-radius: 6px; color: white; border: 1px solid rgba(255, 255, 255, 0.12); @@ -2430,6 +2426,10 @@ popover.background toolbar { background-color: #3C3C3C; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2499,9 +2499,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 22px; min-width: 22px; padding: 3px 12px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(255, 255, 255, 0.7); @@ -2766,6 +2765,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4732,7 +4736,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4881,6 +4885,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 12px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4917,7 +4925,7 @@ weekgrid.current { } popover.events { - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); padding: 0; } @@ -5346,7 +5354,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5857,6 +5865,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5970,7 +5986,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6065,7 +6081,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6190,7 +6206,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6278,7 +6294,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 24px 6px 8 2; + margin: 24px 6px 8px 2px; border-spacing: 24px; } @@ -6819,12 +6835,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); color: white; } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6978,13 +6994,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); color: white; } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7017,6 +7033,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7171,6 +7193,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 9px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #3281EA; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 6px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #3281EA; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(255, 255, 255, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/gtk.css index ff73671..6fa094b 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/gtk-4.0/gtk.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1741,7 +1741,7 @@ headerbar { min-height: 44px; margin: 0; padding: 0; - background-color: #F7F7F7; + background-color: rgba(247, 247, 247, 0.98); } headerbar:disabled { @@ -1912,10 +1912,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2386,12 +2382,12 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 6px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #FFFFFF; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(255, 255, 255, 0.98); border-radius: 6px; color: rgba(0, 0, 0, 0.87); border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.12); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.12); } popover.background:backdrop > arrow, @@ -2430,6 +2426,10 @@ popover.background toolbar { background-color: #FFFFFF; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2499,9 +2499,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 22px; min-width: 22px; padding: 3px 12px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(0, 0, 0, 0.6); @@ -2766,6 +2765,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4732,7 +4736,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4881,6 +4885,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 12px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4917,7 +4925,7 @@ weekgrid.current { } popover.events { - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); padding: 0; } @@ -5346,7 +5354,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5857,6 +5865,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5970,7 +5986,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6065,7 +6081,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6190,7 +6206,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6278,7 +6294,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 24px 6px 8 2; + margin: 24px 6px 8px 2px; border-spacing: 24px; } @@ -6819,12 +6835,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#1A73E8, #FAFAFA, 30%); + background-color: mix(#1A73E8,#FAFAFA,0.7); color: rgba(0, 0, 0, 0.87); } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#1A73E8, #FAFAFA, 30%); + background-color: mix(#1A73E8,#FAFAFA,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6978,13 +6994,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#1A73E8, #FFFFFF, 30%); + background-color: mix(#1A73E8,#FFFFFF,0.7); color: rgba(0, 0, 0, 0.87); } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#1A73E8, #FFFFFF, 30%); + background-color: mix(#1A73E8,#FFFFFF,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7017,6 +7033,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7171,6 +7193,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 9px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #1A73E8; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #1A73E8; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 6px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #1A73E8; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #1A73E8; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(0, 0, 0, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/metacity-1/metacity-theme-2.xml b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/metacity-1/metacity-theme-2.xml index 088412d..010f669 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/metacity-1/metacity-theme-2.xml +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/metacity-1/metacity-theme-2.xml @@ -1,11 +1,11 @@ - Melawy + Fluent vinceliucie GPL 2020 - Melawy Metacity theme + Fluent Metacity theme diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/metacity-1/metacity-theme-3.xml b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/metacity-1/metacity-theme-3.xml index 90a08df..15c1671 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/metacity-1/metacity-theme-3.xml +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-Light/metacity-1/metacity-theme-3.xml @@ -1,11 +1,11 @@ - Melawy-round + Fluent-round vinceliucie GPL 2020 - Melawy-round Metacity theme + Fluent-round Metacity theme diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/cinnamon/cinnamon.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/cinnamon/cinnamon.css index ae3a170..0eb6057 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/cinnamon/cinnamon.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/cinnamon/cinnamon.css @@ -10,7 +10,7 @@ stage { min-height: 24px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); background-color: rgba(0, 0, 0, 0.04); } @@ -18,36 +18,36 @@ stage { .sound-button:focus { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover:focus { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .sound-button:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .sound-button:insensitive { color: rgba(0, 0, 0, 0.38); background-color: rgba(0, 0, 0, 0.04); - border-radius: 4px; + border-radius: 2px; } .notification-button, .notification-icon-button, .menu #notification .notification-button, .menu #notification .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button, #notification .notification-button, #notification .notification-icon-button, .calendar-today-home-button, .calendar-today-home-button-enabled { - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); background-color: transparent; } @@ -56,28 +56,28 @@ stage { .calendar-today-home-button-enabled:hover { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active, .calendar-today-home-button:active, .calendar-today-home-button-enabled:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive, .calendar-today-home-button:insensitive, .calendar-today-home-button-enabled:insensitive { color: rgba(0, 0, 0, 0.26); background-color: transparent; - border-radius: 4px; + border-radius: 2px; } .modal-dialog-button-box .modal-dialog-button { min-height: 24px; padding: 4px 20px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); } @@ -108,7 +108,7 @@ stage { selection-background-color: #1A73E8; selected-color: white; transition-duration: 300ms; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.87); border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.04); @@ -271,7 +271,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 4px; + border-radius: 2px; padding: 5px 12px; background-color: rgba(54, 54, 54, 0.9); color: white; @@ -300,8 +300,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-content { padding: 4px 0; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; - border-radius: 6px; + background-color: rgba(255, 255, 255, 0.98); + border-radius: 3px; margin: 4px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } @@ -351,7 +351,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: 4px 8px; spacing: 8px; - border-radius: 4px; + border-radius: 2px; margin: 0 4px; } @@ -395,7 +395,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); @@ -525,7 +525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 1em; padding: 0px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5), 0 0 16px rgba(0, 0, 0, 0.24); - background-color: #1F1F1F; + background-color: rgba(31, 31, 31, 0.8); } .panel-top .panel-button:hover, @@ -585,7 +585,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(54, 54, 54, 0.9); color: white; spacing: 25px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -601,7 +601,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, .expo-workspaces-name-entry#selected { height: 15px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -624,13 +624,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspace-thumbnail-frame { border: 4px solid rgba(255, 255, 255, 0); background-color: rgba(255, 255, 255, 0); - border-radius: 4px; + border-radius: 2px; } .expo-workspace-thumbnail-frame#active { border: 4px solid #1A73E8; background-color: black; - border-radius: 4px; + border-radius: 2px; } .expo-background { @@ -730,7 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; background-color: #FFFFFF; padding: 4px; padding-right: 0; @@ -845,7 +845,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { text-align: center; font-size: 14px; color: rgba(0, 0, 0, 0.87); - border-radius: 4px; + border-radius: 2px; } .calendar-day-base { @@ -930,7 +930,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; min-width: 350px; border: none; - border-radius: 4px; + border-radius: 2px; background-gradient-direction: vertical; background-gradient-start: rgba(0, 0, 0, 0.04); background-gradient-end: rgba(0, 0, 0, 0.04); @@ -940,7 +940,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-events-no-events-button { margin: 4px 0; padding: 4px; - border-radius: 4px; + border-radius: 2px; } .calendar-events-no-events-button:hover { @@ -983,7 +983,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-event-button { margin: 4px 0 4px 0; - border-radius: 4px; + border-radius: 2px; } .calendar-event-button:hover { @@ -1050,14 +1050,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 8px; + border-radius: 3px; padding: 8px; spacing-rows: 6px; spacing-columns: 6px; margin-from-right-edge-of-screen: 12px; width: 28em; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); margin: 7px 12px 17px 12px; } @@ -1068,7 +1068,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu #notification, .popup-menu #notification { border: none; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.05); box-shadow: none; margin: 0; @@ -1136,9 +1136,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); border: none; - border-radius: 4px; + border-radius: 2px; padding: 20px; } @@ -1152,7 +1152,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 4px; + border-radius: 2px; } .switcher-list .item-box:outlined { @@ -1226,7 +1226,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(46, 46, 46, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 4px; + border-radius: 2px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1251,7 +1251,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 4px 8px; background-color: rgba(54, 54, 54, 0.9); - border-radius: 4px; + border-radius: 2px; color: white; } @@ -1283,7 +1283,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 2px 8px; - border-radius: 4px; + border-radius: 2px; caret-color: white; selected-color: white; selection-background-color: #1A73E8; @@ -1412,7 +1412,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 4px; + border-radius: 2px; box-shadow: none; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); @@ -1436,7 +1436,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: white; padding: 5px; - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(54, 54, 54, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1452,17 +1452,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { transition-duration: 300; background-color: rgba(0, 0, 0, 0.05); border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button { padding: 6px; border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button:hover { - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.1); } @@ -1486,7 +1486,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 4px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1498,7 +1498,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); padding: 4px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1516,7 +1516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu StScrollView.menu-application-button { padding: 2px 0; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.6); } @@ -1525,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; spacing: 0; margin: 0 2px; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); } @@ -1557,7 +1557,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 4px; - border-radius: 4px; + border-radius: 2px; } .menu-category-button-selected { @@ -1567,7 +1567,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button-hover, .menu-category-button-selected { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .menu-category-button-greyed { @@ -1647,12 +1647,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 4px; + border-radius: 2px; color: #1A73E8; } .osd-window .level-bar { - border-radius: 4px; + border-radius: 2px; background-color: #1A73E8; } @@ -1800,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0F9D58; background-gradient-end: #0F9D58; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -1814,7 +1814,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 4px; border: none; background-color: #FFFFFF; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.87); box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1830,15 +1830,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu { padding: 4px; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; - border-radius: 6px; + background-color: rgba(255, 255, 255, 0.98); + border-radius: 3px; margin: 4px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } .grouped-window-list-thumbnail-menu .item-box { padding: 4px; - border-radius: 4px; + border-radius: 2px; spacing: 4px; margin: 1px; } @@ -1923,7 +1923,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0F9D58; background-gradient-end: #0F9D58; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -2004,7 +2004,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 0; margin-top: 6px; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } @@ -2043,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 4px; background-color: rgba(0, 0, 0, 0.5); border: none; - border-radius: 0 0 4px 4px; + border-radius: 0 0 2px 2px; color: white; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gnome-shell/assets/menu.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gnome-shell/assets/menu.svg index 12f85d3..fa3dc0b 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gnome-shell/assets/menu.svg +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gnome-shell/assets/menu.svg @@ -73,7 +73,7 @@ d="M 14 3 C 9.0140007 3 5 7.0140007 5 12 L 5 100 C 5 104.986 9.0140007 109 14 109 L 102 109 C 106.986 109 111 104.986 111 100 L 111 12 C 111 7.0140007 106.986 3 102 3 L 14 3 z M 14 4 L 102 4 C 106.432 4 110 7.5680012 110 12 L 110 100 C 110 104.432 106.432 108 102 108 L 14 108 C 9.5680012 108 6 104.432 6 100 L 6 12 C 6 7.5680012 9.5680012 4 14 4 z " transform="scale(0.26458333)" /> StIcon { - icon-size: 48px; + icon-size: 96px; margin-bottom: 6px; -st-icon-style: symbolic; } .message-list-sections { - spacing: 4px; - margin: 0; - padding-bottom: 4px; + spacing: 8px; } .message-list-sections:ltr { @@ -1045,13 +1168,24 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section, .message-list-section-list { - spacing: 4px; + spacing: 8px; } .message-list-controls { - margin: 4px 8px 0; - padding: 2px; - spacing: 8px; + padding: 8px; + padding-bottom: 4px; + spacing: 4px; +} + +.message-list-controls .dnd-button { + border-width: 2px; + border-color: transparent; + border-radius: 32px; + border-style: solid; +} + +.message-list-controls .dnd-button:focus { + border-color: rgba(26, 115, 232, 0.6); } .message { @@ -1059,97 +1193,152 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 5px; color: rgba(0, 0, 0, 0.54); text-shadow: none; + padding: 0; + margin: 2px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.15); - border: 1px solid rgba(0, 0, 0, 0.12); + background-color: rgba(255, 255, 255, 0.95); + border: 1px solid transparent; +} + +.message:hover, .message:focus, .message:active { + background-color: #ffffff; } .popup-menu .message { - box-shadow: none; margin: 0 0 2px; + box-shadow: none; + background-color: rgba(255, 255, 255, 0.35); + border-radius: 5px; + color: rgba(0, 0, 0, 0.54); + border: 1px solid rgba(0, 0, 0, 0.12); } -.message:hover, .message:focus { +.popup-menu .message:hover, .popup-menu .message:focus { background-color: rgba(0, 0, 0, 0.06); border-color: rgba(0, 0, 0, 0.15); } -.message:active { +.popup-menu .message:active { background-color: rgba(0, 0, 0, 0.08); } -.message .message-icon-bin { - padding: 12px; - padding-right: 4px; +.message:ltr { + padding-right: -2px; } -.message .message-icon-bin:rtl { - padding-left: 4px; +.message:rtl { + padding-left: -2px; } -.message .message-icon-bin > StIcon { - icon-size: 40px; +.message .message-header { + padding: 0 0.409em; + margin: 4px; + margin-bottom: 0; + spacing: 4px; + color: rgba(0, 0, 0, 0.38); +} + +.message .message-header .message-source-icon { + icon-size: 1.091em; -st-icon-style: symbolic; } -.message .message-icon-bin > .fallback-app-icon { - width: 32px; - height: 32px; +.message .message-header .message-header-content { + spacing: 4px; + min-height: 1.637em; + padding-bottom: 4px; } -.message .message-content { - padding: 8px; - spacing: 2px; - margin-bottom: 4px; - color: rgba(0, 0, 0, 0.54); -} - -.message .message-title { +.message .message-header .message-header-content .message-source-title { font-weight: bold; - padding-top: 0.57em; } -.message .message-secondary-bin { - padding: 0 4px; +.message .message-header .message-header-content .event-time { + color: rgba(0, 0, 0, 0.38); + padding-bottom: 0.068em; } -.message .message-secondary-bin > .event-time { - color: rgba(0, 0, 0, 0.54); - font-size: 0.9em; - padding-bottom: 0.13em; -} - -.message .message-secondary-bin > .event-time:ltr { +.message .message-header .message-header-content .event-time:ltr { text-align: right; } -.message .message-secondary-bin > .event-time:rtl { +.message .message-header .message-header-content .event-time:rtl { text-align: left; } -.message .message-close-button { - color: rgba(0, 0, 0, 0.54); - padding: 1px; - height: 24px; - width: 24px; - border-radius: 9999px; +.message .message-header .message-expand-button, +.message .message-header .message-close-button { + color: rgba(0, 0, 0, 0.87); + background-color: rgba(0, 0, 0, 0); + padding: 4px; } -.message .message-close-button:hover, .message .message-close-button:focus { - color: rgba(0, 0, 0, 0.87); +.message .message-header .message-expand-button:hover, +.message .message-header .message-close-button:hover { background-color: rgba(0, 0, 0, 0.06); } -.message .message-close-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); +.message .message-header .message-expand-button:active, .message .message-header .message-expand-button:active:hover, +.message .message-header .message-close-button:active, +.message .message-header .message-close-button:active:hover { + background-color: rgba(0, 0, 0, 0.11); } -.message .message-close-button:insensitive { - color: rgba(0, 0, 0, 0.26); +.message .message-header .message-expand-button:insensitive, +.message .message-header .message-close-button:insensitive { + background-color: rgba(0, 0, 0, 0); } -.message .message-body { - color: rgba(0, 0, 0, 0.38); +.message .message-header .message-expand-button { + padding: 6px; +} + +.message .message-header .message-expand-button:ltr { + margin-right: 4px; +} + +.message .message-header .message-expand-button:rtl { + margin-left: 4px; +} + +.message .message-box { + padding: 4px; + margin: 4px; + margin-top: 0; + spacing: 4px; +} + +.message .message-box .message-icon { + icon-size: 48px; + -st-icon-style: symbolic; +} + +.message .message-box .message-icon:ltr { + margin-right: 4px; +} + +.message .message-box .message-icon:rtl { + margin-left: 4px; +} + +.message .message-box .message-icon.message-themed-icon { + border-radius: 9999px; + background-color: rgba(0, 0, 0, 0.07); + icon-size: 16px; + min-width: 48px; + min-height: 48px; +} + +.message .message-box:first-child { + margin-top: 8px; +} + +.message .message-box .message-content { + spacing: 2px; +} + +.message .message-box .message-content .message-title { + font-weight: bold; } .url-highlighter { @@ -1158,10 +1347,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Media Controls */ .message-media-control { - margin: 20px 4px; - padding: 8px; + margin: 4px 0; + padding: 0 8px; border-radius: 9999px; color: rgba(0, 0, 0, 0.54); + border: none; } .message-media-control:hover, .message-media-control:focus { @@ -1178,33 +1368,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.26); } -.message-media-control:last-child:ltr { - margin-right: 16px; - padding-right: 8px; +.message-media-control StIcon { + icon-size: 16px; } -.message-media-control:last-child:rtl { - margin-left: 16px; - padding-left: 8px; +.media-message .message-icon { + border-radius: 5px !important; } -.media-message-cover-icon { - icon-size: 48px !important; - border-radius: 5px; - border: none; -} - -.media-message-cover-icon.fallback { - color: rgba(0, 0, 0, 0.38); - background-color: rgba(0, 0, 0, 0.06); - border: none; - border-radius: 5px; +.media-message .message-icon.message-themed-icon { icon-size: 32px !important; - padding: 8px; } .candidate-popup-content { - background-color: #ffffff; + background-color: rgba(255, 255, 255, 0.95); border-radius: 8px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.25) !important; margin: 2px 8px 11px; @@ -1277,126 +1454,87 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { min-height: 64px; width: 34em; - font-size: 1em; - margin: 6px 8px 12px; - border-radius: 5px; - color: rgba(0, 0, 0, 0.87); - background-color: rgba(255, 255, 255, 0.92); - border: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.35); + margin: 4px; + border-radius: 12px; } -.notification-banner:hover { - background-color: rgba(255, 255, 255, 0.95); -} - -.notification-banner:focus { - background-color: #ffffff; -} - -.notification-banner .notification-actions { +.notification-buttons-bin { spacing: 0; } -.notification-banner .notification-button { +.notification-button { min-height: 40px; padding: 0 16px; - background-color: transparent; - color: rgba(0, 0, 0, 0.54); + background-color: transparent !important; + color: rgba(0, 0, 0, 0.54) !important; font-weight: 500; - border-width: 0; - border-top: 1px solid rgba(0, 0, 0, 0.12); + border-top: 1px solid rgba(0, 0, 0, 0.12) !important; } -.notification-banner .notification-button:first-child { - border-radius: 0 0 0 5px !important; -} - -.notification-banner .notification-button:last-child { - border-radius: 0 0 5px 0 !important; -} - -.notification-banner .notification-button:only-child, .notification-banner .notification-button:first-child:last-child { - border-radius: 0 0 5px 5px !important; -} - -.notification-banner .notification-button:focus { - background-color: transparent; - color: rgba(0, 0, 0, 0.54); +.notification-button:focus { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.54) !important; box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.06) !important; } -.notification-banner .notification-button:hover, .notification-banner .notification-button:focus:hover { - background-color: rgba(0, 0, 0, 0.06); - color: rgba(0, 0, 0, 0.87); +.notification-button:hover { + background-color: rgba(0, 0, 0, 0.06) !important; + color: rgba(0, 0, 0, 0.87) !important; box-shadow: none !important; } -.notification-banner .notification-button:active { - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); +.notification-button:active, .notification-button:checked { + background-color: rgba(0, 0, 0, 0.2) !important; + color: rgba(0, 0, 0, 0.87) !important; } -.summary-source-counter { - font-size: 1em; - font-weight: bold; - height: 1.6em; - width: 1.6em; - -shell-counter-overlap-x: 3px; - -shell-counter-overlap-y: 3px; - background-color: #1A73E8; - color: rgba(255, 255, 255, 0.85); - border: 2px solid #1A73E8; - box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); - border-radius: 0.9em; +.notification-button:insensitive { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.26) !important; } -.chat-body { - spacing: 5px; +.notification-button:first-child:ltr { + border-radius: 0 0 0 12px; } -.chat-response { - margin: 5px; +.notification-button:last-child:ltr { + border-radius: 0 0 12px; + margin-right: 0 !important; } -.chat-log-message { - color: rgba(0, 0, 0, 0.54); +.notification-button:first-child:rtl { + border-radius: 0 0 12px; } -.chat-new-group { - padding-top: 1em; +.notification-button:last-child:rtl { + border-radius: 0 0 0 12px; + margin-left: 0 !important; } -.chat-received { - padding-left: 4px; +.notification-button:first-child:last-child { + border-radius: 0 0 12px 12px; + margin-left: 0 !important; + margin-right: 0 !important; } -.chat-received:rtl { - padding-left: 0px; - padding-right: 4px; +.popup-menu .notification-button:first-child:ltr { + border-radius: 0 0 0 5px; } -.chat-sent { - padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); +.popup-menu .notification-button:last-child:ltr { + border-radius: 0 0 5px; } -.chat-sent:rtl { - padding-left: 0; - padding-right: 18pt; +.popup-menu .notification-button:first-child:rtl { + border-radius: 0 0 5px; } -.chat-meta-message { - font-weight: bold; - padding-left: 4px; - font-size: 9pt; - font-weight: 400; - color: rgba(0, 0, 0, 0.38); +.popup-menu .notification-button:last-child:rtl { + border-radius: 0 0 0 5px; } -.chat-meta-message:rtl { - padding-left: 0; - padding-right: 4px; +.popup-menu .notification-button:first-child:last-child { + border-radius: 0 0 5px 5px; } .hotplug-notification-item { @@ -1903,21 +2041,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Top Bar */ #panel .panel-button#panelActivities { - background-image: url("assets/activities.svg"); - background-position: center center; - background-repeat: no-repeat; - background-size: auto; - color: transparent !important; - font-size: 0; - box-shadow: none; + -natural-hpadding: 10px; } -#panel .panel-button#panelActivities * { - width: 32px; +#panel .panel-button#panelActivities StBoxLayout { + spacing: 4px; } #panel .panel-button#panelActivities .workspace-dot { - background-color: transparent; + border-radius: 9999px; + min-width: 8px; + min-height: 8px; + background-color: #FFFFFF; } #panel { @@ -1927,10 +2062,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; padding: 0 2px !important; - background-color: #202020; - border-radius: 12px; - margin: 2px; - height: 34px; + background-color: rgba(0, 0, 0, 0.5); + margin: 0; + border-radius: 0; + height: 30px; } #panel #panelLeft, #panel #panelCenter { @@ -1939,7 +2074,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #202020; + -panel-corner-background-color: rgba(0, 0, 0, 0.5); -panel-corner-border-width: 0; -panel-corner-border-color: transparent; -panel-corner-opacity: 0; @@ -1963,6 +2098,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; } +#panel .panel-button.clock-display { + border: 1px solid transparent !important; + box-shadow: inset 0 1px transparent !important; +} + +#panel .panel-button.clock-display:hover { + color: rgba(255, 255, 255, 0.75); + background-color: rgba(255, 255, 255, 0.1) !important; +} + +#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:checked, #panel .panel-button.clock-display:focus { + color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.15) !important; +} + #panel .panel-button.clock-display .clock { color: rgba(255, 255, 255, 0.75); transition-duration: 150ms; @@ -1970,6 +2120,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; } +#panel .panel-button.clock-display .messages-indicator { + icon-size: 1.091em; +} + #panel .panel-button:hover { color: rgba(255, 255, 255, 0.75); background-color: rgba(255, 255, 255, 0.1); @@ -2030,10 +2184,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: transparent; } -#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { - color: rgba(255, 255, 255, 0.7); -} - #panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel.lock-screen .panel-button:hover, #panel:overview .panel-button:hover { background-color: rgba(255, 255, 255, 0.15); } @@ -2047,6 +2197,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } +#panel.unlock-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:hover { + background-color: rgba(255, 255, 255, 0.15) !important; +} + +#panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:checked, #panel.unlock-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:focus { + background-color: rgba(255, 255, 255, 0.3) !important; +} + +#panel.unlock-screen .panel-button.clock-display:hover, #panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:overview, #panel.unlock-screen .panel-button.clock-display:focus, #panel.unlock-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:overview, #panel.login-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:overview, #panel.lock-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:overview, #panel:overview .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:checked { + border: 1px solid rgba(0, 0, 0, 0.12) !important; + box-shadow: inset 0 1px rgba(255, 255, 255, 0.1) !important; +} + +#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { + color: rgba(255, 255, 255, 0.7); +} + #panel.unlock-screen .panel-button#panelActivities, #panel.login-screen .panel-button#panelActivities, #panel.lock-screen .panel-button#panelActivities, #panel:overview .panel-button#panelActivities { box-shadow: none; border: none; @@ -2057,6 +2224,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.15); } +#panel.unlock-screen .panel-button#panelActivities .workspace-dot, #panel.login-screen .panel-button#panelActivities .workspace-dot, #panel.lock-screen .panel-button#panelActivities .workspace-dot, #panel:overview .panel-button#panelActivities .workspace-dot { + background-color: rgba(255, 255, 255, 0.85); +} + #panel.unlock-screen .panel-corner, #panel.login-screen .panel-corner, #panel.lock-screen .panel-corner, #panel:overview .panel-corner { -panel-corner-opacity: 0; -panel-corner-radius: 0; @@ -2069,43 +2240,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 4px !important; } -#panel Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_ui_panel_ActivitiesButton.panel-button { - border-radius: 12px 0 0 12px !important; -} - -#panel Gjs_AggregateMenu.panel-button, -#panel Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 0 12px 12px 0 !important; -} - -#panel:overview Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel:overview Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel:overview Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel:overview Gjs_ui_panel_ActivitiesButton.panel-button, -#panel:overview Gjs_AggregateMenu.panel-button, -#panel:overview Gjs_ui_panel_AggregateMenu.panel-button, #panel.unlock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.unlock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.unlock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.unlock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.unlock-screen Gjs_AggregateMenu.panel-button, -#panel.unlock-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.login-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.login-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.login-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.login-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.login-screen Gjs_AggregateMenu.panel-button, -#panel.login-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.lock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.lock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.lock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.lock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.lock-screen Gjs_AggregateMenu.panel-button, -#panel.lock-screen Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 5px !important; -} - #panel Gjs_ArcMenu_ApplicationsButton.panel-button, #panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, #panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, @@ -2216,18 +2350,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.54); background-color: #ffffff; margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .search-entry:hover { - border: 2px solid rgba(0, 0, 0, 0.2); + border: 2px solid rgba(0, 0, 0, 0.2) !important; } .search-entry:focus { color: rgba(0, 0, 0, 0.87); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #1A73E8; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #1A73E8 !important; } .search-entry:insensitive { @@ -2254,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { caret-color: rgba(0, 0, 0, 0.75); color: rgba(0, 0, 0, 0.75); background-color: rgba(255, 255, 255, 0.75) !important; - border-color: transparent; - box-shadow: none; + border: none !important; + box-shadow: none !important; } #overview .search-entry:hover { @@ -2265,9 +2399,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #overview .search-entry:focus { color: rgba(0, 0, 0, 0.85); - border-color: transparent; background-color: rgba(255, 255, 255, 0.95) !important; - border: none; + border: none !important; selection-background-color: #1A73E8; selected-color: #FFFFFF !important; } @@ -2285,17 +2418,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Search */ +#searchResults { + margin: 0 4px; +} + #searchResultsContent { - max-width: 1024px; - spacing: 4px; + max-width: 1044px; } .search-section { - spacing: 4px; + spacing: 8px; } .search-section .search-section-separator { - height: 0; + height: 4px; background-color: transparent; } @@ -2314,21 +2450,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 12px; } -.list-search-result:focus, .search-provider-icon:focus, .list-search-result:hover, .search-provider-icon:hover, .list-search-result:selected, .search-provider-icon:selected { - background-color: rgba(255, 255, 255, 0.15); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - transition-duration: 100ms; -} - -.list-search-result:active, .search-provider-icon:active, .list-search-result:checked, .search-provider-icon:checked { - background-color: rgba(255, 255, 255, 0.3); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); +.search-statustext { + color: rgba(255, 255, 255, 0.7); } .grid-search-results { spacing: 24px; + margin: 0 6px; +} + +.search-provider-icon:ltr { + margin-right: 2px; +} + +.search-provider-icon:rtl { + margin-left: 2px; } .search-provider-icon .list-search-provider-content { @@ -2337,7 +2473,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .search-provider-icon .list-search-provider-content .list-search-provider-details { width: 120px; - margin-top: 0; color: rgba(255, 255, 255, 0.7); } @@ -2359,44 +2494,102 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash */ #dash { - font-size: 1em; - margin-top: 12px; - padding: 0 10px; + margin-top: 6px; } -#dash .placeholder { +#dash .dash-background { + background-color: rgba(255, 255, 255, 0.2); + border-radius: 16px; + padding-top: 8px; + padding-bottom: 8px; + padding-left: 7px; + padding-right: 7px; +} + +#dash .dash-item-container .placeholder { background-image: none; background-size: contain; height: 32px; } -#dash .empty-dash-drop-target { +#dash .dash-item-container .empty-dash-drop-target { width: 32px; height: 32px; } -#dash .overview-icon { - padding: 5px; - border-radius: 8px; +#dash .dash-item-container .show-apps, +#dash .dash-item-container .overview-tile, +#dash .dash-item-container .grid-search-result, +#dash .dash-item-container .search-provider-icon, +#dash .dash-item-container .list-search-result { + margin: 0 1px; + padding-bottom: 6px; } -.dash-background { - background-color: rgba(255, 255, 255, 0.2); - margin-bottom: 18px; - padding: 10px; - border-radius: 18px; +#dash .dash-item-container .show-apps .overview-icon, +#dash .dash-item-container .overview-tile .overview-icon, +#dash .dash-item-container .grid-search-result .overview-icon, +#dash .dash-item-container .search-provider-icon .overview-icon, +#dash .dash-item-container .list-search-result .overview-icon { + background-color: transparent; } -.dash-item-container .app-well-app, .show-apps { - padding: 10px 3px 28px; -} - -.dash-separator { - width: 1px; - margin: 0 8px 18px; +#dash .dash-item-container .show-apps:focus .overview-icon, +#dash .dash-item-container .overview-tile:focus .overview-icon, +#dash .dash-item-container .grid-search-result:focus .overview-icon, +#dash .dash-item-container .search-provider-icon:focus .overview-icon, +#dash .dash-item-container .list-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.15); } +#dash .dash-item-container .show-apps:hover .overview-icon, +#dash .dash-item-container .overview-tile:hover .overview-icon, +#dash .dash-item-container .grid-search-result:hover .overview-icon, +#dash .dash-item-container .search-provider-icon:hover .overview-icon, +#dash .dash-item-container .list-search-result:hover .overview-icon { + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-item-container .show-apps:active .overview-icon, +#dash .dash-item-container .overview-tile:active .overview-icon, +#dash .dash-item-container .grid-search-result:active .overview-icon, +#dash .dash-item-container .search-provider-icon:active .overview-icon, +#dash .dash-item-container .list-search-result:active .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:checked .overview-icon, +#dash .dash-item-container .overview-tile:checked .overview-icon, +#dash .dash-item-container .grid-search-result:checked .overview-icon, +#dash .dash-item-container .search-provider-icon:checked .overview-icon, +#dash .dash-item-container .list-search-result:checked .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:insensitive .overview-icon, +#dash .dash-item-container .overview-tile:insensitive .overview-icon, +#dash .dash-item-container .grid-search-result:insensitive .overview-icon, +#dash .dash-item-container .search-provider-icon:insensitive .overview-icon, +#dash .dash-item-container .list-search-result:insensitive .overview-icon { + background-color: transparent; +} + +#dash .dash-item-container .app-grid-running-dot { + margin-bottom: 11px; +} + +#dash .dash-separator { + width: 1px; + margin-left: 2px; + margin-right: 2px; + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-separator, +#dash .dash-background { + margin-bottom: 6px; +} + .dash-label { border-radius: 5px; padding: 4px 8px; @@ -2406,46 +2599,37 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; text-align: center; - -y-offset: 10px; + -y-offset: 2px; } /* App Grid */ - -.show-apps .overview-icon, -.app-well-app .overview-icon, -.grid-search-result .overview-icon, .search-provider-icon, .list-search-result { - color: rgba(255, 255, 255, 0.85); - border-radius: 10px; - padding: 6px; - border: 1px solid transparent; - box-shadow: inset 0 1px transparent; - transition-duration: 150ms; - text-align: center; -} - .icon-grid { row-spacing: 12px; column-spacing: 12px; - max-row-spacing: 72px; - max-column-spacing: 72px; + max-row-spacing: 36px; + max-column-spacing: 36px; page-padding-top: 24px; page-padding-bottom: 24px; - page-padding-left: 12px; - page-padding-right: 12px; + page-padding-left: 18px; + page-padding-right: 18px; } /* App Icons */ +.overview-tile, .grid-search-result, .search-provider-icon, .list-search-result { + border-radius: 24px; + padding: 12px; + spacing: 6px; + transition-duration: 150ms; + text-align: center; + background-color: transparent; + color: rgba(255, 255, 255, 0.85); + border: 1px solid transparent; + box-shadow: inset 0 1px transparent; +} -.show-apps:hover .overview-icon, -.show-apps:focus .overview-icon, -.show-apps:selected .overview-icon, -.app-well-app:hover .overview-icon, -.app-well-app:focus .overview-icon, -.app-well-app:selected .overview-icon, -.grid-search-result:hover .overview-icon, -.grid-search-result:focus .overview-icon, -.grid-search-result:selected .overview-icon { +.overview-tile:hover, .grid-search-result:hover, .search-provider-icon:hover, .list-search-result:hover, .overview-tile:focus, .grid-search-result:focus, .search-provider-icon:focus, .list-search-result:focus, .overview-tile:highlighted, .grid-search-result:highlighted, .search-provider-icon:highlighted, .list-search-result:highlighted, .overview-tile:selected, .grid-search-result:selected, .search-provider-icon:selected, .list-search-result:selected { background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.85); transition-duration: 0ms; border-image: none; background-image: none; @@ -2453,34 +2637,43 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps:active .overview-icon, -.show-apps:checked .overview-icon, -.app-well-app:active .overview-icon, -.app-well-app:checked .overview-icon, -.grid-search-result:active .overview-icon, -.grid-search-result:checked .overview-icon { +.overview-tile:active, .grid-search-result:active, .search-provider-icon:active, .list-search-result:active, .overview-tile:checked, .grid-search-result:checked, .search-provider-icon:checked, .list-search-result:checked { background-color: rgba(255, 255, 255, 0.15); transition-duration: 150ms; + color: rgba(255, 255, 255, 0.85); border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps .overview-icon.overview-icon-with-label, -.app-well-app .overview-icon.overview-icon-with-label, -.grid-search-result .overview-icon.overview-icon-with-label { - padding: 10px 8px 5px 8px; -} - - -.show-apps .overview-icon.overview-icon-with-label > StBoxLayout, -.app-well-app .overview-icon.overview-icon-with-label > StBoxLayout, -.grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout { +.overview-tile .overview-icon.overview-icon-with-label > StBoxLayout, .grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout, .search-provider-icon .overview-icon.overview-icon-with-label > StBoxLayout, .list-search-result .overview-icon.overview-icon-with-label > StBoxLayout { spacing: 4px; } -.app-well-app-running-dot { +.app-folder { + background-color: rgba(255, 255, 255, 0.13); +} + +.app-folder:focus { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:hover { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:active { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:highlighted, .app-folder:selected, .app-folder:checked { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:insensitive { + background-color: transparent; +} + +.app-grid-running-dot { width: 6px; height: 3px; border-radius: 2px; @@ -2488,33 +2681,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin-bottom: 1px; } -StWidget.focused .app-well-app-running-dot { +StWidget.focused .app-grid-running-dot { width: 18px; background-color: #1A73E8; } -/* App Folders */ -.app-well-app.app-folder { - background: none; - border-radius: 10px; -} - -.app-well-app.app-folder .overview-icon { - background-color: rgba(255, 255, 255, 0.13); - border-radius: 10px; -} - -.app-well-app.app-folder:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.15); -} - -.app-well-app.app-folder:active .overview-icon { - background-color: rgba(255, 255, 255, 0.3); +.app-folder-dialog-container { + padding-top: 30px; } .app-folder-dialog { + width: 720px; + height: 720px; border-radius: 20px; background-color: rgba(34, 34, 34, 0.95); + color: white; border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } @@ -2562,7 +2743,9 @@ StWidget.focused .app-well-app-running-dot { color: rgba(255, 255, 255, 0.7); } -.app-folder-dialog .folder-name-container .edit-folder-button { +.app-folder-dialog .folder-name-container .icon-button, .app-folder-dialog .folder-name-container .background-app-item .close-button, .background-app-item .app-folder-dialog .folder-name-container .close-button, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button { background-color: rgba(255, 255, 255, 0.15); color: rgba(255, 255, 255, 0.7); border: none; @@ -2572,15 +2755,23 @@ StWidget.focused .app-well-app-running-dot { border-radius: 18px; } -.app-folder-dialog .folder-name-container .edit-folder-button > StIcon { +.app-folder-dialog .folder-name-container .icon-button > StIcon, .app-folder-dialog .folder-name-container .background-app-item .close-button > StIcon, .background-app-item .app-folder-dialog .folder-name-container .close-button > StIcon, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button > StIcon, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button > StIcon, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button > StIcon, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button > StIcon { icon-size: 16px; } -.app-folder-dialog .folder-name-container .edit-folder-button:hover { +.app-folder-dialog .folder-name-container .icon-button:hover, .app-folder-dialog .folder-name-container .background-app-item .close-button:hover, .background-app-item .app-folder-dialog .folder-name-container .close-button:hover, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:hover, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:hover, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:hover, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:hover { background-color: rgba(255, 255, 255, 0.15); } -.app-folder-dialog .folder-name-container .edit-folder-button:checked, .app-folder-dialog .folder-name-container .edit-folder-button:active { +.app-folder-dialog .folder-name-container .icon-button:checked, .app-folder-dialog .folder-name-container .background-app-item .close-button:checked, .background-app-item .app-folder-dialog .folder-name-container .close-button:checked, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:checked, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:checked, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:checked, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:checked, .app-folder-dialog .folder-name-container .icon-button:active, .app-folder-dialog .folder-name-container .background-app-item .close-button:active, .background-app-item .app-folder-dialog .folder-name-container .close-button:active, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:active, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:active, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:active, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:active { background-color: rgba(255, 255, 255, 0.3); } @@ -2597,12 +2788,6 @@ StWidget.focused .app-well-app-running-dot { margin-bottom: 18px; } -.app-folder-dialog-container { - padding: 12px; - width: 620px; - height: 620px; -} - .rename-folder-popup .rename-folder-popup-item { spacing: 4px; } @@ -2625,6 +2810,7 @@ StWidget.focused .app-well-app-running-dot { height: 10px; border-radius: 10px; background-color: white; + transition-duration: 400ms; } .apps-scroll-view { @@ -2638,10 +2824,6 @@ StWidget.focused .app-well-app-running-dot { icon-size: 8px; } -.page-navigation-hint { - width: 300px; -} - .page-navigation-hint.dnd { background: rgba(255, 255, 255, 0.1); } @@ -2667,6 +2849,11 @@ StWidget.focused .app-well-app-running-dot { height: 24px; border-radius: 9999px; color: rgba(255, 255, 255, 0.7); + background-color: transparent; +} + +.page-navigation-arrow > StIcon { + color: rgba(255, 255, 255, 0.85); } .page-navigation-arrow:insensitive { @@ -3123,11 +3310,15 @@ StWidget.focused .app-well-app-running-dot { padding: 12px 14px 16px !important; } -.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button { +.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .message .message-header .message-expand-button, .message .message-header .quick-settings .message-expand-button, +.quick-settings .message .message-header .message-close-button, +.message .message-header .quick-settings .message-close-button, .quick-settings .button { padding: 6px; } -.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .button > StIcon { +.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings .message-expand-button > StIcon, +.quick-settings .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings .message-close-button > StIcon, .quick-settings .button > StIcon { icon-size: 16px; } @@ -3301,18 +3492,24 @@ StWidget.focused .app-well-app-running-dot { icon-size: 16px; } -.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button { +.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button, .quick-slider .message .message-header .message-expand-button, .message .message-header .quick-slider .message-expand-button, +.quick-slider .message .message-header .message-close-button, +.message .message-header .quick-slider .message-close-button { min-width: 22px; min-height: 22px; background-color: transparent; color: rgba(0, 0, 0, 0.87) !important; } -.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover { +.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover, .quick-slider .message .message-header .message-expand-button:hover, .message .message-header .quick-slider .message-expand-button:hover, +.quick-slider .message .message-header .message-close-button:hover, +.message .message-header .quick-slider .message-close-button:hover { background-color: rgba(0, 0, 0, 0.06); } -.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active { +.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active, .quick-slider .message .message-header .message-expand-button:active, .message .message-header .quick-slider .message-expand-button:active, +.quick-slider .message .message-header .message-close-button:active, +.message .message-header .quick-slider .message-close-button:active { background-color: rgba(0, 0, 0, 0.12); } @@ -3365,7 +3562,9 @@ StWidget.focused .app-well-app-running-dot { spacing: 8px; } -.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button { +.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button, .quick-settings-system-item .message .message-header .message-expand-button, .message .message-header .quick-settings-system-item .message-expand-button, +.quick-settings-system-item .message .message-header .message-close-button, +.message .message-header .quick-settings-system-item .message-close-button { background-color: rgba(0, 0, 0, 0.06); color: rgba(0, 0, 0, 0.87); border-radius: 5px; @@ -3373,15 +3572,21 @@ StWidget.focused .app-well-app-running-dot { min-width: 22px; } -.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover { +.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover, .quick-settings-system-item .message .message-header .message-expand-button:hover, .message .message-header .quick-settings-system-item .message-expand-button:hover, +.quick-settings-system-item .message .message-header .message-close-button:hover, +.message .message-header .quick-settings-system-item .message-close-button:hover { background-color: rgba(0, 0, 0, 0.12); } -.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active { +.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active, .quick-settings-system-item .message .message-header .message-expand-button:active, .message .message-header .quick-settings-system-item .message-expand-button:active, +.quick-settings-system-item .message .message-header .message-close-button:active, +.message .message-header .quick-settings-system-item .message-close-button:active { background-color: rgba(0, 0, 0, 0.2); } -.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon { +.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon, .quick-settings-system-item .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings-system-item .message-expand-button > StIcon, +.quick-settings-system-item .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings-system-item .message-close-button > StIcon { -st-icon-style: symbolic; icon-size: 16px; } @@ -3665,15 +3870,15 @@ StWidget.focused .app-well-app-running-dot { color: rgba(0, 0, 0, 0.54); background-color: #ffffff; margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .login-dialog StEntry:focus, .unlock-dialog StEntry:focus { color: rgba(0, 0, 0, 0.87); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #1A73E8; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #1A73E8 !important; } .login-dialog StEntry:insensitive, @@ -4142,7 +4347,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left #dash .dash-item-container .app-well-app, #dashtodockContainer.right #dash .dash-item-container .app-well-app { - padding: 3px 4px !important; + padding: 1px 4px !important; } #dashtodockContainer.left #dash .show-apps, #dashtodockContainer.right #dash .show-apps { @@ -4155,11 +4360,11 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.left.extended #dash .show-apps, #dashtodockContainer.left.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.left.straight-corner #dash .show-apps, #dashtodockContainer.right.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.right.extended #dash .show-apps, #dashtodockContainer.right.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.right.straight-corner #dash .show-apps { - padding: 3px 10px !important; + padding: 1px 8px !important; } #dashtodockContainer.top #dash .dash-background, #dashtodockContainer.bottom #dash .dash-background { - padding: 10px 5px !important; + padding: 8px 4px !important; } #dashtodockContainer.top.shrink #dash .dash-background, #dashtodockContainer.bottom.shrink #dash .dash-background { @@ -4172,11 +4377,11 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.top.extended #dash .dash-separator, #dashtodockContainer.top.straight-corner #dash .dash-separator, #dashtodockContainer.bottom.extended #dash .dash-separator, #dashtodockContainer.bottom.straight-corner #dash .dash-separator { - margin: 0 8px !important; + margin: 0 5px !important; } #dashtodockContainer.top.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.top.extended #dash .show-apps, #dashtodockContainer.top.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.top.straight-corner #dash .show-apps, #dashtodockContainer.bottom.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.extended #dash .show-apps, #dashtodockContainer.bottom.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.straight-corner #dash .show-apps { - padding: 10px 3px !important; + padding: 8px 1px !important; } #dashtodockContainer #dash { @@ -4185,7 +4390,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer #dash .dash-background { - background-color: #202020; + background-color: rgba(0, 0, 0, 0.5); background-clip: padding-box; } @@ -4241,7 +4446,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.transparent #dash .dash-background { - background-color: #202020; + background-color: rgba(0, 0, 0, 0.5); } #dashtodockContainer:overview #dash .dash-background { diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/gtk-dark.css index 0780c94..10b0fc5 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/gtk-dark.css @@ -1432,7 +1432,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { border-radius: 8px 8px 0 0; color: white; box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12); - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .titlebar:disabled { @@ -1984,7 +1984,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); background-clip: border-box; border: 1px solid rgba(255, 255, 255, 0.12); } @@ -2118,7 +2118,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: border-box; } @@ -4296,7 +4296,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(48, 48, 48, 0.95); border-radius: 0 0 8px 8px; - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd.unified { @@ -4304,11 +4304,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7512,8 +7512,6 @@ frame.raven-frame > border { .raven { background-color: #3C3C3C; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8013,7 +8011,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); background-color: #3C3C3C; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/gtk.css index 7a5e7fa..60b1421 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-3.0/gtk.css @@ -1433,7 +1433,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { color: white; box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12); box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #2C2C2C; + background-color: rgba(44, 44, 44, 0.98); } .titlebar:disabled { @@ -1985,7 +1985,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); background-clip: border-box; border: 1px solid rgba(0, 0, 0, 0.12); } @@ -2119,7 +2119,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: padding-box; } @@ -4297,7 +4297,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(250, 250, 250, 0.95); border-radius: 0 0 8px 8px; - background-color: #FAFAFA; + background-color: rgba(250, 250, 250, 0.95); } .nautilus-window.background.csd.unified { @@ -4305,11 +4305,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #2C2C2C; + background-color: rgba(44, 44, 44, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #FAFAFA; + background-color: rgba(250, 250, 250, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7517,8 +7517,6 @@ frame.raven-frame > border { .raven { background-color: #FFFFFF; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8018,7 +8016,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/gtk-dark.css index de4b32f..82dc829 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/gtk-dark.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1741,7 +1741,7 @@ headerbar { min-height: 36px; margin: 0; padding: 0; - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } headerbar:disabled { @@ -1912,10 +1912,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2386,8 +2382,8 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #3C3C3C; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(60, 60, 60, 0.98); border-radius: 6px; color: white; border: 1px solid rgba(255, 255, 255, 0.12); @@ -2430,6 +2426,10 @@ popover.background toolbar { background-color: #3C3C3C; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2499,9 +2499,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 20px; min-width: 20px; padding: 2px 8px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(255, 255, 255, 0.7); @@ -2766,6 +2765,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4732,7 +4736,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4881,6 +4885,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 8px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4917,7 +4925,7 @@ weekgrid.current { } popover.events { - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); padding: 0; } @@ -5346,7 +5354,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5857,6 +5865,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5970,7 +5986,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6065,7 +6081,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6190,7 +6206,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6278,7 +6294,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 16px 4px 8 2; + margin: 16px 4px 8px 2px; border-spacing: 16px; } @@ -6819,12 +6835,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); color: white; } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6978,13 +6994,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); color: white; } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7017,6 +7033,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7171,6 +7193,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 6px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #3281EA; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 4px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #3281EA; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(255, 255, 255, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/gtk.css index 6365861..9b1a6ce 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round-compact/gtk-4.0/gtk.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1742,7 +1742,7 @@ headerbar { margin: 0; padding: 0; box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #2C2C2C; + background-color: rgba(44, 44, 44, 0.98); } headerbar:disabled { @@ -1913,10 +1913,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2387,12 +2383,12 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #FFFFFF; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(255, 255, 255, 0.98); border-radius: 6px; color: rgba(0, 0, 0, 0.87); border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.12); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.12); } popover.background:backdrop > arrow, @@ -2431,6 +2427,10 @@ popover.background toolbar { background-color: #FFFFFF; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2500,9 +2500,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 20px; min-width: 20px; padding: 2px 8px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(0, 0, 0, 0.6); @@ -2767,6 +2766,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4733,7 +4737,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4882,6 +4886,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 8px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4918,7 +4926,7 @@ weekgrid.current { } popover.events { - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); padding: 0; } @@ -5347,7 +5355,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5858,6 +5866,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5971,7 +5987,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6066,7 +6082,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6191,7 +6207,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6279,7 +6295,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 16px 4px 8 2; + margin: 16px 4px 8px 2px; border-spacing: 16px; } @@ -6820,12 +6836,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#1A73E8, #FAFAFA, 30%); + background-color: mix(#1A73E8,#FAFAFA,0.7); color: rgba(0, 0, 0, 0.87); } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#1A73E8, #FAFAFA, 30%); + background-color: mix(#1A73E8,#FAFAFA,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6979,13 +6995,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#1A73E8, #FFFFFF, 30%); + background-color: mix(#1A73E8,#FFFFFF,0.7); color: rgba(0, 0, 0, 0.87); } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#1A73E8, #FFFFFF, 30%); + background-color: mix(#1A73E8,#FFFFFF,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7018,6 +7034,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7172,6 +7194,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 6px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #1A73E8; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #1A73E8; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 4px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #1A73E8; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #1A73E8; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(0, 0, 0, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/cinnamon/cinnamon.css b/melawy-gtk-theme/usr/share/themes/Melawy-round/cinnamon/cinnamon.css index 66c02d5..9f93708 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round/cinnamon/cinnamon.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/cinnamon/cinnamon.css @@ -10,7 +10,7 @@ stage { min-height: 24px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); background-color: rgba(0, 0, 0, 0.04); } @@ -18,36 +18,36 @@ stage { .sound-button:focus { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .sound-button:hover:focus { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .sound-button:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .sound-button:insensitive { color: rgba(0, 0, 0, 0.38); background-color: rgba(0, 0, 0, 0.04); - border-radius: 4px; + border-radius: 2px; } .notification-button, .notification-icon-button, .menu #notification .notification-button, .menu #notification .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button, #notification .notification-button, #notification .notification-icon-button, .calendar-today-home-button, .calendar-today-home-button-enabled { - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); background-color: transparent; } @@ -56,28 +56,28 @@ stage { .calendar-today-home-button-enabled:hover { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active, .calendar-today-home-button:active, .calendar-today-home-button-enabled:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.26); - border-radius: 4px; + border-radius: 2px; } .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive, .calendar-today-home-button:insensitive, .calendar-today-home-button-enabled:insensitive { color: rgba(0, 0, 0, 0.26); background-color: transparent; - border-radius: 4px; + border-radius: 2px; } .modal-dialog-button-box .modal-dialog-button { min-height: 24px; padding: 6px 30px; transition-duration: 100ms; - border-radius: 4px; + border-radius: 2px; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); } @@ -108,7 +108,7 @@ stage { selection-background-color: #1A73E8; selected-color: white; transition-duration: 300ms; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.87); border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.04); @@ -271,7 +271,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 4px; + border-radius: 2px; padding: 5px 12px; background-color: rgba(54, 54, 54, 0.9); color: white; @@ -300,8 +300,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-content { padding: 6px 0; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; - border-radius: 6px; + background-color: rgba(255, 255, 255, 0.98); + border-radius: 3px; margin: 6px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } @@ -351,7 +351,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: 6px 12px; spacing: 12px; - border-radius: 4px; + border-radius: 2px; margin: 0 6px; } @@ -395,7 +395,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); @@ -525,7 +525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 1em; padding: 0px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5), 0 0 16px rgba(0, 0, 0, 0.24); - background-color: #1F1F1F; + background-color: rgba(31, 31, 31, 0.8); } .panel-top .panel-button:hover, @@ -585,7 +585,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(54, 54, 54, 0.9); color: white; spacing: 25px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -601,7 +601,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, .expo-workspaces-name-entry#selected { height: 15px; - border-radius: 4px; + border-radius: 2px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -624,13 +624,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspace-thumbnail-frame { border: 4px solid rgba(255, 255, 255, 0); background-color: rgba(255, 255, 255, 0); - border-radius: 4px; + border-radius: 2px; } .expo-workspace-thumbnail-frame#active { border: 4px solid #1A73E8; background-color: black; - border-radius: 4px; + border-radius: 2px; } .expo-background { @@ -730,7 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; background-color: #FFFFFF; padding: 4px; padding-right: 0; @@ -845,7 +845,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { text-align: center; font-size: 14px; color: rgba(0, 0, 0, 0.87); - border-radius: 4px; + border-radius: 2px; } .calendar-day-base { @@ -930,7 +930,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 8px; min-width: 350px; border: none; - border-radius: 4px; + border-radius: 2px; background-gradient-direction: vertical; background-gradient-start: rgba(0, 0, 0, 0.04); background-gradient-end: rgba(0, 0, 0, 0.04); @@ -940,7 +940,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-events-no-events-button { margin: 6px 0; padding: 6px; - border-radius: 4px; + border-radius: 2px; } .calendar-events-no-events-button:hover { @@ -983,7 +983,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-event-button { margin: 6px 0 6px 0; - border-radius: 4px; + border-radius: 2px; } .calendar-event-button:hover { @@ -1050,14 +1050,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 8px; + border-radius: 3px; padding: 12px; spacing-rows: 9px; spacing-columns: 9px; margin-from-right-edge-of-screen: 18px; width: 28em; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); margin: 7px 12px 17px 12px; } @@ -1068,7 +1068,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu #notification, .popup-menu #notification { border: none; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.05); box-shadow: none; margin: 0; @@ -1136,9 +1136,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); border: none; - border-radius: 4px; + border-radius: 2px; padding: 20px; } @@ -1152,7 +1152,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 4px; + border-radius: 2px; } .switcher-list .item-box:outlined { @@ -1226,7 +1226,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(46, 46, 46, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 4px; + border-radius: 2px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1251,7 +1251,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 6px 12px; background-color: rgba(54, 54, 54, 0.9); - border-radius: 4px; + border-radius: 2px; color: white; } @@ -1283,7 +1283,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 3px 12px; - border-radius: 4px; + border-radius: 2px; caret-color: white; selected-color: white; selection-background-color: #1A73E8; @@ -1412,7 +1412,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 4px; + border-radius: 2px; box-shadow: none; color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.04); @@ -1436,7 +1436,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: white; padding: 5px; - -arrow-border-radius: 4px; + -arrow-border-radius: 2px; -arrow-background-color: rgba(54, 54, 54, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1452,17 +1452,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { transition-duration: 300; background-color: rgba(0, 0, 0, 0.05); border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button { padding: 9px; border: none; - border-radius: 4px; + border-radius: 2px; } .menu-favorites-button:hover { - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.1); } @@ -1486,7 +1486,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1498,7 +1498,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); padding: 6px; - border-radius: 4px; + border-radius: 2px; border: none; } @@ -1516,7 +1516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu StScrollView.menu-application-button { padding: 3px 0; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.6); } @@ -1525,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; spacing: 0; margin: 0 3px; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.6); } @@ -1557,7 +1557,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border-radius: 4px; + border-radius: 2px; } .menu-category-button-selected { @@ -1567,7 +1567,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button-hover, .menu-category-button-selected { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.12); - border-radius: 4px; + border-radius: 2px; } .menu-category-button-greyed { @@ -1647,12 +1647,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 4px; + border-radius: 2px; color: #1A73E8; } .osd-window .level-bar { - border-radius: 4px; + border-radius: 2px; background-color: #1A73E8; } @@ -1800,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0F9D58; background-gradient-end: #0F9D58; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -1814,7 +1814,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 6px; border: none; background-color: #FFFFFF; - border-radius: 4px; + border-radius: 2px; color: rgba(0, 0, 0, 0.87); box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1830,15 +1830,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu { padding: 6px; color: rgba(0, 0, 0, 0.87); - background-color: #FFFFFF; - border-radius: 6px; + background-color: rgba(255, 255, 255, 0.98); + border-radius: 3px; margin: 6px; box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35); } .grouped-window-list-thumbnail-menu .item-box { padding: 6px; - border-radius: 4px; + border-radius: 2px; spacing: 6px; margin: 1px; } @@ -1923,7 +1923,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0F9D58; background-gradient-end: #0F9D58; - border-radius: 4px; + border-radius: 2px; box-shadow: none; } @@ -2004,7 +2004,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 0; margin-top: 6px; - border-radius: 4px; + border-radius: 2px; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } @@ -2043,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { spacing: 6px; background-color: rgba(0, 0, 0, 0.5); border: none; - border-radius: 0 0 4px 4px; + border-radius: 0 0 2px 2px; color: white; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/gnome-shell/assets/menu.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round/gnome-shell/assets/menu.svg index 12f85d3..fa3dc0b 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round/gnome-shell/assets/menu.svg +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/gnome-shell/assets/menu.svg @@ -73,7 +73,7 @@ d="M 14 3 C 9.0140007 3 5 7.0140007 5 12 L 5 100 C 5 104.986 9.0140007 109 14 109 L 102 109 C 106.986 109 111 104.986 111 100 L 111 12 C 111 7.0140007 106.986 3 102 3 L 14 3 z M 14 4 L 102 4 C 106.432 4 110 7.5680012 110 12 L 110 100 C 110 104.432 106.432 108 102 108 L 14 108 C 9.5680012 108 6 104.432 6 100 L 6 12 C 6 7.5680012 9.5680012 4 14 4 z " transform="scale(0.26458333)" /> StIcon { - icon-size: 48px; + icon-size: 96px; margin-bottom: 12px; -st-icon-style: symbolic; } .message-list-sections { - spacing: 6px; - margin: 0; - padding-bottom: 6px; + spacing: 12px; } .message-list-sections:ltr { @@ -1045,13 +1168,24 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section, .message-list-section-list { - spacing: 6px; + spacing: 12px; } .message-list-controls { - margin: 8px 16px 0; - padding: 4px; - spacing: 12px; + padding: 12px; + padding-bottom: 6px; + spacing: 6px; +} + +.message-list-controls .dnd-button { + border-width: 2px; + border-color: transparent; + border-radius: 32px; + border-style: solid; +} + +.message-list-controls .dnd-button:focus { + border-color: rgba(26, 115, 232, 0.6); } .message { @@ -1059,97 +1193,152 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 5px; color: rgba(0, 0, 0, 0.54); text-shadow: none; + padding: 0; + margin: 4px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.15); - border: 1px solid rgba(0, 0, 0, 0.12); + background-color: rgba(255, 255, 255, 0.95); + border: 1px solid transparent; +} + +.message:hover, .message:focus, .message:active { + background-color: #ffffff; } .popup-menu .message { - box-shadow: none; margin: 0 0 4px; + box-shadow: none; + background-color: rgba(255, 255, 255, 0.35); + border-radius: 5px; + color: rgba(0, 0, 0, 0.54); + border: 1px solid rgba(0, 0, 0, 0.12); } -.message:hover, .message:focus { +.popup-menu .message:hover, .popup-menu .message:focus { background-color: rgba(0, 0, 0, 0.06); border-color: rgba(0, 0, 0, 0.15); } -.message:active { +.popup-menu .message:active { background-color: rgba(0, 0, 0, 0.08); } -.message .message-icon-bin { - padding: 18px; - padding-right: 6px; +.message:ltr { + padding-right: -2px; } -.message .message-icon-bin:rtl { - padding-left: 6px; +.message:rtl { + padding-left: -2px; } -.message .message-icon-bin > StIcon { +.message .message-header { + padding: 0 0.409em; + margin: 6px; + margin-bottom: 0; + spacing: 6px; + color: rgba(0, 0, 0, 0.38); +} + +.message .message-header .message-source-icon { + icon-size: 1.091em; + -st-icon-style: symbolic; +} + +.message .message-header .message-header-content { + spacing: 6px; + min-height: 1.637em; + padding-bottom: 6px; +} + +.message .message-header .message-header-content .message-source-title { + font-weight: bold; +} + +.message .message-header .message-header-content .event-time { + color: rgba(0, 0, 0, 0.38); + padding-bottom: 0.068em; +} + +.message .message-header .message-header-content .event-time:ltr { + text-align: right; +} + +.message .message-header .message-header-content .event-time:rtl { + text-align: left; +} + +.message .message-header .message-expand-button, +.message .message-header .message-close-button { + color: rgba(0, 0, 0, 0.87); + background-color: rgba(0, 0, 0, 0); + padding: 4px; +} + +.message .message-header .message-expand-button:hover, +.message .message-header .message-close-button:hover { + background-color: rgba(0, 0, 0, 0.06); +} + +.message .message-header .message-expand-button:active, .message .message-header .message-expand-button:active:hover, +.message .message-header .message-close-button:active, +.message .message-header .message-close-button:active:hover { + background-color: rgba(0, 0, 0, 0.11); +} + +.message .message-header .message-expand-button:insensitive, +.message .message-header .message-close-button:insensitive { + background-color: rgba(0, 0, 0, 0); +} + +.message .message-header .message-expand-button { + padding: 6px; +} + +.message .message-header .message-expand-button:ltr { + margin-right: 6px; +} + +.message .message-header .message-expand-button:rtl { + margin-left: 6px; +} + +.message .message-box { + padding: 6px; + margin: 6px; + margin-top: 0; + spacing: 6px; +} + +.message .message-box .message-icon { icon-size: 48px; -st-icon-style: symbolic; } -.message .message-icon-bin > .fallback-app-icon { - width: 32px; - height: 32px; +.message .message-box .message-icon:ltr { + margin-right: 6px; } -.message .message-content { - padding: 14px; - spacing: 4px; - margin-bottom: 8px; - color: rgba(0, 0, 0, 0.54); +.message .message-box .message-icon:rtl { + margin-left: 6px; } -.message .message-title { - font-weight: bold; - padding-top: 0.57em; -} - -.message .message-secondary-bin { - padding: 0 8px; -} - -.message .message-secondary-bin > .event-time { - color: rgba(0, 0, 0, 0.54); - font-size: 0.9em; - padding-bottom: 0.13em; -} - -.message .message-secondary-bin > .event-time:ltr { - text-align: right; -} - -.message .message-secondary-bin > .event-time:rtl { - text-align: left; -} - -.message .message-close-button { - color: rgba(0, 0, 0, 0.54); - padding: 2px; - height: 24px; - width: 24px; +.message .message-box .message-icon.message-themed-icon { border-radius: 9999px; + background-color: rgba(0, 0, 0, 0.07); + icon-size: 16px; + min-width: 48px; + min-height: 48px; } -.message .message-close-button:hover, .message .message-close-button:focus { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.06); +.message .message-box:first-child { + margin-top: 12px; } -.message .message-close-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); +.message .message-box .message-content { + spacing: 4px; } -.message .message-close-button:insensitive { - color: rgba(0, 0, 0, 0.26); -} - -.message .message-body { - color: rgba(0, 0, 0, 0.38); +.message .message-box .message-content .message-title { + font-weight: bold; } .url-highlighter { @@ -1158,10 +1347,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Media Controls */ .message-media-control { - margin: 24px 6px; - padding: 12px; + margin: 4px 0; + padding: 0 12px; border-radius: 9999px; color: rgba(0, 0, 0, 0.54); + border: none; } .message-media-control:hover, .message-media-control:focus { @@ -1178,33 +1368,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.26); } -.message-media-control:last-child:ltr { - margin-right: 16px; - padding-right: 8px; +.message-media-control StIcon { + icon-size: 16px; } -.message-media-control:last-child:rtl { - margin-left: 16px; - padding-left: 8px; +.media-message .message-icon { + border-radius: 5px !important; } -.media-message-cover-icon { - icon-size: 48px !important; - border-radius: 5px; - border: none; -} - -.media-message-cover-icon.fallback { - color: rgba(0, 0, 0, 0.38); - background-color: rgba(0, 0, 0, 0.06); - border: none; - border-radius: 5px; +.media-message .message-icon.message-themed-icon { icon-size: 32px !important; - padding: 8px; } .candidate-popup-content { - background-color: #ffffff; + background-color: rgba(255, 255, 255, 0.95); border-radius: 8px; box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.25) !important; margin: 3px 8px 11px; @@ -1277,126 +1454,87 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { min-height: 64px; width: 34em; - font-size: 1em; - margin: 9px 8px 12px; - border-radius: 5px; - color: rgba(0, 0, 0, 0.87); - background-color: rgba(255, 255, 255, 0.92); - border: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.35); + margin: 6px; + border-radius: 12px; } -.notification-banner:hover { - background-color: rgba(255, 255, 255, 0.95); -} - -.notification-banner:focus { - background-color: #ffffff; -} - -.notification-banner .notification-actions { +.notification-buttons-bin { spacing: 0; } -.notification-banner .notification-button { +.notification-button { min-height: 40px; padding: 0 16px; - background-color: transparent; - color: rgba(0, 0, 0, 0.54); + background-color: transparent !important; + color: rgba(0, 0, 0, 0.54) !important; font-weight: 500; - border-width: 0; - border-top: 1px solid rgba(0, 0, 0, 0.12); + border-top: 1px solid rgba(0, 0, 0, 0.12) !important; } -.notification-banner .notification-button:first-child { - border-radius: 0 0 0 5px !important; -} - -.notification-banner .notification-button:last-child { - border-radius: 0 0 5px 0 !important; -} - -.notification-banner .notification-button:only-child, .notification-banner .notification-button:first-child:last-child { - border-radius: 0 0 5px 5px !important; -} - -.notification-banner .notification-button:focus { - background-color: transparent; - color: rgba(0, 0, 0, 0.54); +.notification-button:focus { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.54) !important; box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.06) !important; } -.notification-banner .notification-button:hover, .notification-banner .notification-button:focus:hover { - background-color: rgba(0, 0, 0, 0.06); - color: rgba(0, 0, 0, 0.87); +.notification-button:hover { + background-color: rgba(0, 0, 0, 0.06) !important; + color: rgba(0, 0, 0, 0.87) !important; box-shadow: none !important; } -.notification-banner .notification-button:active { - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); +.notification-button:active, .notification-button:checked { + background-color: rgba(0, 0, 0, 0.2) !important; + color: rgba(0, 0, 0, 0.87) !important; } -.summary-source-counter { - font-size: 1em; - font-weight: bold; - height: 1.6em; - width: 1.6em; - -shell-counter-overlap-x: 3px; - -shell-counter-overlap-y: 3px; - background-color: #1A73E8; - color: rgba(255, 255, 255, 0.85); - border: 2px solid #1A73E8; - box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); - border-radius: 0.9em; +.notification-button:insensitive { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.26) !important; } -.chat-body { - spacing: 5px; +.notification-button:first-child:ltr { + border-radius: 0 0 0 12px; } -.chat-response { - margin: 5px; +.notification-button:last-child:ltr { + border-radius: 0 0 12px; + margin-right: 0 !important; } -.chat-log-message { - color: rgba(0, 0, 0, 0.54); +.notification-button:first-child:rtl { + border-radius: 0 0 12px; } -.chat-new-group { - padding-top: 1em; +.notification-button:last-child:rtl { + border-radius: 0 0 0 12px; + margin-left: 0 !important; } -.chat-received { - padding-left: 4px; +.notification-button:first-child:last-child { + border-radius: 0 0 12px 12px; + margin-left: 0 !important; + margin-right: 0 !important; } -.chat-received:rtl { - padding-left: 0px; - padding-right: 4px; +.popup-menu .notification-button:first-child:ltr { + border-radius: 0 0 0 5px; } -.chat-sent { - padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); +.popup-menu .notification-button:last-child:ltr { + border-radius: 0 0 5px; } -.chat-sent:rtl { - padding-left: 0; - padding-right: 18pt; +.popup-menu .notification-button:first-child:rtl { + border-radius: 0 0 5px; } -.chat-meta-message { - font-weight: bold; - padding-left: 4px; - font-size: 9pt; - font-weight: 400; - color: rgba(0, 0, 0, 0.38); +.popup-menu .notification-button:last-child:rtl { + border-radius: 0 0 0 5px; } -.chat-meta-message:rtl { - padding-left: 0; - padding-right: 4px; +.popup-menu .notification-button:first-child:last-child { + border-radius: 0 0 5px 5px; } .hotplug-notification-item { @@ -1903,21 +2041,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Top Bar */ #panel .panel-button#panelActivities { - background-image: url("assets/activities.svg"); - background-position: center center; - background-repeat: no-repeat; - background-size: auto; - color: transparent !important; - font-size: 0; - box-shadow: none; + -natural-hpadding: 15px; } -#panel .panel-button#panelActivities * { - width: 36px; +#panel .panel-button#panelActivities StBoxLayout { + spacing: 6px; } #panel .panel-button#panelActivities .workspace-dot { - background-color: transparent; + border-radius: 9999px; + min-width: 8px; + min-height: 8px; + background-color: #FFFFFF; } #panel { @@ -1927,10 +2062,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; padding: 0 2px !important; - background-color: #202020; - border-radius: 12px; - margin: 3px; - height: 38px; + background-color: rgba(0, 0, 0, 0.5); + margin: 0; + border-radius: 0; + height: 34px; } #panel #panelLeft, #panel #panelCenter { @@ -1939,7 +2074,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #202020; + -panel-corner-background-color: rgba(0, 0, 0, 0.5); -panel-corner-border-width: 0; -panel-corner-border-color: transparent; -panel-corner-opacity: 0; @@ -1963,6 +2098,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; } +#panel .panel-button.clock-display { + border: 1px solid transparent !important; + box-shadow: inset 0 1px transparent !important; +} + +#panel .panel-button.clock-display:hover { + color: rgba(255, 255, 255, 0.75); + background-color: rgba(255, 255, 255, 0.1) !important; +} + +#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:checked, #panel .panel-button.clock-display:focus { + color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.15) !important; +} + #panel .panel-button.clock-display .clock { color: rgba(255, 255, 255, 0.75); transition-duration: 150ms; @@ -1970,6 +2120,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; } +#panel .panel-button.clock-display .messages-indicator { + icon-size: 1.091em; +} + #panel .panel-button:hover { color: rgba(255, 255, 255, 0.75); background-color: rgba(255, 255, 255, 0.1); @@ -2030,10 +2184,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: transparent; } -#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { - color: rgba(255, 255, 255, 0.7); -} - #panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel.lock-screen .panel-button:hover, #panel:overview .panel-button:hover { background-color: rgba(255, 255, 255, 0.15); } @@ -2047,6 +2197,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } +#panel.unlock-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:hover { + background-color: rgba(255, 255, 255, 0.15) !important; +} + +#panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:checked, #panel.unlock-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:focus { + background-color: rgba(255, 255, 255, 0.3) !important; +} + +#panel.unlock-screen .panel-button.clock-display:hover, #panel.unlock-screen .panel-button.clock-display:active, #panel.unlock-screen .panel-button.clock-display:overview, #panel.unlock-screen .panel-button.clock-display:focus, #panel.unlock-screen .panel-button.clock-display:checked, #panel.login-screen .panel-button.clock-display:hover, #panel.login-screen .panel-button.clock-display:active, #panel.login-screen .panel-button.clock-display:overview, #panel.login-screen .panel-button.clock-display:focus, #panel.login-screen .panel-button.clock-display:checked, #panel.lock-screen .panel-button.clock-display:hover, #panel.lock-screen .panel-button.clock-display:active, #panel.lock-screen .panel-button.clock-display:overview, #panel.lock-screen .panel-button.clock-display:focus, #panel.lock-screen .panel-button.clock-display:checked, #panel:overview .panel-button.clock-display:hover, #panel:overview .panel-button.clock-display:active, #panel:overview .panel-button.clock-display:overview, #panel:overview .panel-button.clock-display:focus, #panel:overview .panel-button.clock-display:checked { + border: 1px solid rgba(0, 0, 0, 0.12) !important; + box-shadow: inset 0 1px rgba(255, 255, 255, 0.1) !important; +} + +#panel.unlock-screen .panel-button.clock-display .clock, #panel.login-screen .panel-button.clock-display .clock, #panel.lock-screen .panel-button.clock-display .clock, #panel:overview .panel-button.clock-display .clock { + color: rgba(255, 255, 255, 0.7); +} + #panel.unlock-screen .panel-button#panelActivities, #panel.login-screen .panel-button#panelActivities, #panel.lock-screen .panel-button#panelActivities, #panel:overview .panel-button#panelActivities { box-shadow: none; border: none; @@ -2057,6 +2224,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.15); } +#panel.unlock-screen .panel-button#panelActivities .workspace-dot, #panel.login-screen .panel-button#panelActivities .workspace-dot, #panel.lock-screen .panel-button#panelActivities .workspace-dot, #panel:overview .panel-button#panelActivities .workspace-dot { + background-color: rgba(255, 255, 255, 0.85); +} + #panel.unlock-screen .panel-corner, #panel.login-screen .panel-corner, #panel.lock-screen .panel-corner, #panel:overview .panel-corner { -panel-corner-opacity: 0; -panel-corner-radius: 0; @@ -2069,43 +2240,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px !important; } -#panel Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel Gjs_ui_panel_ActivitiesButton.panel-button { - border-radius: 12px 0 0 12px !important; -} - -#panel Gjs_AggregateMenu.panel-button, -#panel Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 0 12px 12px 0 !important; -} - -#panel:overview Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel:overview Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel:overview Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel:overview Gjs_ui_panel_ActivitiesButton.panel-button, -#panel:overview Gjs_AggregateMenu.panel-button, -#panel:overview Gjs_ui_panel_AggregateMenu.panel-button, #panel.unlock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.unlock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.unlock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.unlock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.unlock-screen Gjs_AggregateMenu.panel-button, -#panel.unlock-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.login-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.login-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.login-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.login-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.login-screen Gjs_AggregateMenu.panel-button, -#panel.login-screen Gjs_ui_panel_AggregateMenu.panel-button, #panel.lock-screen Gjs_ArcMenu_ApplicationsButton.panel-button, -#panel.lock-screen Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, -#panel.lock-screen Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, -#panel.lock-screen Gjs_ui_panel_ActivitiesButton.panel-button, -#panel.lock-screen Gjs_AggregateMenu.panel-button, -#panel.lock-screen Gjs_ui_panel_AggregateMenu.panel-button { - border-radius: 5px !important; -} - #panel Gjs_ArcMenu_ApplicationsButton.panel-button, #panel Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button, #panel Gjs_arc-menu_linuxgem33_com_menuButton_ArcMenu_MenuButton.panel-button, @@ -2216,18 +2350,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.54); background-color: #ffffff; margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .search-entry:hover { - border: 2px solid rgba(0, 0, 0, 0.2); + border: 2px solid rgba(0, 0, 0, 0.2) !important; } .search-entry:focus { color: rgba(0, 0, 0, 0.87); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #1A73E8; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #1A73E8 !important; } .search-entry:insensitive { @@ -2254,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { caret-color: rgba(0, 0, 0, 0.75); color: rgba(0, 0, 0, 0.75); background-color: rgba(255, 255, 255, 0.75) !important; - border-color: transparent; - box-shadow: none; + border: none !important; + box-shadow: none !important; } #overview .search-entry:hover { @@ -2265,9 +2399,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #overview .search-entry:focus { color: rgba(0, 0, 0, 0.85); - border-color: transparent; background-color: rgba(255, 255, 255, 0.95) !important; - border: none; + border: none !important; selection-background-color: #1A73E8; selected-color: #FFFFFF !important; } @@ -2285,17 +2418,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Search */ +#searchResults { + margin: 0 8px; +} + #searchResultsContent { - max-width: 1024px; - spacing: 8px; + max-width: 1044px; } .search-section { - spacing: 8px; + spacing: 12px; } .search-section .search-section-separator { - height: 0; + height: 8px; background-color: transparent; } @@ -2314,21 +2450,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 12px; } -.list-search-result:focus, .search-provider-icon:focus, .list-search-result:hover, .search-provider-icon:hover, .list-search-result:selected, .search-provider-icon:selected { - background-color: rgba(255, 255, 255, 0.15); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - transition-duration: 100ms; -} - -.list-search-result:active, .search-provider-icon:active, .list-search-result:checked, .search-provider-icon:checked { - background-color: rgba(255, 255, 255, 0.3); - border: 1px solid rgba(0, 0, 0, 0.12); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); +.search-statustext { + color: rgba(255, 255, 255, 0.7); } .grid-search-results { spacing: 36px; + margin: 0 12px; +} + +.search-provider-icon:ltr { + margin-right: 4px; +} + +.search-provider-icon:rtl { + margin-left: 4px; } .search-provider-icon .list-search-provider-content { @@ -2337,7 +2473,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .search-provider-icon .list-search-provider-content .list-search-provider-details { width: 120px; - margin-top: 0; color: rgba(255, 255, 255, 0.7); } @@ -2359,44 +2494,102 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash */ #dash { - font-size: 1em; margin-top: 12px; - padding: 0 10px; } -#dash .placeholder { +#dash .dash-background { + background-color: rgba(255, 255, 255, 0.2); + border-radius: 20px; + padding-top: 12px; + padding-bottom: 12px; + padding-left: 10px; + padding-right: 10px; +} + +#dash .dash-item-container .placeholder { background-image: none; background-size: contain; height: 32px; } -#dash .empty-dash-drop-target { +#dash .dash-item-container .empty-dash-drop-target { width: 32px; height: 32px; } -#dash .overview-icon { - padding: 5px; - border-radius: 8px; +#dash .dash-item-container .show-apps, +#dash .dash-item-container .overview-tile, +#dash .dash-item-container .grid-search-result, +#dash .dash-item-container .search-provider-icon, +#dash .dash-item-container .list-search-result { + margin: 0 2px; + padding-bottom: 12px; } -.dash-background { - background-color: rgba(255, 255, 255, 0.2); - margin-bottom: 18px; - padding: 10px; - border-radius: 18px; +#dash .dash-item-container .show-apps .overview-icon, +#dash .dash-item-container .overview-tile .overview-icon, +#dash .dash-item-container .grid-search-result .overview-icon, +#dash .dash-item-container .search-provider-icon .overview-icon, +#dash .dash-item-container .list-search-result .overview-icon { + background-color: transparent; } -.dash-item-container .app-well-app, .show-apps { - padding: 10px 3px 28px; -} - -.dash-separator { - width: 1px; - margin: 0 8px 18px; +#dash .dash-item-container .show-apps:focus .overview-icon, +#dash .dash-item-container .overview-tile:focus .overview-icon, +#dash .dash-item-container .grid-search-result:focus .overview-icon, +#dash .dash-item-container .search-provider-icon:focus .overview-icon, +#dash .dash-item-container .list-search-result:focus .overview-icon { background-color: rgba(255, 255, 255, 0.15); } +#dash .dash-item-container .show-apps:hover .overview-icon, +#dash .dash-item-container .overview-tile:hover .overview-icon, +#dash .dash-item-container .grid-search-result:hover .overview-icon, +#dash .dash-item-container .search-provider-icon:hover .overview-icon, +#dash .dash-item-container .list-search-result:hover .overview-icon { + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-item-container .show-apps:active .overview-icon, +#dash .dash-item-container .overview-tile:active .overview-icon, +#dash .dash-item-container .grid-search-result:active .overview-icon, +#dash .dash-item-container .search-provider-icon:active .overview-icon, +#dash .dash-item-container .list-search-result:active .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:checked .overview-icon, +#dash .dash-item-container .overview-tile:checked .overview-icon, +#dash .dash-item-container .grid-search-result:checked .overview-icon, +#dash .dash-item-container .search-provider-icon:checked .overview-icon, +#dash .dash-item-container .list-search-result:checked .overview-icon { + background-color: rgba(255, 255, 255, 0.3); +} + +#dash .dash-item-container .show-apps:insensitive .overview-icon, +#dash .dash-item-container .overview-tile:insensitive .overview-icon, +#dash .dash-item-container .grid-search-result:insensitive .overview-icon, +#dash .dash-item-container .search-provider-icon:insensitive .overview-icon, +#dash .dash-item-container .list-search-result:insensitive .overview-icon { + background-color: transparent; +} + +#dash .dash-item-container .app-grid-running-dot { + margin-bottom: 21px; +} + +#dash .dash-separator { + width: 1px; + margin-left: 4px; + margin-right: 4px; + background-color: rgba(255, 255, 255, 0.15); +} + +#dash .dash-separator, +#dash .dash-background { + margin-bottom: 12px; +} + .dash-label { border-radius: 5px; padding: 6px 12px; @@ -2406,46 +2599,37 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: none; box-shadow: none; text-align: center; - -y-offset: 20px; + -y-offset: 4px; } /* App Grid */ - -.show-apps .overview-icon, -.app-well-app .overview-icon, -.grid-search-result .overview-icon, .search-provider-icon, .list-search-result { - color: rgba(255, 255, 255, 0.85); - border-radius: 10px; - padding: 6px; - border: 1px solid transparent; - box-shadow: inset 0 1px transparent; - transition-duration: 150ms; - text-align: center; -} - .icon-grid { row-spacing: 12px; column-spacing: 12px; - max-row-spacing: 72px; - max-column-spacing: 72px; + max-row-spacing: 36px; + max-column-spacing: 36px; page-padding-top: 24px; page-padding-bottom: 24px; - page-padding-left: 12px; - page-padding-right: 12px; + page-padding-left: 18px; + page-padding-right: 18px; } /* App Icons */ +.overview-tile, .grid-search-result, .search-provider-icon, .list-search-result { + border-radius: 24px; + padding: 12px; + spacing: 6px; + transition-duration: 150ms; + text-align: center; + background-color: transparent; + color: rgba(255, 255, 255, 0.85); + border: 1px solid transparent; + box-shadow: inset 0 1px transparent; +} -.show-apps:hover .overview-icon, -.show-apps:focus .overview-icon, -.show-apps:selected .overview-icon, -.app-well-app:hover .overview-icon, -.app-well-app:focus .overview-icon, -.app-well-app:selected .overview-icon, -.grid-search-result:hover .overview-icon, -.grid-search-result:focus .overview-icon, -.grid-search-result:selected .overview-icon { +.overview-tile:hover, .grid-search-result:hover, .search-provider-icon:hover, .list-search-result:hover, .overview-tile:focus, .grid-search-result:focus, .search-provider-icon:focus, .list-search-result:focus, .overview-tile:highlighted, .grid-search-result:highlighted, .search-provider-icon:highlighted, .list-search-result:highlighted, .overview-tile:selected, .grid-search-result:selected, .search-provider-icon:selected, .list-search-result:selected { background-color: rgba(255, 255, 255, 0.15); + color: rgba(255, 255, 255, 0.85); transition-duration: 0ms; border-image: none; background-image: none; @@ -2453,34 +2637,43 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps:active .overview-icon, -.show-apps:checked .overview-icon, -.app-well-app:active .overview-icon, -.app-well-app:checked .overview-icon, -.grid-search-result:active .overview-icon, -.grid-search-result:checked .overview-icon { +.overview-tile:active, .grid-search-result:active, .search-provider-icon:active, .list-search-result:active, .overview-tile:checked, .grid-search-result:checked, .search-provider-icon:checked, .list-search-result:checked { background-color: rgba(255, 255, 255, 0.15); transition-duration: 150ms; + color: rgba(255, 255, 255, 0.85); border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } - -.show-apps .overview-icon.overview-icon-with-label, -.app-well-app .overview-icon.overview-icon-with-label, -.grid-search-result .overview-icon.overview-icon-with-label { - padding: 10px 8px 5px 8px; -} - - -.show-apps .overview-icon.overview-icon-with-label > StBoxLayout, -.app-well-app .overview-icon.overview-icon-with-label > StBoxLayout, -.grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout { +.overview-tile .overview-icon.overview-icon-with-label > StBoxLayout, .grid-search-result .overview-icon.overview-icon-with-label > StBoxLayout, .search-provider-icon .overview-icon.overview-icon-with-label > StBoxLayout, .list-search-result .overview-icon.overview-icon-with-label > StBoxLayout { spacing: 6px; } -.app-well-app-running-dot { +.app-folder { + background-color: rgba(255, 255, 255, 0.13); +} + +.app-folder:focus { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:hover { + background-color: rgba(255, 255, 255, 0.15); +} + +.app-folder:active { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:highlighted, .app-folder:selected, .app-folder:checked { + background-color: rgba(255, 255, 255, 0.3); +} + +.app-folder:insensitive { + background-color: transparent; +} + +.app-grid-running-dot { width: 6px; height: 3px; border-radius: 2px; @@ -2488,33 +2681,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin-bottom: 1px; } -StWidget.focused .app-well-app-running-dot { +StWidget.focused .app-grid-running-dot { width: 18px; background-color: #1A73E8; } -/* App Folders */ -.app-well-app.app-folder { - background: none; - border-radius: 10px; -} - -.app-well-app.app-folder .overview-icon { - background-color: rgba(255, 255, 255, 0.13); - border-radius: 10px; -} - -.app-well-app.app-folder:hover .overview-icon { - background-color: rgba(255, 255, 255, 0.15); -} - -.app-well-app.app-folder:active .overview-icon { - background-color: rgba(255, 255, 255, 0.3); +.app-folder-dialog-container { + padding-top: 34px; } .app-folder-dialog { + width: 720px; + height: 720px; border-radius: 20px; background-color: rgba(34, 34, 34, 0.95); + color: white; border: 1px solid rgba(0, 0, 0, 0.12); box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } @@ -2562,7 +2743,9 @@ StWidget.focused .app-well-app-running-dot { color: rgba(255, 255, 255, 0.7); } -.app-folder-dialog .folder-name-container .edit-folder-button { +.app-folder-dialog .folder-name-container .icon-button, .app-folder-dialog .folder-name-container .background-app-item .close-button, .background-app-item .app-folder-dialog .folder-name-container .close-button, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button { background-color: rgba(255, 255, 255, 0.15); color: rgba(255, 255, 255, 0.7); border: none; @@ -2572,15 +2755,23 @@ StWidget.focused .app-well-app-running-dot { border-radius: 18px; } -.app-folder-dialog .folder-name-container .edit-folder-button > StIcon { +.app-folder-dialog .folder-name-container .icon-button > StIcon, .app-folder-dialog .folder-name-container .background-app-item .close-button > StIcon, .background-app-item .app-folder-dialog .folder-name-container .close-button > StIcon, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button > StIcon, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button > StIcon, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button > StIcon, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button > StIcon { icon-size: 16px; } -.app-folder-dialog .folder-name-container .edit-folder-button:hover { +.app-folder-dialog .folder-name-container .icon-button:hover, .app-folder-dialog .folder-name-container .background-app-item .close-button:hover, .background-app-item .app-folder-dialog .folder-name-container .close-button:hover, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:hover, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:hover, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:hover, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:hover { background-color: rgba(255, 255, 255, 0.15); } -.app-folder-dialog .folder-name-container .edit-folder-button:checked, .app-folder-dialog .folder-name-container .edit-folder-button:active { +.app-folder-dialog .folder-name-container .icon-button:checked, .app-folder-dialog .folder-name-container .background-app-item .close-button:checked, .background-app-item .app-folder-dialog .folder-name-container .close-button:checked, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:checked, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:checked, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:checked, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:checked, .app-folder-dialog .folder-name-container .icon-button:active, .app-folder-dialog .folder-name-container .background-app-item .close-button:active, .background-app-item .app-folder-dialog .folder-name-container .close-button:active, .app-folder-dialog .folder-name-container .message .message-header .message-expand-button:active, .message .message-header .app-folder-dialog .folder-name-container .message-expand-button:active, +.app-folder-dialog .folder-name-container .message .message-header .message-close-button:active, +.message .message-header .app-folder-dialog .folder-name-container .message-close-button:active { background-color: rgba(255, 255, 255, 0.3); } @@ -2597,12 +2788,6 @@ StWidget.focused .app-well-app-running-dot { margin-bottom: 18px; } -.app-folder-dialog-container { - padding: 12px; - width: 620px; - height: 620px; -} - .rename-folder-popup .rename-folder-popup-item { spacing: 6px; } @@ -2625,6 +2810,7 @@ StWidget.focused .app-well-app-running-dot { height: 10px; border-radius: 10px; background-color: white; + transition-duration: 400ms; } .apps-scroll-view { @@ -2638,10 +2824,6 @@ StWidget.focused .app-well-app-running-dot { icon-size: 8px; } -.page-navigation-hint { - width: 300px; -} - .page-navigation-hint.dnd { background: rgba(255, 255, 255, 0.1); } @@ -2667,6 +2849,11 @@ StWidget.focused .app-well-app-running-dot { height: 24px; border-radius: 9999px; color: rgba(255, 255, 255, 0.7); + background-color: transparent; +} + +.page-navigation-arrow > StIcon { + color: rgba(255, 255, 255, 0.85); } .page-navigation-arrow:insensitive { @@ -3123,11 +3310,15 @@ StWidget.focused .app-well-app-running-dot { padding: 16px 18px 20px !important; } -.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .button { +.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .message .message-header .message-expand-button, .message .message-header .quick-settings .message-expand-button, +.quick-settings .message .message-header .message-close-button, +.message .message-header .quick-settings .message-close-button, .quick-settings .button { padding: 9px; } -.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .button > StIcon { +.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings .message-expand-button > StIcon, +.quick-settings .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings .message-close-button > StIcon, .quick-settings .button > StIcon { icon-size: 16px; } @@ -3301,18 +3492,24 @@ StWidget.focused .app-well-app-running-dot { icon-size: 16px; } -.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button { +.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button, .quick-slider .message .message-header .message-expand-button, .message .message-header .quick-slider .message-expand-button, +.quick-slider .message .message-header .message-close-button, +.message .message-header .quick-slider .message-close-button { min-width: 22px; min-height: 22px; background-color: transparent; color: rgba(0, 0, 0, 0.87) !important; } -.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover { +.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover, .quick-slider .message .message-header .message-expand-button:hover, .message .message-header .quick-slider .message-expand-button:hover, +.quick-slider .message .message-header .message-close-button:hover, +.message .message-header .quick-slider .message-close-button:hover { background-color: rgba(0, 0, 0, 0.06); } -.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active { +.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active, .quick-slider .message .message-header .message-expand-button:active, .message .message-header .quick-slider .message-expand-button:active, +.quick-slider .message .message-header .message-close-button:active, +.message .message-header .quick-slider .message-close-button:active { background-color: rgba(0, 0, 0, 0.12); } @@ -3365,7 +3562,9 @@ StWidget.focused .app-well-app-running-dot { spacing: 12px; } -.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button { +.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button, .quick-settings-system-item .message .message-header .message-expand-button, .message .message-header .quick-settings-system-item .message-expand-button, +.quick-settings-system-item .message .message-header .message-close-button, +.message .message-header .quick-settings-system-item .message-close-button { background-color: rgba(0, 0, 0, 0.06); color: rgba(0, 0, 0, 0.87); border-radius: 5px; @@ -3373,15 +3572,21 @@ StWidget.focused .app-well-app-running-dot { min-width: 22px; } -.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover { +.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover, .quick-settings-system-item .message .message-header .message-expand-button:hover, .message .message-header .quick-settings-system-item .message-expand-button:hover, +.quick-settings-system-item .message .message-header .message-close-button:hover, +.message .message-header .quick-settings-system-item .message-close-button:hover { background-color: rgba(0, 0, 0, 0.12); } -.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active { +.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active, .quick-settings-system-item .message .message-header .message-expand-button:active, .message .message-header .quick-settings-system-item .message-expand-button:active, +.quick-settings-system-item .message .message-header .message-close-button:active, +.message .message-header .quick-settings-system-item .message-close-button:active { background-color: rgba(0, 0, 0, 0.2); } -.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon { +.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon, .quick-settings-system-item .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings-system-item .message-expand-button > StIcon, +.quick-settings-system-item .message .message-header .message-close-button > StIcon, +.message .message-header .quick-settings-system-item .message-close-button > StIcon { -st-icon-style: symbolic; icon-size: 16px; } @@ -3665,15 +3870,15 @@ StWidget.focused .app-well-app-running-dot { color: rgba(0, 0, 0, 0.54); background-color: #ffffff; margin: 2px 6px 6px; - border: 2px solid transparent; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05); + border: 2px solid transparent !important; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 5px 8px rgba(0, 0, 0, 0.05) !important; } .login-dialog StEntry:focus, .unlock-dialog StEntry:focus { color: rgba(0, 0, 0, 0.87); - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08); - border: 2px solid #1A73E8; + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 5px 8px rgba(0, 0, 0, 0.08) !important; + border: 2px solid #1A73E8 !important; } .login-dialog StEntry:insensitive, @@ -4142,7 +4347,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left #dash .dash-item-container .app-well-app, #dashtodockContainer.right #dash .dash-item-container .app-well-app { - padding: 3px 6px !important; + padding: 2px 6px !important; } #dashtodockContainer.left #dash .show-apps, #dashtodockContainer.right #dash .show-apps { @@ -4155,11 +4360,11 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.left.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.left.extended #dash .show-apps, #dashtodockContainer.left.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.left.straight-corner #dash .show-apps, #dashtodockContainer.right.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.right.extended #dash .show-apps, #dashtodockContainer.right.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.right.straight-corner #dash .show-apps { - padding: 3px 10px !important; + padding: 2px 12px !important; } #dashtodockContainer.top #dash .dash-background, #dashtodockContainer.bottom #dash .dash-background { - padding: 10px 5px !important; + padding: 12px 6px !important; } #dashtodockContainer.top.shrink #dash .dash-background, #dashtodockContainer.bottom.shrink #dash .dash-background { @@ -4176,7 +4381,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.top.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.top.extended #dash .show-apps, #dashtodockContainer.top.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.top.straight-corner #dash .show-apps, #dashtodockContainer.bottom.extended #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.extended #dash .show-apps, #dashtodockContainer.bottom.straight-corner #dash .dash-item-container .app-well-app, #dashtodockContainer.bottom.straight-corner #dash .show-apps { - padding: 10px 3px !important; + padding: 12px 2px !important; } #dashtodockContainer #dash { @@ -4185,7 +4390,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer #dash .dash-background { - background-color: #202020; + background-color: rgba(0, 0, 0, 0.5); background-clip: padding-box; } @@ -4241,7 +4446,7 @@ StWidget.focused .app-well-app-running-dot { } #dashtodockContainer.transparent #dash .dash-background { - background-color: #202020; + background-color: rgba(0, 0, 0, 0.5); } #dashtodockContainer:overview #dash .dash-background { diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/gtk-dark.css index 6e393cd..109d8d6 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/gtk-dark.css @@ -1432,7 +1432,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { border-radius: 8px 8px 0 0; color: white; box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12); - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .titlebar:disabled { @@ -1984,7 +1984,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); background-clip: border-box; border: 1px solid rgba(255, 255, 255, 0.12); } @@ -2118,7 +2118,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: border-box; } @@ -4296,7 +4296,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(48, 48, 48, 0.95); border-radius: 0 0 8px 8px; - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd.unified { @@ -4304,11 +4304,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #303030; + background-color: rgba(48, 48, 48, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7512,8 +7512,6 @@ frame.raven-frame > border { .raven { background-color: #3C3C3C; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8013,7 +8011,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.1); background-color: #3C3C3C; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/gtk.css index 0b6e73e..502df56 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-3.0/gtk.css @@ -1433,7 +1433,7 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) { color: white; box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12); box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #2C2C2C; + background-color: rgba(44, 44, 44, 0.98); } .titlebar:disabled { @@ -1985,7 +1985,7 @@ menu, .context-menu { margin: 3px 0; padding: 3px 0; - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); background-clip: border-box; border: 1px solid rgba(0, 0, 0, 0.12); } @@ -2119,7 +2119,7 @@ popover, popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 4px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.06); background-clip: padding-box; } @@ -4297,7 +4297,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window.background.csd { background-color: rgba(250, 250, 250, 0.95); border-radius: 0 0 8px 8px; - background-color: #FAFAFA; + background-color: rgba(250, 250, 250, 0.95); } .nautilus-window.background.csd.unified { @@ -4305,11 +4305,11 @@ popover.emoji-completion .emoji:hover { } .nautilus-window.background.csd.unified headerbar.titlebar { - background-color: #2C2C2C; + background-color: rgba(44, 44, 44, 0.98); } .nautilus-window.background.csd.unified placessidebar.sidebar { - background-color: #FAFAFA; + background-color: rgba(250, 250, 250, 0.95); } .nautilus-window.background.csd placessidebar.sidebar, .nautilus-window.background.csd placessidebar.sidebar > viewport.frame > list > separator { @@ -7517,8 +7517,6 @@ frame.raven-frame > border { .raven { background-color: #FFFFFF; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13); - margin: 8px 6px 6px; - border-radius: 4px; } .raven > box { @@ -8018,7 +8016,7 @@ window.background.csd.thunar scrolledwindow.frame.sidebar.shortcuts-pane treevie #restart_dialog { margin: 8px; border-radius: 4px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/assets/scalable/check-symbolic.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/assets/scalable/check-symbolic.svg new file mode 100644 index 0000000..7b89e88 --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/assets/scalable/check-symbolic.svg @@ -0,0 +1,43 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/assets/scalable/check-symbolic@2.svg b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/assets/scalable/check-symbolic@2.svg new file mode 100644 index 0000000..17e3c4a --- /dev/null +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/assets/scalable/check-symbolic@2.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/gtk-dark.css b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/gtk-dark.css index e698ec6..efc633a 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/gtk-dark.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/gtk-dark.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1741,7 +1741,7 @@ headerbar { min-height: 44px; margin: 0; padding: 0; - background-color: #202020; + background-color: rgba(32, 32, 32, 0.98); } headerbar:disabled { @@ -1912,10 +1912,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2386,8 +2382,8 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 6px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #3C3C3C; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(60, 60, 60, 0.98); border-radius: 6px; color: white; border: 1px solid rgba(255, 255, 255, 0.12); @@ -2430,6 +2426,10 @@ popover.background toolbar { background-color: #3C3C3C; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2499,9 +2499,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 22px; min-width: 22px; padding: 3px 12px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(255, 255, 255, 0.7); @@ -2766,6 +2765,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4732,7 +4736,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4881,6 +4885,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 12px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4917,7 +4925,7 @@ weekgrid.current { } popover.events { - background-color: #3C3C3C; + background-color: rgba(60, 60, 60, 0.98); padding: 0; } @@ -5346,7 +5354,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5857,6 +5865,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5970,7 +5986,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6065,7 +6081,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6190,7 +6206,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#2B2B2B, white, 85%); + background-color: mix(#2B2B2B,white,0.15); color: white; } @@ -6278,7 +6294,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 24px 6px 8 2; + margin: 24px 6px 8px 2px; border-spacing: 24px; } @@ -6819,12 +6835,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); color: white; } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #303030, 30%); + background-color: mix(#3281EA,#303030,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6978,13 +6994,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); color: white; } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#3281EA, #2B2B2B, 30%); + background-color: mix(#3281EA,#2B2B2B,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7017,6 +7033,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7171,6 +7193,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 9px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #3281EA; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 6px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #3281EA; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #3281EA; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(255, 255, 255, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/gtk.css b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/gtk.css index c93835f..63fe86e 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/gtk.css +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/gtk-4.0/gtk.css @@ -155,7 +155,7 @@ popover.background.magnifier > contents, .osd { background-clip: padding-box; border-radius: 4px; border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .osd { @@ -1742,7 +1742,7 @@ headerbar { margin: 0; padding: 0; box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #2C2C2C; + background-color: rgba(44, 44, 44, 0.98); } headerbar:disabled { @@ -1913,10 +1913,6 @@ headerbar.selection-mode .selection-menu { padding-right: 16px; } -headerbar.selection-mode .selection-menu arrow { - -GtkArrow-arrow-scaling: 1; -} - headerbar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } @@ -2387,12 +2383,12 @@ popover.background > arrow, popover.background > contents { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 6px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); - background-color: #FFFFFF; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); + background-color: rgba(255, 255, 255, 0.98); border-radius: 6px; color: rgba(0, 0, 0, 0.87); border: none; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.12); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.12); } popover.background:backdrop > arrow, @@ -2431,6 +2427,10 @@ popover.background toolbar { background-color: #FFFFFF; } +popover.background list > row { + border-radius: 4px; +} + popover.background listview { margin: 0; padding: 0; @@ -2500,9 +2500,8 @@ tabbar tabbox tab, notebook > header tab { min-height: 22px; min-width: 22px; padding: 3px 12px; - border-width: 1px; - border-color: transparent; - border-style: solid; + border: 1px solid transparent; + border-bottom: 0; outline: none; background-clip: padding-box; color: rgba(0, 0, 0, 0.6); @@ -2767,6 +2766,11 @@ tabbar:backdrop .box > .end-action { filter: opacity(0.5); } +tabbar tabbox { + padding: 0; + margin: 0; +} + tabbar tabbox > tabboxchild { padding: 0; margin: 0; @@ -4733,7 +4737,7 @@ stackswitcher.circular button.text-button.circular { } .icon-dropshadow { - -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } /********* @@ -4882,6 +4886,10 @@ statusbar { margin-left: 0; } +navigation-view-page > toolbarview > scrolledwindow > viewport > clamp > box > box > stack > button { + margin-top: 12px; +} + label.primary-label, label.month-name, label.secondary-label { font-size: 16pt; font-weight: bold; @@ -4918,7 +4926,7 @@ weekgrid.current { } popover.events { - background-color: #FFFFFF; + background-color: rgba(255, 255, 255, 0.98); padding: 0; } @@ -5347,7 +5355,7 @@ screenshot-carousel button, } .category-tile.card:hover { - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 6px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.16), 0 1px 6px rgba(0, 0, 0, 0.1); } .category-tile.card.category-tile-iconless { @@ -5858,6 +5866,14 @@ spinner.fade-in:checked { animation-delay: 0s, 0.5s, 0.5s; } +window.org-gnome-TextEditor popover.open-popover > contents { + padding: 0; +} + +window.org-gnome-TextEditor popover.open-popover > contents separator { + margin: 0; +} + avatar { border-radius: 9999px; font-weight: bold; @@ -5971,7 +5987,7 @@ splitbutton.suggested-action > button:checked.keyboard-activating, splitbutton.s } button.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6066,7 +6082,7 @@ menubutton.destructive-action { } menubutton.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6191,7 +6207,7 @@ splitbutton.destructive-action { } splitbutton.opaque { - background-color: gtkmix(#FFFFFF, rgba(0, 0, 0, 0.87), 85%); + background-color: mix(#FFFFFF,rgba(0, 0, 0, 0.87),0.15); color: rgba(0, 0, 0, 0.87); } @@ -6279,7 +6295,7 @@ statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-chi } statuspage.compact > scrolledwindow > viewport > box { - margin: 24px 6px 8 2; + margin: 24px 6px 8px 2px; border-spacing: 24px; } @@ -6820,12 +6836,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { } .sidebar-pane banner > revealer > widget { - background-color: gtkmix(#1A73E8, #FAFAFA, 30%); + background-color: mix(#1A73E8,#FAFAFA,0.7); color: rgba(0, 0, 0, 0.87); } .sidebar-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#1A73E8, #FAFAFA, 30%); + background-color: mix(#1A73E8,#FAFAFA,0.7); } .sidebar-pane:dir(ltr), .sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), .sidebar-pane.end:dir(rtl) banner > revealer > widget { @@ -6979,13 +6995,13 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { .content-pane .sidebar-pane banner > revealer > widget, .sidebar-pane .content-pane banner > revealer > widget { - background-color: gtkmix(#1A73E8, #FFFFFF, 30%); + background-color: mix(#1A73E8,#FFFFFF,0.7); color: rgba(0, 0, 0, 0.87); } .content-pane .sidebar-pane banner > revealer > widget:backdrop, .sidebar-pane .content-pane banner > revealer > widget:backdrop { - background-color: gtkmix(#1A73E8, #FFFFFF, 30%); + background-color: mix(#1A73E8,#FFFFFF,0.7); } .content-pane .sidebar-pane:dir(ltr), .content-pane .sidebar-pane:dir(ltr) banner > revealer > widget, .content-pane .sidebar-pane.end:dir(rtl), .content-pane .sidebar-pane.end:dir(rtl) banner > revealer > widget, @@ -7018,6 +7034,12 @@ toolbarview.undershoot-bottom scrolledwindow > undershoot.bottom { box-shadow: none; } +.top-bar { + border: none; + box-shadow: none; + background-color: transparent; +} + .top-bar .collapse-spacing { padding: 0; } @@ -7172,6 +7194,143 @@ tabbox:drop(active) { box-shadow: none; } +themeselector, +panelthemeselector { + margin: 9px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #1A73E8; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #ffffff 50%, #202020 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #ffffff; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #202020; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/scalable/check-symbolic.svg")), -gtk-recolor(url("assets/scalable/check-symbolic@2.svg"))); + color: white; + background-color: #1A73E8; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 6px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: white; + background-color: #1A73E8; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #1A73E8; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e1e 50%, white 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: white; +} + +themeswitcher checkbutton.dark { + color: white; + background-color: #1e1e1e; +} + +floating-sheet > dimming { + background-color: rgba(0, 0, 0, 0.25); +} + +floating-sheet > sheet.background { + border-radius: 8px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 16px 18px rgba(0, 0, 0, 0.15), 0 11px 23px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(0, 0, 0, 0.12), 0 0 0 36px transparent; +} + /* GTK NAMED COLORS ---------------- use responsibly! */ diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/metacity-1/metacity-theme-2.xml b/melawy-gtk-theme/usr/share/themes/Melawy-round/metacity-1/metacity-theme-2.xml index f9a81bb..a189b28 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round/metacity-1/metacity-theme-2.xml +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/metacity-1/metacity-theme-2.xml @@ -1,11 +1,11 @@ - Melawy + Fluent vinceliucie GPL 2020 - Melawy Metacity theme + Fluent Metacity theme diff --git a/melawy-gtk-theme/usr/share/themes/Melawy-round/metacity-1/metacity-theme-3.xml b/melawy-gtk-theme/usr/share/themes/Melawy-round/metacity-1/metacity-theme-3.xml index 90a08df..15c1671 100644 --- a/melawy-gtk-theme/usr/share/themes/Melawy-round/metacity-1/metacity-theme-3.xml +++ b/melawy-gtk-theme/usr/share/themes/Melawy-round/metacity-1/metacity-theme-3.xml @@ -1,11 +1,11 @@ - Melawy-round + Fluent-round vinceliucie GPL 2020 - Melawy-round Metacity theme + Fluent-round Metacity theme