From b4c8094fce33dbae2a3611d841fe17e5502a6807 Mon Sep 17 00:00:00 2001 From: vinceliuice Date: Sun, 17 Jan 2021 21:01:00 +0800 Subject: [PATCH] Fixed cinnamon issues --- .../cinnamon/assets-dark/menu-solid.svg | 12 +- src/assets/cinnamon/assets-dark/menu.svg | 146 +---- src/assets/cinnamon/assets-dark/submenu.svg | 119 ---- .../cinnamon/assets-light/menu-solid.svg | 6 +- src/assets/cinnamon/assets-light/menu.svg | 140 +---- src/assets/cinnamon/assets-light/submenu.svg | 119 ---- .../common-assets-blue/menu-hover.svg | 7 - .../common-assets-green/menu-hover.svg | 7 - .../common-assets-grey/menu-hover.svg | 7 - .../common-assets-orange/menu-hover.svg | 7 - .../common-assets-pink/menu-hover.svg | 7 - .../common-assets-purple/menu-hover.svg | 7 - .../cinnamon/common-assets-red/menu-hover.svg | 7 - .../common-assets-yellow/menu-hover.svg | 7 - .../cinnamon/common-assets/menu-hover.svg | 7 - src/main/cinnamon/cinnamon-dark-blue.css | 473 ++++++---------- src/main/cinnamon/cinnamon-dark-green.css | 473 ++++++---------- src/main/cinnamon/cinnamon-dark-grey.css | 473 ++++++---------- src/main/cinnamon/cinnamon-dark-orange.css | 473 ++++++---------- src/main/cinnamon/cinnamon-dark-pink.css | 473 ++++++---------- src/main/cinnamon/cinnamon-dark-purple.css | 473 ++++++---------- src/main/cinnamon/cinnamon-dark-red.css | 473 ++++++---------- .../cinnamon/cinnamon-dark-solid-blue.css | 481 ++++++---------- .../cinnamon/cinnamon-dark-solid-green.css | 481 ++++++---------- .../cinnamon/cinnamon-dark-solid-grey.css | 481 ++++++---------- .../cinnamon/cinnamon-dark-solid-orange.css | 481 ++++++---------- .../cinnamon/cinnamon-dark-solid-pink.css | 481 ++++++---------- .../cinnamon/cinnamon-dark-solid-purple.css | 481 ++++++---------- src/main/cinnamon/cinnamon-dark-solid-red.css | 481 ++++++---------- .../cinnamon/cinnamon-dark-solid-yellow.css | 481 ++++++---------- src/main/cinnamon/cinnamon-dark-solid.css | 526 +++++++----------- src/main/cinnamon/cinnamon-dark-yellow.css | 473 ++++++---------- src/main/cinnamon/cinnamon-dark.css | 518 +++++++---------- src/main/cinnamon/cinnamon-light-blue.css | 459 ++++++--------- src/main/cinnamon/cinnamon-light-green.css | 459 ++++++--------- src/main/cinnamon/cinnamon-light-grey.css | 459 ++++++--------- src/main/cinnamon/cinnamon-light-orange.css | 459 ++++++--------- src/main/cinnamon/cinnamon-light-pink.css | 459 ++++++--------- src/main/cinnamon/cinnamon-light-purple.css | 459 ++++++--------- src/main/cinnamon/cinnamon-light-red.css | 459 ++++++--------- .../cinnamon/cinnamon-light-solid-blue.css | 467 ++++++---------- .../cinnamon/cinnamon-light-solid-green.css | 467 ++++++---------- .../cinnamon/cinnamon-light-solid-grey.css | 467 ++++++---------- .../cinnamon/cinnamon-light-solid-orange.css | 467 ++++++---------- .../cinnamon/cinnamon-light-solid-pink.css | 467 ++++++---------- .../cinnamon/cinnamon-light-solid-purple.css | 467 ++++++---------- .../cinnamon/cinnamon-light-solid-red.css | 467 ++++++---------- .../cinnamon/cinnamon-light-solid-yellow.css | 467 ++++++---------- src/main/cinnamon/cinnamon-light-solid.css | 512 +++++++---------- src/main/cinnamon/cinnamon-light-yellow.css | 459 ++++++--------- src/main/cinnamon/cinnamon-light.css | 504 +++++++---------- src/main/gtk-3.0/gtk-dark-blue.css | 2 +- src/main/gtk-3.0/gtk-dark-green.css | 2 +- src/main/gtk-3.0/gtk-dark-grey.css | 2 +- src/main/gtk-3.0/gtk-dark-orange.css | 2 +- src/main/gtk-3.0/gtk-dark-pink.css | 2 +- src/main/gtk-3.0/gtk-dark-purple.css | 2 +- src/main/gtk-3.0/gtk-dark-red.css | 2 +- src/main/gtk-3.0/gtk-dark-solid-blue.css | 2 +- src/main/gtk-3.0/gtk-dark-solid-green.css | 2 +- src/main/gtk-3.0/gtk-dark-solid-grey.css | 2 +- src/main/gtk-3.0/gtk-dark-solid-orange.css | 2 +- src/main/gtk-3.0/gtk-dark-solid-pink.css | 2 +- src/main/gtk-3.0/gtk-dark-solid-purple.css | 2 +- src/main/gtk-3.0/gtk-dark-solid-red.css | 2 +- src/main/gtk-3.0/gtk-dark-solid-yellow.css | 2 +- src/main/gtk-3.0/gtk-dark-yellow.css | 2 +- src/main/gtk-3.0/gtk-light-blue.css | 2 +- src/main/gtk-3.0/gtk-light-green.css | 2 +- src/main/gtk-3.0/gtk-light-grey.css | 2 +- src/main/gtk-3.0/gtk-light-orange.css | 2 +- src/main/gtk-3.0/gtk-light-pink.css | 2 +- src/main/gtk-3.0/gtk-light-purple.css | 2 +- src/main/gtk-3.0/gtk-light-red.css | 2 +- src/main/gtk-3.0/gtk-light-solid-blue.css | 2 +- src/main/gtk-3.0/gtk-light-solid-green.css | 2 +- src/main/gtk-3.0/gtk-light-solid-grey.css | 2 +- src/main/gtk-3.0/gtk-light-solid-orange.css | 2 +- src/main/gtk-3.0/gtk-light-solid-pink.css | 2 +- src/main/gtk-3.0/gtk-light-solid-purple.css | 2 +- src/main/gtk-3.0/gtk-light-solid-red.css | 2 +- src/main/gtk-3.0/gtk-light-solid-yellow.css | 2 +- src/main/gtk-3.0/gtk-light-yellow.css | 2 +- src/sass/cinnamon/_common.scss | 424 +++++++------- src/sass/cinnamon/_drawing.scss | 20 + 85 files changed, 6598 insertions(+), 11615 deletions(-) delete mode 100644 src/assets/cinnamon/assets-dark/submenu.svg delete mode 100644 src/assets/cinnamon/assets-light/submenu.svg delete mode 100644 src/assets/cinnamon/common-assets-blue/menu-hover.svg delete mode 100644 src/assets/cinnamon/common-assets-green/menu-hover.svg delete mode 100644 src/assets/cinnamon/common-assets-grey/menu-hover.svg delete mode 100644 src/assets/cinnamon/common-assets-orange/menu-hover.svg delete mode 100644 src/assets/cinnamon/common-assets-pink/menu-hover.svg delete mode 100644 src/assets/cinnamon/common-assets-purple/menu-hover.svg delete mode 100644 src/assets/cinnamon/common-assets-red/menu-hover.svg delete mode 100644 src/assets/cinnamon/common-assets-yellow/menu-hover.svg delete mode 100644 src/assets/cinnamon/common-assets/menu-hover.svg diff --git a/src/assets/cinnamon/assets-dark/menu-solid.svg b/src/assets/cinnamon/assets-dark/menu-solid.svg index a3ce1d00..a2d835e4 100644 --- a/src/assets/cinnamon/assets-dark/menu-solid.svg +++ b/src/assets/cinnamon/assets-dark/menu-solid.svg @@ -1,13 +1,11 @@ - + - - - - - - + + + + diff --git a/src/assets/cinnamon/assets-dark/menu.svg b/src/assets/cinnamon/assets-dark/menu.svg index 6b0671a0..59818a78 100644 --- a/src/assets/cinnamon/assets-dark/menu.svg +++ b/src/assets/cinnamon/assets-dark/menu.svg @@ -1,135 +1,13 @@ - - - - - - - - - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - + + + + + + + + + + + + diff --git a/src/assets/cinnamon/assets-dark/submenu.svg b/src/assets/cinnamon/assets-dark/submenu.svg deleted file mode 100644 index e1e34e3e..00000000 --- a/src/assets/cinnamon/assets-dark/submenu.svg +++ /dev/null @@ -1,119 +0,0 @@ - - - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - - - diff --git a/src/assets/cinnamon/assets-light/menu-solid.svg b/src/assets/cinnamon/assets-light/menu-solid.svg index 4ea7dff2..185a900e 100644 --- a/src/assets/cinnamon/assets-light/menu-solid.svg +++ b/src/assets/cinnamon/assets-light/menu-solid.svg @@ -5,8 +5,8 @@ - - - + + + diff --git a/src/assets/cinnamon/assets-light/menu.svg b/src/assets/cinnamon/assets-light/menu.svg index f195a293..eb659a3e 100644 --- a/src/assets/cinnamon/assets-light/menu.svg +++ b/src/assets/cinnamon/assets-light/menu.svg @@ -1,130 +1,12 @@ - - - - - - - - - - - - - - - - - - - - image/svg+xml - - - - - - - - - - + + + + + + + + + + + diff --git a/src/assets/cinnamon/assets-light/submenu.svg b/src/assets/cinnamon/assets-light/submenu.svg deleted file mode 100644 index 59d4609b..00000000 --- a/src/assets/cinnamon/assets-light/submenu.svg +++ /dev/null @@ -1,119 +0,0 @@ - - - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - - - diff --git a/src/assets/cinnamon/common-assets-blue/menu-hover.svg b/src/assets/cinnamon/common-assets-blue/menu-hover.svg deleted file mode 100644 index 88f31c9c..00000000 --- a/src/assets/cinnamon/common-assets-blue/menu-hover.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/assets/cinnamon/common-assets-green/menu-hover.svg b/src/assets/cinnamon/common-assets-green/menu-hover.svg deleted file mode 100644 index 16dd9ef0..00000000 --- a/src/assets/cinnamon/common-assets-green/menu-hover.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/assets/cinnamon/common-assets-grey/menu-hover.svg b/src/assets/cinnamon/common-assets-grey/menu-hover.svg deleted file mode 100644 index d2b135fa..00000000 --- a/src/assets/cinnamon/common-assets-grey/menu-hover.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/assets/cinnamon/common-assets-orange/menu-hover.svg b/src/assets/cinnamon/common-assets-orange/menu-hover.svg deleted file mode 100644 index b2aebc15..00000000 --- a/src/assets/cinnamon/common-assets-orange/menu-hover.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/assets/cinnamon/common-assets-pink/menu-hover.svg b/src/assets/cinnamon/common-assets-pink/menu-hover.svg deleted file mode 100644 index a730c2c1..00000000 --- a/src/assets/cinnamon/common-assets-pink/menu-hover.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/assets/cinnamon/common-assets-purple/menu-hover.svg b/src/assets/cinnamon/common-assets-purple/menu-hover.svg deleted file mode 100644 index 2b1ac428..00000000 --- a/src/assets/cinnamon/common-assets-purple/menu-hover.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/assets/cinnamon/common-assets-red/menu-hover.svg b/src/assets/cinnamon/common-assets-red/menu-hover.svg deleted file mode 100644 index 5681582a..00000000 --- a/src/assets/cinnamon/common-assets-red/menu-hover.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/assets/cinnamon/common-assets-yellow/menu-hover.svg b/src/assets/cinnamon/common-assets-yellow/menu-hover.svg deleted file mode 100644 index 4760827b..00000000 --- a/src/assets/cinnamon/common-assets-yellow/menu-hover.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/assets/cinnamon/common-assets/menu-hover.svg b/src/assets/cinnamon/common-assets/menu-hover.svg deleted file mode 100644 index 4a9f87d9..00000000 --- a/src/assets/cinnamon/common-assets/menu-hover.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/main/cinnamon/cinnamon-dark-blue.css b/src/main/cinnamon/cinnamon-dark-blue.css index 3e156f7f..9e77ba82 100644 --- a/src/main/cinnamon/cinnamon-dark-blue.css +++ b/src/main/cinnamon/cinnamon-dark-blue.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #2E7CF7; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #2E7CF7; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #2E7CF7; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #2E7CF7; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #2E7CF7; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #2E7CF7; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #2E7CF7; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #2E7CF7; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #2E7CF7; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(0, 0, 0, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #2E7CF7; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #2E7CF7; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(46, 124, 247, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(46, 124, 247, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #2E7CF7; background-gradient-end: #2E7CF7; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #2E7CF7; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(46, 124, 247, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(46, 124, 247, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #2E7CF7; background-gradient-end: #2E7CF7; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #2E7CF7; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2156,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2174,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #2E7CF7; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2195,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-green.css b/src/main/cinnamon/cinnamon-dark-green.css index 1a01a3a7..a9a4a131 100644 --- a/src/main/cinnamon/cinnamon-dark-green.css +++ b/src/main/cinnamon/cinnamon-dark-green.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #79B757; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #79B757; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #79B757; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #79B757; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #79B757; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #79B757; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #79B757; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #79B757; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #79B757; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(0, 0, 0, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #79B757; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #79B757; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(121, 183, 87, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(121, 183, 87, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #79B757; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #79B757; background-gradient-end: #79B757; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #79B757; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(121, 183, 87, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(121, 183, 87, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #79B757; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #79B757; background-gradient-end: #79B757; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #79B757; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #79B757; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2156,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2174,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #79B757; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2195,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-grey.css b/src/main/cinnamon/cinnamon-dark-grey.css index 9030395e..fd126feb 100644 --- a/src/main/cinnamon/cinnamon-dark-grey.css +++ b/src/main/cinnamon/cinnamon-dark-grey.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #8C8C8C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #8C8C8C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #8C8C8C; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #8C8C8C; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #8C8C8C; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #8C8C8C; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #8C8C8C; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #8C8C8C; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #8C8C8C; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(0, 0, 0, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #8C8C8C; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #8C8C8C; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(140, 140, 140, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(140, 140, 140, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #8C8C8C; background-gradient-end: #8C8C8C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #8C8C8C; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(140, 140, 140, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(140, 140, 140, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #8C8C8C; background-gradient-end: #8C8C8C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #8C8C8C; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2156,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2174,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #8C8C8C; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2195,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-orange.css b/src/main/cinnamon/cinnamon-dark-orange.css index 4dee4094..d530150c 100644 --- a/src/main/cinnamon/cinnamon-dark-orange.css +++ b/src/main/cinnamon/cinnamon-dark-orange.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #E9873A; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #E9873A; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #E9873A; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #E9873A; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #E9873A; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E9873A; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #E9873A; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #E9873A; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E9873A; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(0, 0, 0, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #E9873A; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #E9873A; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(233, 135, 58, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(233, 135, 58, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #E9873A; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #E9873A; background-gradient-end: #E9873A; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #E9873A; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(233, 135, 58, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(233, 135, 58, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #E9873A; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #E9873A; background-gradient-end: #E9873A; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #E9873A; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #E9873A; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2156,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2174,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #E9873A; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2195,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-pink.css b/src/main/cinnamon/cinnamon-dark-pink.css index c5836f02..f2d45bc1 100644 --- a/src/main/cinnamon/cinnamon-dark-pink.css +++ b/src/main/cinnamon/cinnamon-dark-pink.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #E55E9C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #E55E9C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #E55E9C; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #E55E9C; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #E55E9C; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E55E9C; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #E55E9C; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #E55E9C; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E55E9C; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(0, 0, 0, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #E55E9C; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #E55E9C; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(229, 94, 156, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(229, 94, 156, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #E55E9C; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #E55E9C; background-gradient-end: #E55E9C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #E55E9C; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(229, 94, 156, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(229, 94, 156, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #E55E9C; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #E55E9C; background-gradient-end: #E55E9C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #E55E9C; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #E55E9C; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2156,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2174,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #E55E9C; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2195,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-purple.css b/src/main/cinnamon/cinnamon-dark-purple.css index 8ad83523..c4872d09 100644 --- a/src/main/cinnamon/cinnamon-dark-purple.css +++ b/src/main/cinnamon/cinnamon-dark-purple.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #9A57A3; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #9A57A3; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #9A57A3; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #9A57A3; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #9A57A3; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #9A57A3; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #9A57A3; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #9A57A3; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #9A57A3; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(0, 0, 0, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #9A57A3; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #9A57A3; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(154, 87, 163, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(154, 87, 163, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #9A57A3; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #9A57A3; background-gradient-end: #9A57A3; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #9A57A3; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(154, 87, 163, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(154, 87, 163, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #9A57A3; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #9A57A3; background-gradient-end: #9A57A3; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #9A57A3; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #9A57A3; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2156,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2174,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #9A57A3; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2195,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-red.css b/src/main/cinnamon/cinnamon-dark-red.css index 1ffa7877..7d5900ec 100644 --- a/src/main/cinnamon/cinnamon-dark-red.css +++ b/src/main/cinnamon/cinnamon-dark-red.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #ED5F5D; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #ED5F5D; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #ED5F5D; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #ED5F5D; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #ED5F5D; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #ED5F5D; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #ED5F5D; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #ED5F5D; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #ED5F5D; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(0, 0, 0, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #ED5F5D; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #ED5F5D; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(237, 95, 93, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(237, 95, 93, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #ED5F5D; background-gradient-end: #ED5F5D; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #ED5F5D; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(237, 95, 93, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(237, 95, 93, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #ED5F5D; background-gradient-end: #ED5F5D; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #ED5F5D; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2156,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2174,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #ED5F5D; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2195,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-solid-blue.css b/src/main/cinnamon/cinnamon-dark-solid-blue.css index acd9ff64..b0daf7ff 100644 --- a/src/main/cinnamon/cinnamon-dark-solid-blue.css +++ b/src/main/cinnamon/cinnamon-dark-solid-blue.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #2E7CF7; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #2E7CF7; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #2E7CF7; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #2E7CF7; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #2E7CF7; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #2E7CF7; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #2E7CF7; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #2E7CF7; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #2E7CF7; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #2a2a2a; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #2E7CF7; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #2E7CF7; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(218, 218, 218, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #dadada; - border: 0 solid rgba(46, 124, 247, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(46, 124, 247, 0.5); + background-color: rgba(218, 218, 218, 0.3); } .window-list-item-box:focus { color: #dadada; - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #dadada 0%, #dadada 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #2E7CF7; background-gradient-end: #2E7CF7; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #2E7CF7; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(218, 218, 218, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(218, 218, 218, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #dadada; - border: 0 solid rgba(46, 124, 247, 0.35); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(46, 124, 247, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(218, 218, 218, 0.15); } .grouped-window-list-item-box:focus { color: #dadada; - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(218, 218, 218, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #2E7CF7; background-gradient-end: #2E7CF7; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #2E7CF7; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2152,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(218, 218, 218, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #dadada; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2173,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #2E7CF7; + color: #dadada; + background-color: rgba(218, 218, 218, 0.25); } .applet-box:highlight { @@ -2189,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #dadada; text-shadow: none; } .applet-icon { color: #dadada; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #dadada; text-shadow: none; } @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-solid-green.css b/src/main/cinnamon/cinnamon-dark-solid-green.css index d3006672..e1c2e92d 100644 --- a/src/main/cinnamon/cinnamon-dark-solid-green.css +++ b/src/main/cinnamon/cinnamon-dark-solid-green.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #79B757; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #79B757; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #79B757; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #79B757; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #79B757; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #79B757; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #79B757; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #79B757; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #79B757; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #2a2a2a; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #79B757; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #79B757; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(218, 218, 218, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #dadada; - border: 0 solid rgba(121, 183, 87, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(121, 183, 87, 0.5); + background-color: rgba(218, 218, 218, 0.3); } .window-list-item-box:focus { color: #dadada; - border: 0 solid #79B757; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #dadada 0%, #dadada 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #79B757; background-gradient-end: #79B757; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #79B757; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(218, 218, 218, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(218, 218, 218, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #dadada; - border: 0 solid rgba(121, 183, 87, 0.35); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(121, 183, 87, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(218, 218, 218, 0.15); } .grouped-window-list-item-box:focus { color: #dadada; - border: 0 solid #79B757; background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(218, 218, 218, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #79B757; background-gradient-end: #79B757; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #79B757; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #79B757; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2152,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(218, 218, 218, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #dadada; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2173,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #79B757; + color: #dadada; + background-color: rgba(218, 218, 218, 0.25); } .applet-box:highlight { @@ -2189,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #dadada; text-shadow: none; } .applet-icon { color: #dadada; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #dadada; text-shadow: none; } @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-solid-grey.css b/src/main/cinnamon/cinnamon-dark-solid-grey.css index e9bea50f..b8fb5ce7 100644 --- a/src/main/cinnamon/cinnamon-dark-solid-grey.css +++ b/src/main/cinnamon/cinnamon-dark-solid-grey.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #8C8C8C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #8C8C8C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #8C8C8C; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #8C8C8C; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #8C8C8C; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #8C8C8C; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #8C8C8C; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #8C8C8C; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #8C8C8C; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #2a2a2a; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #8C8C8C; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #8C8C8C; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(218, 218, 218, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #dadada; - border: 0 solid rgba(140, 140, 140, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(140, 140, 140, 0.5); + background-color: rgba(218, 218, 218, 0.3); } .window-list-item-box:focus { color: #dadada; - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #dadada 0%, #dadada 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #8C8C8C; background-gradient-end: #8C8C8C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #8C8C8C; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(218, 218, 218, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(218, 218, 218, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #dadada; - border: 0 solid rgba(140, 140, 140, 0.35); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(140, 140, 140, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(218, 218, 218, 0.15); } .grouped-window-list-item-box:focus { color: #dadada; - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(218, 218, 218, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #8C8C8C; background-gradient-end: #8C8C8C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #8C8C8C; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2152,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(218, 218, 218, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #dadada; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2173,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #8C8C8C; + color: #dadada; + background-color: rgba(218, 218, 218, 0.25); } .applet-box:highlight { @@ -2189,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #dadada; text-shadow: none; } .applet-icon { color: #dadada; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #dadada; text-shadow: none; } @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-solid-orange.css b/src/main/cinnamon/cinnamon-dark-solid-orange.css index 0c53afd9..938e4c6e 100644 --- a/src/main/cinnamon/cinnamon-dark-solid-orange.css +++ b/src/main/cinnamon/cinnamon-dark-solid-orange.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #E9873A; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #E9873A; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #E9873A; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #E9873A; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #E9873A; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E9873A; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #E9873A; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #E9873A; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E9873A; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #2a2a2a; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #E9873A; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #E9873A; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(218, 218, 218, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #dadada; - border: 0 solid rgba(233, 135, 58, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(233, 135, 58, 0.5); + background-color: rgba(218, 218, 218, 0.3); } .window-list-item-box:focus { color: #dadada; - border: 0 solid #E9873A; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #dadada 0%, #dadada 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #E9873A; background-gradient-end: #E9873A; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #E9873A; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(218, 218, 218, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(218, 218, 218, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #dadada; - border: 0 solid rgba(233, 135, 58, 0.35); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(233, 135, 58, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(218, 218, 218, 0.15); } .grouped-window-list-item-box:focus { color: #dadada; - border: 0 solid #E9873A; background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(218, 218, 218, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #E9873A; background-gradient-end: #E9873A; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #E9873A; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #E9873A; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2152,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(218, 218, 218, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #dadada; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2173,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #E9873A; + color: #dadada; + background-color: rgba(218, 218, 218, 0.25); } .applet-box:highlight { @@ -2189,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #dadada; text-shadow: none; } .applet-icon { color: #dadada; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #dadada; text-shadow: none; } @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-solid-pink.css b/src/main/cinnamon/cinnamon-dark-solid-pink.css index 9187cf16..737672ac 100644 --- a/src/main/cinnamon/cinnamon-dark-solid-pink.css +++ b/src/main/cinnamon/cinnamon-dark-solid-pink.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #E55E9C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #E55E9C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #E55E9C; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #E55E9C; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #E55E9C; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E55E9C; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #E55E9C; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #E55E9C; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E55E9C; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #2a2a2a; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #E55E9C; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #E55E9C; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(218, 218, 218, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #dadada; - border: 0 solid rgba(229, 94, 156, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(229, 94, 156, 0.5); + background-color: rgba(218, 218, 218, 0.3); } .window-list-item-box:focus { color: #dadada; - border: 0 solid #E55E9C; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #dadada 0%, #dadada 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #E55E9C; background-gradient-end: #E55E9C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #E55E9C; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(218, 218, 218, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(218, 218, 218, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #dadada; - border: 0 solid rgba(229, 94, 156, 0.35); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(229, 94, 156, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(218, 218, 218, 0.15); } .grouped-window-list-item-box:focus { color: #dadada; - border: 0 solid #E55E9C; background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(218, 218, 218, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #E55E9C; background-gradient-end: #E55E9C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #E55E9C; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #E55E9C; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2152,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(218, 218, 218, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #dadada; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2173,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #E55E9C; + color: #dadada; + background-color: rgba(218, 218, 218, 0.25); } .applet-box:highlight { @@ -2189,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #dadada; text-shadow: none; } .applet-icon { color: #dadada; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #dadada; text-shadow: none; } @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-solid-purple.css b/src/main/cinnamon/cinnamon-dark-solid-purple.css index fbbc3024..f3d21b4a 100644 --- a/src/main/cinnamon/cinnamon-dark-solid-purple.css +++ b/src/main/cinnamon/cinnamon-dark-solid-purple.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #9A57A3; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #9A57A3; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #9A57A3; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #9A57A3; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #9A57A3; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #9A57A3; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #9A57A3; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #9A57A3; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #9A57A3; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #2a2a2a; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #9A57A3; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #9A57A3; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(218, 218, 218, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #dadada; - border: 0 solid rgba(154, 87, 163, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(154, 87, 163, 0.5); + background-color: rgba(218, 218, 218, 0.3); } .window-list-item-box:focus { color: #dadada; - border: 0 solid #9A57A3; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #dadada 0%, #dadada 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #9A57A3; background-gradient-end: #9A57A3; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #9A57A3; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(218, 218, 218, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(218, 218, 218, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #dadada; - border: 0 solid rgba(154, 87, 163, 0.35); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(154, 87, 163, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(218, 218, 218, 0.15); } .grouped-window-list-item-box:focus { color: #dadada; - border: 0 solid #9A57A3; background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(218, 218, 218, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #9A57A3; background-gradient-end: #9A57A3; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #9A57A3; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #9A57A3; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2152,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(218, 218, 218, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #dadada; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2173,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #9A57A3; + color: #dadada; + background-color: rgba(218, 218, 218, 0.25); } .applet-box:highlight { @@ -2189,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #dadada; text-shadow: none; } .applet-icon { color: #dadada; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #dadada; text-shadow: none; } @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-solid-red.css b/src/main/cinnamon/cinnamon-dark-solid-red.css index 08daefba..65a9f5de 100644 --- a/src/main/cinnamon/cinnamon-dark-solid-red.css +++ b/src/main/cinnamon/cinnamon-dark-solid-red.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #ED5F5D; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #ED5F5D; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #ED5F5D; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #ED5F5D; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #ED5F5D; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #ED5F5D; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #ED5F5D; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #ED5F5D; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #ED5F5D; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #2a2a2a; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #ED5F5D; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #ED5F5D; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(218, 218, 218, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #dadada; - border: 0 solid rgba(237, 95, 93, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(237, 95, 93, 0.5); + background-color: rgba(218, 218, 218, 0.3); } .window-list-item-box:focus { color: #dadada; - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #dadada 0%, #dadada 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #ED5F5D; background-gradient-end: #ED5F5D; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #ED5F5D; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(218, 218, 218, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(218, 218, 218, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #dadada; - border: 0 solid rgba(237, 95, 93, 0.35); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(237, 95, 93, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(218, 218, 218, 0.15); } .grouped-window-list-item-box:focus { color: #dadada; - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(218, 218, 218, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #ED5F5D; background-gradient-end: #ED5F5D; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #ED5F5D; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2152,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(218, 218, 218, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #dadada; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2173,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #ED5F5D; + color: #dadada; + background-color: rgba(218, 218, 218, 0.25); } .applet-box:highlight { @@ -2189,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #dadada; text-shadow: none; } .applet-icon { color: #dadada; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #dadada; text-shadow: none; } @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-solid-yellow.css b/src/main/cinnamon/cinnamon-dark-solid-yellow.css index 12c6bb32..29705f2a 100644 --- a/src/main/cinnamon/cinnamon-dark-solid-yellow.css +++ b/src/main/cinnamon/cinnamon-dark-solid-yellow.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #F3BA4B; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #F3BA4B; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #F3BA4B; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #F3BA4B; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #F3BA4B; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #F3BA4B; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #F3BA4B; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #F3BA4B; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #F3BA4B; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #2a2a2a; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #F3BA4B; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #F3BA4B; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(218, 218, 218, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #dadada; - border: 0 solid rgba(243, 186, 75, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(243, 186, 75, 0.5); + background-color: rgba(218, 218, 218, 0.3); } .window-list-item-box:focus { color: #dadada; - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #dadada 0%, #dadada 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #F3BA4B; background-gradient-end: #F3BA4B; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #F3BA4B; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(218, 218, 218, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(218, 218, 218, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #dadada; - border: 0 solid rgba(243, 186, 75, 0.35); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(243, 186, 75, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(218, 218, 218, 0.15); } .grouped-window-list-item-box:focus { color: #dadada; - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(218, 218, 218, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #F3BA4B; background-gradient-end: #F3BA4B; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #F3BA4B; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2152,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(218, 218, 218, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #dadada; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2173,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #F3BA4B; + color: #dadada; + background-color: rgba(218, 218, 218, 0.25); } .applet-box:highlight { @@ -2189,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #dadada; text-shadow: none; } .applet-icon { color: #dadada; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #dadada; text-shadow: none; } @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-solid.css b/src/main/cinnamon/cinnamon-dark-solid.css index 67947078..42cbe856 100644 --- a/src/main/cinnamon/cinnamon-dark-solid.css +++ b/src/main/cinnamon/cinnamon-dark-solid.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #0860F2; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #0860F2; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #0860F2; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #0860F2; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #0860F2; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #0860F2; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #0860F2; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -812,26 +816,25 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .datemenu-date-label { padding: .4em 1.75em; - font-weight: bold; + font-weight: normal; text-align: center; + font-size: 14px; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { - font-size: 80%; text-align: center; - width: 25px; - height: 25px; - padding: 0.1em; + width: 28px; + height: 28px; + padding: 0; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { color: rgba(222, 222, 222, 0.85); margin-top: 1em; - font-size: 70%; } .calendar-day { @@ -869,19 +872,29 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-week-number { + width: 20px; + height: 20px; + margin: 6px 0; color: rgba(222, 222, 222, 0.7); - font-size: 80%; + font-weight: bold; + background-color: rgba(222, 222, 222, 0.05); + border-radius: 100px; +} + +.calendar-week-number StLabel { + padding: 0; + margin-top: 3px; } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +902,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +969,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +986,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1060,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1085,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1116,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #0860F2; @@ -1224,7 +1245,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1273,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1284,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1322,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1336,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #0860F2; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1353,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1392,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1459,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #2a2a2a; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1490,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #0860F2; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #0860F2; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1534,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(218, 218, 218, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1591,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #dadada; - border: 0 solid rgba(8, 96, 242, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(218, 218, 218, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(8, 96, 242, 0.5); + background-color: rgba(218, 218, 218, 0.3); } .window-list-item-box:focus { color: #dadada; - border: 0 solid #0860F2; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #dadada 0%, #dadada 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1636,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0860F2; background-gradient-end: #0860F2; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1646,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1663,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #0860F2; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1688,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(218, 218, 218, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1711,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(218, 218, 218, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #dadada; - border: 0 solid rgba(218, 218, 218, 0.5); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #dadada; - border: 0 solid rgba(8, 96, 242, 0.35); background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(8, 96, 242, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(218, 218, 218, 0.15); } .grouped-window-list-item-box:focus { color: #dadada; - border: 0 solid #0860F2; background-gradient-direction: none; + background-color: rgba(218, 218, 218, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(218, 218, 218, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #0860F2; background-gradient-end: #0860F2; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1921,7 +1831,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player { - padding: 0 3px; + padding: 0 0; + margin-top: 6px; + border-radius: 6px; + background-color: rgba(255, 255, 255, 0.15); } .sound-player > StBoxLayout:first-child { @@ -1953,22 +1866,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player-overlay { width: 290px; - height: 70px; - padding: 15px; + height: 80px; + padding: 12px 16px 8px; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background-color: rgba(104, 104, 104, 0.9); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } .sound-player-overlay StButton { - width: 22px; + width: 16px; height: 16px; - padding: 6px; - margin: 0 2px; + padding: 8px; + margin: 0 6px 6px; color: #dadada; - border-radius: 3px; + border-radius: 100px; border: none; } @@ -1977,15 +1890,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-overlay StButton:hover { - text-shadow: none; - color: #dadada; - background-color: #747474; + background-color: rgba(218, 218, 218, 0.1); } .sound-player-overlay StButton:active { - text-shadow: none; - color: white; - background-color: #0860F2; + background-color: rgba(218, 218, 218, 0.25); +} + +.sound-player-overlay StButton:insensitive { + opacty: 0.35; + color: rgba(218, 218, 218, 0.35); } .sound-player-overlay StLabel { @@ -2080,70 +1994,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #0860F2; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #0860F2; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2152,19 +2032,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(218, 218, 218, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #dadada; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2173,8 +2053,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #0860F2; + color: #dadada; + background-color: rgba(218, 218, 218, 0.25); } .applet-box:highlight { @@ -2189,17 +2069,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #dadada; text-shadow: none; } .applet-icon { color: #dadada; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #dadada; text-shadow: none; } @@ -2274,9 +2154,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark-yellow.css b/src/main/cinnamon/cinnamon-dark-yellow.css index 3e8c535f..4686483f 100644 --- a/src/main/cinnamon/cinnamon-dark-yellow.css +++ b/src/main/cinnamon/cinnamon-dark-yellow.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #F3BA4B; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #F3BA4B; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #F3BA4B; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #F3BA4B; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #F3BA4B; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #F3BA4B; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #F3BA4B; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -815,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -825,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -874,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +960,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #F3BA4B; @@ -1224,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #F3BA4B; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(0, 0, 0, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #F3BA4B; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #F3BA4B; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(243, 186, 75, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(243, 186, 75, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #F3BA4B; background-gradient-end: #F3BA4B; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #F3BA4B; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(243, 186, 75, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(243, 186, 75, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #F3BA4B; background-gradient-end: #F3BA4B; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1922,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1948,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1968,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2080,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #F3BA4B; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2156,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2174,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #F3BA4B; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2195,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2274,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-dark.css b/src/main/cinnamon/cinnamon-dark.css index 14f2ccbf..4f980fe0 100644 --- a/src/main/cinnamon/cinnamon-dark.css +++ b/src/main/cinnamon/cinnamon-dark.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dedede; border: 1px solid rgba(0, 0, 0, 0.15); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #dedede; background-color: #656565; border: 1px solid #0860F2; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #f8f8f8; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #6d6d6d; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #f8f8f8; background-color: #6d6d6d; border: 1px solid #0860F2; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #0860F2; border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(222, 222, 222, 0.35); border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgba(101, 101, 101, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #dedede; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #dedede; + background-color: rgba(222, 222, 222, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(222, 222, 222, 0.35); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #0860F2; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #dadada; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(36, 36, 36, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #777777; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #dedede; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.15); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #0860F2; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -538,22 +558,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #0860F2; } -.panel-top { - border-bottom: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-bottom { - border-top: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-left { - border-right: 1px solid rgba(0, 0, 0, 0.22); -} - -.panel-right { - border-left: 1px solid rgba(0, 0, 0, 0.22); -} - .panel-dummy { background-color: rgba(252, 65, 56, 0.5); } @@ -593,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -609,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -632,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #0860F2; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -738,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #242424; padding: 4px; padding-right: 0; @@ -812,26 +816,25 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .datemenu-date-label { padding: .4em 1.75em; - font-weight: bold; + font-weight: normal; text-align: center; + font-size: 14px; color: #dedede; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { - font-size: 80%; text-align: center; - width: 25px; - height: 25px; - padding: 0.1em; + width: 28px; + height: 28px; + padding: 0; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { color: rgba(222, 222, 222, 0.85); margin-top: 1em; - font-size: 70%; } .calendar-day { @@ -869,19 +872,29 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-week-number { + width: 20px; + height: 20px; + margin: 6px 0; color: rgba(222, 222, 222, 0.7); - font-size: 80%; + font-weight: bold; + background-color: rgba(222, 222, 222, 0.05); + border-radius: 100px; +} + +.calendar-week-number StLabel { + padding: 0; + margin-top: 3px; } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #dadada; - background-color: #333333; + background-color: #242424; } #notification .notification-button, #notification .notification-icon-button { @@ -889,7 +902,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(255, 255, 255, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(222, 222, 222, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -949,10 +969,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list { color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(51, 51, 51, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -965,7 +986,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1039,7 +1060,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1064,7 +1085,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #333333; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1095,7 +1116,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #0860F2; @@ -1224,7 +1245,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1252,7 +1273,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1263,26 +1284,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #333333; - border: 1px solid rgba(255, 255, 255, 0.12); - border-radius: 3px; + background-color: rgba(222, 222, 222, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(222, 222, 222, 0.1); } .menu-places-box { @@ -1305,7 +1322,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1319,7 +1336,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #0860F2; border: 1px solid rgba(0, 0, 0, 0.15); padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1336,15 +1353,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #242424; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1374,28 +1392,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.15); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #f8f8f8; - border: 1px solid rgba(0, 0, 0, 0.15); - background-color: #6d6d6d; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #dedede; + background-color: rgba(222, 222, 222, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(222, 222, 222, 0.35); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1446,7 +1459,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #dedede; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1467,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(0, 0, 0, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1478,17 +1490,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #0860F2; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #0860F2; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1522,7 +1534,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1579,72 +1591,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(8, 96, 242, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(8, 96, 242, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #0860F2; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1656,7 +1636,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0860F2; background-gradient-end: #0860F2; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1666,11 +1646,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #242424; - border-radius: 5px; + border-radius: 6px; color: #dedede; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1683,19 +1663,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #0860F2; + background-color: rgba(222, 222, 222, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(222, 222, 222, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1704,19 +1688,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(255, 255, 255, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1728,121 +1711,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(8, 96, 242, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(8, 96, 242, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #0860F2; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #0860F2; background-gradient-end: #0860F2; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1921,7 +1831,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player { - padding: 0 3px; + padding: 0 0; + margin-top: 6px; + border-radius: 6px; + background-color: rgba(255, 255, 255, 0.15); } .sound-player > StBoxLayout:first-child { @@ -1953,22 +1866,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player-overlay { width: 290px; - height: 70px; - padding: 15px; + height: 80px; + padding: 12px 16px 8px; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background-color: rgba(104, 104, 104, 0.9); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } .sound-player-overlay StButton { - width: 22px; + width: 16px; height: 16px; - padding: 6px; - margin: 0 2px; + padding: 8px; + margin: 0 6px 6px; color: #dadada; - border-radius: 3px; + border-radius: 100px; border: none; } @@ -1977,15 +1890,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-overlay StButton:hover { - text-shadow: none; - color: #dadada; - background-color: #747474; + background-color: rgba(218, 218, 218, 0.1); } .sound-player-overlay StButton:active { - text-shadow: none; - color: white; - background-color: #0860F2; + background-color: rgba(218, 218, 218, 0.25); +} + +.sound-player-overlay StButton:insensitive { + opacty: 0.35; + color: rgba(218, 218, 218, 0.35); } .sound-player-overlay StLabel { @@ -2080,70 +1994,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #0860F2; + background-color: rgba(222, 222, 222, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #0860F2; background-gradient-direction: none; + background-color: rgba(222, 222, 222, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(222, 222, 222, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2156,15 +2036,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2174,7 +2054,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #0860F2; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2195,7 +2075,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2274,9 +2154,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-blue.css b/src/main/cinnamon/cinnamon-light-blue.css index 63cbb05a..d03dceeb 100644 --- a/src/main/cinnamon/cinnamon-light-blue.css +++ b/src/main/cinnamon/cinnamon-light-blue.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #2E7CF7; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #2E7CF7; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #2E7CF7; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #2E7CF7; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #2E7CF7; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #2E7CF7; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #2E7CF7; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #2E7CF7; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(255, 255, 255, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #2E7CF7; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #2E7CF7; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(46, 124, 247, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(46, 124, 247, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #2E7CF7; background-gradient-end: #2E7CF7; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #2E7CF7; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(46, 124, 247, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(46, 124, 247, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #2E7CF7; background-gradient-end: #2E7CF7; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #2E7CF7; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2140,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2158,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #2E7CF7; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2179,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-green.css b/src/main/cinnamon/cinnamon-light-green.css index eff6e74e..86d1ebb1 100644 --- a/src/main/cinnamon/cinnamon-light-green.css +++ b/src/main/cinnamon/cinnamon-light-green.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #79B757; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #79B757; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #79B757; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #79B757; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #79B757; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #79B757; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #79B757; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #79B757; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(255, 255, 255, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #79B757; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #79B757; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(121, 183, 87, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(121, 183, 87, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #79B757; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #79B757; background-gradient-end: #79B757; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #79B757; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(121, 183, 87, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(121, 183, 87, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #79B757; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #79B757; background-gradient-end: #79B757; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #79B757; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #79B757; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2140,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2158,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #79B757; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2179,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-grey.css b/src/main/cinnamon/cinnamon-light-grey.css index a46ac980..16e889c1 100644 --- a/src/main/cinnamon/cinnamon-light-grey.css +++ b/src/main/cinnamon/cinnamon-light-grey.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #8C8C8C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #8C8C8C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #8C8C8C; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #8C8C8C; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #8C8C8C; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #8C8C8C; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #8C8C8C; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #8C8C8C; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(255, 255, 255, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #8C8C8C; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #8C8C8C; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(140, 140, 140, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(140, 140, 140, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #8C8C8C; background-gradient-end: #8C8C8C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #8C8C8C; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(140, 140, 140, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(140, 140, 140, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #8C8C8C; background-gradient-end: #8C8C8C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #8C8C8C; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2140,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2158,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #8C8C8C; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2179,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-orange.css b/src/main/cinnamon/cinnamon-light-orange.css index 9970a685..e27832a4 100644 --- a/src/main/cinnamon/cinnamon-light-orange.css +++ b/src/main/cinnamon/cinnamon-light-orange.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #E9873A; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #E9873A; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #E9873A; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #E9873A; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #E9873A; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #E9873A; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #E9873A; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E9873A; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(255, 255, 255, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #E9873A; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #E9873A; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(233, 135, 58, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(233, 135, 58, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #E9873A; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #E9873A; background-gradient-end: #E9873A; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #E9873A; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(233, 135, 58, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(233, 135, 58, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #E9873A; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #E9873A; background-gradient-end: #E9873A; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #E9873A; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #E9873A; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2140,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2158,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #E9873A; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2179,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-pink.css b/src/main/cinnamon/cinnamon-light-pink.css index b2eac813..7833a815 100644 --- a/src/main/cinnamon/cinnamon-light-pink.css +++ b/src/main/cinnamon/cinnamon-light-pink.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #E55E9C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #E55E9C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #E55E9C; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #E55E9C; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #E55E9C; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #E55E9C; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #E55E9C; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E55E9C; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(255, 255, 255, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #E55E9C; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #E55E9C; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(229, 94, 156, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(229, 94, 156, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #E55E9C; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #E55E9C; background-gradient-end: #E55E9C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #E55E9C; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(229, 94, 156, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(229, 94, 156, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #E55E9C; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #E55E9C; background-gradient-end: #E55E9C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #E55E9C; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #E55E9C; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2140,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2158,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #E55E9C; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2179,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-purple.css b/src/main/cinnamon/cinnamon-light-purple.css index cfecbd83..9c890bdc 100644 --- a/src/main/cinnamon/cinnamon-light-purple.css +++ b/src/main/cinnamon/cinnamon-light-purple.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #9A57A3; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #9A57A3; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #9A57A3; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #9A57A3; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #9A57A3; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #9A57A3; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #9A57A3; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #9A57A3; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(255, 255, 255, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #9A57A3; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #9A57A3; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(154, 87, 163, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(154, 87, 163, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #9A57A3; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #9A57A3; background-gradient-end: #9A57A3; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #9A57A3; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(154, 87, 163, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(154, 87, 163, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #9A57A3; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #9A57A3; background-gradient-end: #9A57A3; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #9A57A3; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #9A57A3; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2140,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2158,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #9A57A3; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2179,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-red.css b/src/main/cinnamon/cinnamon-light-red.css index 59940be3..d1c883b1 100644 --- a/src/main/cinnamon/cinnamon-light-red.css +++ b/src/main/cinnamon/cinnamon-light-red.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #ED5F5D; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #ED5F5D; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #ED5F5D; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #ED5F5D; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #ED5F5D; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #ED5F5D; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #ED5F5D; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #ED5F5D; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(255, 255, 255, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #ED5F5D; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #ED5F5D; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(237, 95, 93, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(237, 95, 93, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #ED5F5D; background-gradient-end: #ED5F5D; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #ED5F5D; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(237, 95, 93, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(237, 95, 93, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #ED5F5D; background-gradient-end: #ED5F5D; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #ED5F5D; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2140,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2158,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #ED5F5D; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2179,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-solid-blue.css b/src/main/cinnamon/cinnamon-light-solid-blue.css index 3beaf940..f3eb015a 100644 --- a/src/main/cinnamon/cinnamon-light-solid-blue.css +++ b/src/main/cinnamon/cinnamon-light-solid-blue.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #2E7CF7; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #2E7CF7; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #2E7CF7; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #2E7CF7; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #2E7CF7; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #2E7CF7; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #2E7CF7; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #2E7CF7; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #f1f1f1; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #2E7CF7; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #2E7CF7; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(54, 54, 54, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #363636; - border: 0 solid rgba(46, 124, 247, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(46, 124, 247, 0.5); + background-color: rgba(54, 54, 54, 0.3); } .window-list-item-box:focus { color: #363636; - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #363636 0%, #363636 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #2E7CF7; background-gradient-end: #2E7CF7; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #2E7CF7; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(54, 54, 54, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(54, 54, 54, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #363636; - border: 0 solid rgba(46, 124, 247, 0.35); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(46, 124, 247, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(54, 54, 54, 0.15); } .grouped-window-list-item-box:focus { color: #363636; - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(54, 54, 54, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #2E7CF7; background-gradient-end: #2E7CF7; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #2E7CF7; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #2E7CF7; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2136,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(54, 54, 54, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #363636; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2157,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #2E7CF7; + color: #363636; + background-color: rgba(54, 54, 54, 0.25); } .applet-box:highlight { @@ -2173,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #363636; text-shadow: none; } .applet-icon { color: #363636; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #363636; text-shadow: none; } @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-solid-green.css b/src/main/cinnamon/cinnamon-light-solid-green.css index a9916db7..ab1645c0 100644 --- a/src/main/cinnamon/cinnamon-light-solid-green.css +++ b/src/main/cinnamon/cinnamon-light-solid-green.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #79B757; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #79B757; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #79B757; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #79B757; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #79B757; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #79B757; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #79B757; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #79B757; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #f1f1f1; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #79B757; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #79B757; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(54, 54, 54, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #363636; - border: 0 solid rgba(121, 183, 87, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(121, 183, 87, 0.5); + background-color: rgba(54, 54, 54, 0.3); } .window-list-item-box:focus { color: #363636; - border: 0 solid #79B757; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #363636 0%, #363636 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #79B757; background-gradient-end: #79B757; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #79B757; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(54, 54, 54, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(54, 54, 54, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #363636; - border: 0 solid rgba(121, 183, 87, 0.35); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(121, 183, 87, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(54, 54, 54, 0.15); } .grouped-window-list-item-box:focus { color: #363636; - border: 0 solid #79B757; background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(54, 54, 54, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #79B757; background-gradient-end: #79B757; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #79B757; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #79B757; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2136,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(54, 54, 54, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #363636; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2157,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #79B757; + color: #363636; + background-color: rgba(54, 54, 54, 0.25); } .applet-box:highlight { @@ -2173,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #363636; text-shadow: none; } .applet-icon { color: #363636; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #363636; text-shadow: none; } @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-solid-grey.css b/src/main/cinnamon/cinnamon-light-solid-grey.css index 7a5152a3..dc6b7324 100644 --- a/src/main/cinnamon/cinnamon-light-solid-grey.css +++ b/src/main/cinnamon/cinnamon-light-solid-grey.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #8C8C8C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #8C8C8C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #8C8C8C; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #8C8C8C; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #8C8C8C; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #8C8C8C; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #8C8C8C; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #8C8C8C; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #f1f1f1; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #8C8C8C; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #8C8C8C; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(54, 54, 54, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #363636; - border: 0 solid rgba(140, 140, 140, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(140, 140, 140, 0.5); + background-color: rgba(54, 54, 54, 0.3); } .window-list-item-box:focus { color: #363636; - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #363636 0%, #363636 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #8C8C8C; background-gradient-end: #8C8C8C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #8C8C8C; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(54, 54, 54, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(54, 54, 54, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #363636; - border: 0 solid rgba(140, 140, 140, 0.35); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(140, 140, 140, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(54, 54, 54, 0.15); } .grouped-window-list-item-box:focus { color: #363636; - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(54, 54, 54, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #8C8C8C; background-gradient-end: #8C8C8C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #8C8C8C; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #8C8C8C; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2136,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(54, 54, 54, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #363636; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2157,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #8C8C8C; + color: #363636; + background-color: rgba(54, 54, 54, 0.25); } .applet-box:highlight { @@ -2173,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #363636; text-shadow: none; } .applet-icon { color: #363636; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #363636; text-shadow: none; } @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-solid-orange.css b/src/main/cinnamon/cinnamon-light-solid-orange.css index a9f1de14..1bbd8578 100644 --- a/src/main/cinnamon/cinnamon-light-solid-orange.css +++ b/src/main/cinnamon/cinnamon-light-solid-orange.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #E9873A; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #E9873A; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #E9873A; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #E9873A; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #E9873A; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #E9873A; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #E9873A; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E9873A; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #f1f1f1; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #E9873A; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #E9873A; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(54, 54, 54, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #363636; - border: 0 solid rgba(233, 135, 58, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(233, 135, 58, 0.5); + background-color: rgba(54, 54, 54, 0.3); } .window-list-item-box:focus { color: #363636; - border: 0 solid #E9873A; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #363636 0%, #363636 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #E9873A; background-gradient-end: #E9873A; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #E9873A; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(54, 54, 54, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(54, 54, 54, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #363636; - border: 0 solid rgba(233, 135, 58, 0.35); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(233, 135, 58, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(54, 54, 54, 0.15); } .grouped-window-list-item-box:focus { color: #363636; - border: 0 solid #E9873A; background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(54, 54, 54, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #E9873A; background-gradient-end: #E9873A; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #E9873A; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #E9873A; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2136,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(54, 54, 54, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #363636; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2157,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #E9873A; + color: #363636; + background-color: rgba(54, 54, 54, 0.25); } .applet-box:highlight { @@ -2173,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #363636; text-shadow: none; } .applet-icon { color: #363636; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #363636; text-shadow: none; } @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-solid-pink.css b/src/main/cinnamon/cinnamon-light-solid-pink.css index 1a623c5f..5fe797f8 100644 --- a/src/main/cinnamon/cinnamon-light-solid-pink.css +++ b/src/main/cinnamon/cinnamon-light-solid-pink.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #E55E9C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #E55E9C; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #E55E9C; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #E55E9C; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #E55E9C; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #E55E9C; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #E55E9C; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #E55E9C; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #f1f1f1; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #E55E9C; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #E55E9C; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(54, 54, 54, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #363636; - border: 0 solid rgba(229, 94, 156, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(229, 94, 156, 0.5); + background-color: rgba(54, 54, 54, 0.3); } .window-list-item-box:focus { color: #363636; - border: 0 solid #E55E9C; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #363636 0%, #363636 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #E55E9C; background-gradient-end: #E55E9C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #E55E9C; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(54, 54, 54, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(54, 54, 54, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #363636; - border: 0 solid rgba(229, 94, 156, 0.35); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(229, 94, 156, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(54, 54, 54, 0.15); } .grouped-window-list-item-box:focus { color: #363636; - border: 0 solid #E55E9C; background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(54, 54, 54, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #E55E9C; background-gradient-end: #E55E9C; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #E55E9C; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #E55E9C; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2136,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(54, 54, 54, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #363636; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2157,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #E55E9C; + color: #363636; + background-color: rgba(54, 54, 54, 0.25); } .applet-box:highlight { @@ -2173,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #363636; text-shadow: none; } .applet-icon { color: #363636; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #363636; text-shadow: none; } @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-solid-purple.css b/src/main/cinnamon/cinnamon-light-solid-purple.css index 531c1058..cbf7146c 100644 --- a/src/main/cinnamon/cinnamon-light-solid-purple.css +++ b/src/main/cinnamon/cinnamon-light-solid-purple.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #9A57A3; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #9A57A3; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #9A57A3; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #9A57A3; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #9A57A3; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #9A57A3; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #9A57A3; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #9A57A3; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #f1f1f1; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #9A57A3; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #9A57A3; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(54, 54, 54, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #363636; - border: 0 solid rgba(154, 87, 163, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(154, 87, 163, 0.5); + background-color: rgba(54, 54, 54, 0.3); } .window-list-item-box:focus { color: #363636; - border: 0 solid #9A57A3; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #363636 0%, #363636 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #9A57A3; background-gradient-end: #9A57A3; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #9A57A3; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(54, 54, 54, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(54, 54, 54, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #363636; - border: 0 solid rgba(154, 87, 163, 0.35); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(154, 87, 163, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(54, 54, 54, 0.15); } .grouped-window-list-item-box:focus { color: #363636; - border: 0 solid #9A57A3; background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(54, 54, 54, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #9A57A3; background-gradient-end: #9A57A3; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #9A57A3; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #9A57A3; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2136,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(54, 54, 54, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #363636; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2157,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #9A57A3; + color: #363636; + background-color: rgba(54, 54, 54, 0.25); } .applet-box:highlight { @@ -2173,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #363636; text-shadow: none; } .applet-icon { color: #363636; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #363636; text-shadow: none; } @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-solid-red.css b/src/main/cinnamon/cinnamon-light-solid-red.css index 925f434c..bd563e8f 100644 --- a/src/main/cinnamon/cinnamon-light-solid-red.css +++ b/src/main/cinnamon/cinnamon-light-solid-red.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #ED5F5D; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #ED5F5D; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #ED5F5D; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #ED5F5D; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #ED5F5D; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #ED5F5D; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #ED5F5D; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #ED5F5D; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #f1f1f1; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #ED5F5D; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #ED5F5D; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(54, 54, 54, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #363636; - border: 0 solid rgba(237, 95, 93, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(237, 95, 93, 0.5); + background-color: rgba(54, 54, 54, 0.3); } .window-list-item-box:focus { color: #363636; - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #363636 0%, #363636 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #ED5F5D; background-gradient-end: #ED5F5D; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #ED5F5D; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(54, 54, 54, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(54, 54, 54, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #363636; - border: 0 solid rgba(237, 95, 93, 0.35); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(237, 95, 93, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(54, 54, 54, 0.15); } .grouped-window-list-item-box:focus { color: #363636; - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(54, 54, 54, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #ED5F5D; background-gradient-end: #ED5F5D; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #ED5F5D; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #ED5F5D; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2136,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(54, 54, 54, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #363636; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2157,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #ED5F5D; + color: #363636; + background-color: rgba(54, 54, 54, 0.25); } .applet-box:highlight { @@ -2173,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #363636; text-shadow: none; } .applet-icon { color: #363636; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #363636; text-shadow: none; } @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-solid-yellow.css b/src/main/cinnamon/cinnamon-light-solid-yellow.css index 1f077fac..d538119d 100644 --- a/src/main/cinnamon/cinnamon-light-solid-yellow.css +++ b/src/main/cinnamon/cinnamon-light-solid-yellow.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #F3BA4B; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #F3BA4B; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #F3BA4B; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #F3BA4B; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #F3BA4B; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #F3BA4B; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #F3BA4B; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #F3BA4B; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #f1f1f1; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #F3BA4B; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #F3BA4B; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(54, 54, 54, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #363636; - border: 0 solid rgba(243, 186, 75, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(243, 186, 75, 0.5); + background-color: rgba(54, 54, 54, 0.3); } .window-list-item-box:focus { color: #363636; - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #363636 0%, #363636 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #F3BA4B; background-gradient-end: #F3BA4B; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #F3BA4B; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(54, 54, 54, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(54, 54, 54, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #363636; - border: 0 solid rgba(243, 186, 75, 0.35); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(243, 186, 75, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(54, 54, 54, 0.15); } .grouped-window-list-item-box:focus { color: #363636; - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(54, 54, 54, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #F3BA4B; background-gradient-end: #F3BA4B; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #F3BA4B; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2136,19 +2021,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(54, 54, 54, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #363636; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2157,8 +2042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #F3BA4B; + color: #363636; + background-color: rgba(54, 54, 54, 0.25); } .applet-box:highlight { @@ -2173,17 +2058,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #363636; text-shadow: none; } .applet-icon { color: #363636; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #363636; text-shadow: none; } @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-solid.css b/src/main/cinnamon/cinnamon-light-solid.css index 01d2e74a..e428f586 100644 --- a/src/main/cinnamon/cinnamon-light-solid.css +++ b/src/main/cinnamon/cinnamon-light-solid.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #0860F2; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #0860F2; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #0860F2; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #0860F2; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: #2a2a2a; color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #0860F2; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid #2a2a2a; color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #0860F2; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -796,26 +816,25 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .datemenu-date-label { padding: .4em 1.75em; - font-weight: bold; + font-weight: normal; text-align: center; + font-size: 14px; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { - font-size: 80%; text-align: center; - width: 25px; - height: 25px; - padding: 0.1em; + width: 28px; + height: 28px; + padding: 0; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { color: rgba(36, 36, 36, 0.85); margin-top: 1em; - font-size: 70%; } .calendar-day { @@ -853,19 +872,29 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-week-number { + width: 20px; + height: 20px; + margin: 6px 0; color: rgba(36, 36, 36, 0.7); - font-size: 80%; + font-weight: bold; + background-color: rgba(36, 36, 36, 0.05); + border-radius: 100px; +} + +.calendar-week-number StLabel { + padding: 0; + margin-top: 3px; } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +902,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +968,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: #2a2a2a; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +986,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1060,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1085,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1116,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #0860F2; @@ -1208,7 +1245,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1273,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: #2a2a2a; -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1284,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1322,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1336,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #0860F2; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1353,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1392,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1459,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: #f1f1f1; border: none; - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1490,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #0860F2; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #0860F2; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1534,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(54, 54, 54, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1591,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: #363636; - border: 0 solid rgba(8, 96, 242, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(54, 54, 54, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(8, 96, 242, 0.5); + background-color: rgba(54, 54, 54, 0.3); } .window-list-item-box:focus { color: #363636; - border: 0 solid #0860F2; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, #363636 0%, #363636 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1636,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0860F2; background-gradient-end: #0860F2; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1646,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1663,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #0860F2; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1688,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(54, 54, 54, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1711,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(54, 54, 54, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: #363636; - border: 0 solid rgba(54, 54, 54, 0.5); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: #363636; - border: 0 solid rgba(8, 96, 242, 0.35); background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(8, 96, 242, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(54, 54, 54, 0.15); } .grouped-window-list-item-box:focus { color: #363636; - border: 0 solid #0860F2; background-gradient-direction: none; + background-color: rgba(54, 54, 54, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(54, 54, 54, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #0860F2; background-gradient-end: #0860F2; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1905,7 +1831,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player { - padding: 0 3px; + padding: 0 0; + margin-top: 6px; + border-radius: 6px; + background-color: rgba(255, 255, 255, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1937,22 +1866,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player-overlay { width: 290px; - height: 70px; - padding: 15px; + height: 80px; + padding: 12px 16px 8px; spacing: 0.5em; - background: rgba(29, 29, 29, 0.9); - border: 0px solid #161616; - border-bottom: 1px; + background-color: rgba(69, 69, 69, 0.9); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } .sound-player-overlay StButton { - width: 22px; + width: 16px; height: 16px; - padding: 6px; - margin: 0 2px; + padding: 8px; + margin: 0 6px 6px; color: #dadada; - border-radius: 3px; + border-radius: 100px; border: none; } @@ -1961,15 +1890,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-overlay StButton:hover { - text-shadow: none; - color: #dadada; - background-color: #747474; + background-color: rgba(218, 218, 218, 0.1); } .sound-player-overlay StButton:active { - text-shadow: none; - color: white; - background-color: #0860F2; + background-color: rgba(218, 218, 218, 0.25); +} + +.sound-player-overlay StButton:insensitive { + opacty: 0.35; + color: rgba(218, 218, 218, 0.35); } .sound-player-overlay StLabel { @@ -2064,70 +1994,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #0860F2; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #0860F2; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2136,19 +2032,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-separator-line { width: 1px; - background: rgba(255, 255, 255, 0.12); + background: rgba(54, 54, 54, 0.12); } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: #363636; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2157,8 +2053,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked, .applet-box:checked:hover { - color: white; - background-color: #0860F2; + color: #363636; + background-color: rgba(54, 54, 54, 0.25); } .applet-box:highlight { @@ -2173,17 +2069,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box:checked .applet-label { - color: white; + color: #363636; text-shadow: none; } .applet-icon { color: #363636; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { - color: white; + color: #363636; text-shadow: none; } @@ -2258,9 +2154,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light-yellow.css b/src/main/cinnamon/cinnamon-light-yellow.css index 74f3e5e4..16a5c236 100644 --- a/src/main/cinnamon/cinnamon-light-yellow.css +++ b/src/main/cinnamon/cinnamon-light-yellow.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #F3BA4B; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #F3BA4B; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #F3BA4B; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #F3BA4B; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #F3BA4B; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #F3BA4B; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -799,7 +819,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; text-align: center; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { @@ -809,7 +829,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { height: 25px; padding: 0.1em; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { @@ -858,14 +878,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +893,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +959,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +977,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1051,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1076,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1107,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #F3BA4B; @@ -1208,7 +1236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1275,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1313,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1327,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #F3BA4B; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1344,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1383,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1450,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1470,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(255, 255, 255, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1481,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #F3BA4B; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #F3BA4B; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1525,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1582,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(243, 186, 75, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(243, 186, 75, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1627,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #F3BA4B; background-gradient-end: #F3BA4B; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1637,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1654,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #F3BA4B; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1679,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1702,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(243, 186, 75, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(243, 186, 75, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #F3BA4B; background-gradient-end: #F3BA4B; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1906,6 +1823,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player { padding: 0 3px; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1932,17 +1851,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-generic-coverart { - background: rgba(0, 0, 0, 0.2); + background: rgba(34, 34, 34, 0.95); } .sound-player-overlay { width: 290px; height: 70px; - padding: 15px; + padding: 15px 0; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background: rgba(34, 34, 34, 0.95); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } @@ -1952,7 +1871,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px; margin: 0 2px; color: #dadada; - border-radius: 3px; + border-radius: 6px; border: none; } @@ -2064,70 +1983,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #F3BA4B; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #F3BA4B; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2140,15 +2025,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2158,7 +2043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #F3BA4B; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2179,7 +2064,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2258,9 +2143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/cinnamon/cinnamon-light.css b/src/main/cinnamon/cinnamon-light.css index 786b4c22..3cca5602 100644 --- a/src/main/cinnamon/cinnamon-light.css +++ b/src/main/cinnamon/cinnamon-light.css @@ -8,11 +8,11 @@ stage { color: rgba(0, 0, 0, 0); } -.sound-button, .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 { +.sound-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #242424; border: 1px solid rgba(0, 0, 0, 0.12); @@ -20,54 +20,82 @@ stage { box-shadow: inset 0 1px white; } -.sound-button:focus, .notification-button:focus, .notification-icon-button:focus, #notification .notification-button:focus, #notification .notification-icon-button:focus { +.sound-button:focus { text-shadow: none; color: #242424; background-color: white; border: 1px solid #0860F2; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover, .notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { +.sound-button:hover { text-shadow: none; color: #0b0b0b; border: 1px solid rgba(0, 0, 0, 0.12); background-color: #ffffff; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, #notification .notification-button:hover:focus, #notification .notification-icon-button:hover:focus { +.sound-button:hover:focus { text-shadow: none; color: #0b0b0b; background-color: #ffffff; border: 1px solid #0860F2; box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; } -.sound-button:active, .notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { +.sound-button:active { text-shadow: none; color: white; background-color: #0860F2; border: 1px solid #487afa; - border-radius: 5px; + border-radius: 6px; } -.sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { +.sound-button:insensitive { text-shadow: none; color: rgba(36, 36, 36, 0.45); border: 1px solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.55); - border-radius: 5px; + border-radius: 6px; +} + +.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 { + border-radius: 6px; + text-shadow: none; + color: #242424; + background-color: transparent; +} + +.notification-button:hover, .notification-icon-button:hover, #notification .notification-button:hover, #notification .notification-icon-button:hover { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; +} + +.notification-button:active, .notification-icon-button:active, #notification .notification-button:active, #notification .notification-icon-button:active { + text-shadow: none; + color: #242424; + background-color: rgba(36, 36, 36, 0.2); + border-radius: 6px; +} + +.notification-button:insensitive, .notification-icon-button:insensitive, #notification .notification-button:insensitive, #notification .notification-icon-button:insensitive { + text-shadow: none; + color: rgba(36, 36, 36, 0.45); + background-color: transparent; + border-radius: 6px; } .modal-dialog-button-box .modal-dialog-button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: 6px; text-shadow: none; color: #dadada; background-color: rgba(98, 98, 98, 0.96); @@ -101,7 +129,7 @@ stage { selection-background-color: #0860F2; selected-color: white; transition-duration: 300ms; - border-radius: 5px; + border-radius: 6px; color: #363636; border: 2px solid transparent; background-color: rgba(0, 0, 0, 0.05); @@ -143,11 +171,11 @@ StScrollView StScrollBar { StScrollBar StBin#trough { background-color: rgba(255, 255, 255, 0.1); - border-radius: 8px; + border-radius: 100px; } StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: #a1a1a1; border: 0px solid; margin: 0px; @@ -278,7 +306,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #Tooltip { - border-radius: 3px; + border-radius: 6px; padding: 5px 12px; background-color: rgba(42, 42, 42, 0.9); color: #dadada; @@ -290,9 +318,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu, .popup-menu, .popup-combo-menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: #242424; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .menu-arrow, @@ -303,21 +331,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-sub-menu, .popup-menu .popup-sub-menu, .popup-combo-menu .popup-sub-menu { + border-radius: 6px; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; -} - -.menu .popup-sub-menu .popup-menu-item:ltr, -.popup-menu .popup-sub-menu .popup-menu-item:ltr, -.popup-combo-menu .popup-sub-menu .popup-menu-item:ltr { - padding-right: 8px; -} - -.menu .popup-sub-menu .popup-menu-item:rtl, -.popup-menu .popup-sub-menu .popup-menu-item:rtl, -.popup-combo-menu .popup-sub-menu .popup-menu-item:rtl { - padding-left: 8px; + background-color: rgba(255, 255, 255, 0.75); } .menu .popup-sub-menu StScrollBar, @@ -337,7 +354,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu .popup-menu-content, .popup-menu .popup-menu-content, .popup-combo-menu .popup-menu-content { - padding: 1em 0em 1em 0em; + padding: 1em 6px 1em 6px; } .menu .popup-menu-item, @@ -345,13 +362,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-combo-menu .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: 6px; } -.menu .popup-menu-item:active, +.menu .popup-menu-item:active, .menu .popup-menu-item:checked, .popup-menu .popup-menu-item:active, -.popup-combo-menu .popup-menu-item:active { +.popup-menu .popup-menu-item:checked, +.popup-combo-menu .popup-menu-item:active, +.popup-combo-menu .popup-menu-item:checked { color: white; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: #0860F2; } .menu .popup-menu-item:insensitive, @@ -385,14 +405,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(0, 0, 0, 0); -arrow-border-width: 0; -arrow-border-color: rgba(0, 0, 0, 0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: 6px; } .popup-combo-menu { @@ -577,7 +597,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border: 1px solid rgba(42, 42, 42, 0.9); color: #dadada; spacing: 25px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -593,7 +613,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .expo-workspaces-name-entry, #selected.expo-workspaces-name-entry { height: 15px; - border-radius: 2px; + border-radius: 6px; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -616,13 +636,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: 2px; + border-radius: 6px; } #active.expo-workspace-thumbnail-frame { border: 4px solid #0860F2; background-color: black; - border-radius: 2px; + border-radius: 6px; } .expo-background { @@ -722,7 +742,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .about-scrollBox { border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 2px; + border-radius: 6px; background-color: #ffffff; padding: 4px; padding-right: 0; @@ -796,26 +816,25 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .datemenu-date-label { padding: .4em 1.75em; - font-weight: bold; + font-weight: normal; text-align: center; + font-size: 14px; color: #242424; - border-radius: 2px; + border-radius: 6px; } .calendar-day-base { - font-size: 80%; text-align: center; - width: 25px; - height: 25px; - padding: 0.1em; + width: 28px; + height: 28px; + padding: 0; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { color: rgba(36, 36, 36, 0.85); margin-top: 1em; - font-size: 70%; } .calendar-day { @@ -853,19 +872,29 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-week-number { + width: 20px; + height: 20px; + margin: 6px 0; color: rgba(36, 36, 36, 0.7); - font-size: 80%; + font-weight: bold; + background-color: rgba(36, 36, 36, 0.05); + border-radius: 100px; +} + +.calendar-week-number StLabel { + padding: 0; + margin-top: 3px; } #notification { - border-radius: 3px; + border-radius: 12px; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: #363636; - background-color: #f5f5f5; + background-color: #ffffff; } #notification .notification-button, #notification .notification-icon-button { @@ -873,7 +902,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu #notification, .popup-menu #notification { - border: 1px solid rgba(0, 0, 0, 0.12); + border: none; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.05); +} + +.menu #notification:hover, .popup-menu #notification:hover { + background-color: rgba(36, 36, 36, 0.1); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15); } .menu #notification, .menu #notification.multi-line-notification, .popup-menu #notification, .popup-menu #notification.multi-line-notification { @@ -932,11 +968,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list { - color: #dadada; - background-color: rgba(42, 42, 42, 0.9); - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + color: #363636; + background-color: rgba(255, 255, 255, 0.95); + border: none; + border-radius: 6px; padding: 20px; + border-image: url("assets/menu.svg") 17 17 17 17; } .switcher-list > StBoxLayout { @@ -949,7 +986,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-list .item-box { padding: 8px; - border-radius: 2px; + border-radius: 6px; } .switcher-list .item-box:outlined { @@ -1023,7 +1060,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(34, 34, 34, 0.95); border: 1px solid rgba(0, 0, 0, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: 6px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.75), 0 5px 18px rgba(0, 0, 0, 0.55); } @@ -1048,7 +1085,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog { padding: 0px 15px 10px 15px; background-color: #f5f5f5; - border-radius: 5px; + border-radius: 6px; } .run-dialog > * { @@ -1079,7 +1116,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .run-dialog-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: 6px; caret-color: #dadada; selected-color: white; selection-background-color: #0860F2; @@ -1208,7 +1245,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: 6px; box-shadow: none; text-shadow: none; color: #dadada; @@ -1236,7 +1273,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-subkeys { color: #dadada; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: 6px; -arrow-background-color: rgba(42, 42, 42, 0.9); -arrow-border-width: 1px; -arrow-border-color: rgba(0, 0, 0, 0.4); @@ -1247,26 +1284,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: #f5f5f5; - border: 1px solid rgba(0, 0, 0, 0.12); - border-radius: 3px; + background-color: rgba(36, 36, 36, 0.05); + border: none; + border-radius: 6px; } .menu-favorites-button { padding: 10px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border: none; + border-radius: 6px; } .menu-favorites-button:hover { - text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + border-radius: 6px; + background-color: rgba(36, 36, 36, 0.1); } .menu-places-box { @@ -1289,7 +1322,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-application-button { padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1303,7 +1336,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: #0860F2; border: 1px solid #487afa; padding: 6px; - border-radius: 2px; + border-radius: 6px; border: none; } @@ -1320,15 +1353,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .menu StScrollView.menu-application-button { - padding: 0; - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.12); + padding: 3px 0; + border-radius: 6px; background-color: #ffffff; } .menu StScrollView.menu-application-button .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: 6px; } .menu StScrollView.menu-application-button .popup-menu-item:ltr { @@ -1358,28 +1392,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .menu-category-button { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0); - border-radius: 5px; + border-radius: 6px; } .menu-category-button-selected { padding: 6px; - border: 1px solid rgba(0, 0, 0, 0.12); } .menu-category-button-hover, .menu-category-button-selected { text-shadow: none; - color: #0b0b0b; - border: 1px solid rgba(0, 0, 0, 0.12); - background-color: #ffffff; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.12); - border-radius: 5px; + color: #242424; + background-color: rgba(36, 36, 36, 0.1); + border-radius: 6px; } .menu-category-button-greyed { padding: 6px; color: rgba(36, 36, 36, 0.45); - border: 1px solid rgba(0, 0, 0, 0); } .menu-category-button-label:ltr { @@ -1430,7 +1459,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: #242424; } -/* Context menu (at the moment only for favorites) */ .info-osd { text-align: center; font-weight: bold; @@ -1451,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 0; background-color: rgba(255, 255, 255, 0.16); border: none; - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } .osd-window .osd-monitor-label { @@ -1462,17 +1490,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0; height: 4px; background-color: rgba(0, 0, 0, 0.35); - border-radius: 2px; + border-radius: 6px; color: #0860F2; } .osd-window .level-bar { - border-radius: 2px; + border-radius: 6px; background-color: #0860F2; } .window-list-box { - spacing: 0; + spacing: 2px; } .panel-bottom .window-list-box:ltr, .panel-top .window-list-box:ltr { @@ -1506,7 +1534,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; transition-duration: 100; color: rgba(255, 255, 255, 0.9); - border: 0 solid transparent; + border-radius: 6px; } .panel-bottom .window-list-item-box StLabel { @@ -1563,72 +1591,40 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:hover { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.15); } .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:running { color: white; - border: 0 solid rgba(8, 96, 242, 0.35); background-gradient-direction: none; -} - -.panel-top .window-list-item-box:active, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .window-list-item-box:active, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .window-list-item-box:active, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:running { - border-right-width: 2px; + background-color: rgba(255, 255, 255, 0.25); } .window-list-item-box:active:hover, .window-list-item-box:checked:hover, .window-list-item-box:running:hover { - border-color: rgba(8, 96, 242, 0.5); + background-color: rgba(255, 255, 255, 0.3); } .window-list-item-box:focus { color: white; - border: 0 solid #0860F2; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, white 0%, white 100%); } .panel-top .window-list-item-box:focus { - border-top-width: 2px; + background-position: top center; } .panel-bottom .window-list-item-box:focus { - border-bottom-width: 2px; + background-position: bottom center; } .panel-left .window-list-item-box:focus { - border-left-width: 2px; + background-position: left center; } .panel-right .window-list-item-box:focus { - border-right-width: 2px; + background-position: right center; } .window-list-item-box.right, .window-list-item-box.left { @@ -1640,7 +1636,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-gradient-direction: vertical; background-gradient-start: #0860F2; background-gradient-end: #0860F2; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1650,11 +1646,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-list-preview { - padding: 12px; + padding: 16px; spacing: 8px; border: none; background-color: #ffffff; - border-radius: 5px; + border-radius: 6px; color: #242424; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.35), 0 3px 12px rgba(0, 0, 0, 0.16); } @@ -1667,19 +1663,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(252, 65, 56, 0.5); } -.grouped-window-list-thumbnail-menu .item-box { +.grouped-window-list-thumbnail-menu { padding: 6px; - border-radius: 2px; - spacing: 4px; +} + +.grouped-window-list-thumbnail-menu .item-box { + padding: 8px; + border-radius: 6px; + spacing: 8px; + margin: 2px; } .grouped-window-list-thumbnail-menu .item-box:outlined { - padding: 2px; - border: 2px solid #0860F2; + background-color: rgba(36, 36, 36, 0.1); } -.grouped-window-list-thumbnail-menu .item-box:selected { - background-color: rgba(255, 255, 255, 0.33); +.grouped-window-list-thumbnail-menu .item-box:hover { + background-color: rgba(36, 36, 36, 0.15); } .grouped-window-list-thumbnail-menu .thumbnail { @@ -1688,19 +1688,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .grouped-window-list-thumbnail-menu .separator { width: 1px; - background-color: rgba(255, 255, 255, 0.33); + background-color: rgba(0, 0, 0, 0.12); } .grouped-window-list-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: white; padding: 0; } .grouped-window-list-button-label { - padding-left: 4px; + padding-left: 2px; } .grouped-window-list-badge { @@ -1712,121 +1711,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba(255, 255, 255, 0.6); - border: 0 solid transparent; + border-radius: 6px; + spacing: 0.5em; } -.grouped-window-list-item-box.top { - border-top-width: 2px; -} - -.grouped-window-list-item-box.top StIcon, .grouped-window-list-item-box.top StBin, .grouped-window-list-item-box.top #appMenuIcon { - padding: 2px; - padding-top: 0; -} - -.grouped-window-list-item-box.bottom { - border-bottom-width: 2px; -} - -.grouped-window-list-item-box.bottom StIcon, .grouped-window-list-item-box.bottom StBin, .grouped-window-list-item-box.bottom #appMenuIcon { - padding: 2px; - padding-bottom: 0; -} - -.grouped-window-list-item-box.left { - border-left-width: 2px; -} - -.grouped-window-list-item-box.left StIcon, .grouped-window-list-item-box.left StBin, .grouped-window-list-item-box.left #appMenuIcon { - padding: 2px; - padding-left: 0; -} - -.grouped-window-list-item-box.right { - border-right-width: 2px; -} - -.grouped-window-list-item-box.right StIcon, .grouped-window-list-item-box.right StBin, .grouped-window-list-item-box.right #appMenuIcon { - padding: 2px; - padding-right: 0; +.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom { + padding: 0 2px; } .grouped-window-list-item-box:hover { color: white; - border: 0 solid rgba(255, 255, 255, 0.5); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.15); } -.panel-top .grouped-window-list-item-box:hover { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:hover { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:hover { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:hover { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked, .grouped-window-list-item-box:running { +.grouped-window-list-item-box:active { color: white; - border: 0 solid rgba(8, 96, 242, 0.35); background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.08); } -.panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked, .panel-top .grouped-window-list-item-box:running { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked, .panel-bottom .grouped-window-list-item-box:running { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked, .panel-left .grouped-window-list-item-box:running { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked, .panel-right .grouped-window-list-item-box:running { - border-right-width: 2px; -} - -.grouped-window-list-item-box:active:hover, .grouped-window-list-item-box:checked:hover, .grouped-window-list-item-box:running:hover { - border-color: rgba(8, 96, 242, 0.5); +.grouped-window-list-item-box:active:hover { + background-color: rgba(255, 255, 255, 0.15); } .grouped-window-list-item-box:focus { color: white; - border: 0 solid #0860F2; background-gradient-direction: none; + background-color: rgba(255, 255, 255, 0.3); } -.panel-top .grouped-window-list-item-box:focus { - border-top-width: 2px; -} - -.panel-bottom .grouped-window-list-item-box:focus { - border-bottom-width: 2px; -} - -.panel-left .grouped-window-list-item-box:focus { - border-left-width: 2px; -} - -.panel-right .grouped-window-list-item-box:focus { - border-right-width: 2px; +.grouped-window-list-item-box:focus:hover { + background-color: rgba(255, 255, 255, 0.36); } .grouped-window-list-item-box .progress { background-gradient-direction: vertical; background-gradient-start: #0860F2; background-gradient-end: #0860F2; - border-radius: 2px; + border-radius: 6px; box-shadow: none; } @@ -1905,7 +1831,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player { - padding: 0 3px; + padding: 0 0; + margin-top: 6px; + border-radius: 6px; + background-color: rgba(255, 255, 255, 0.75); } .sound-player > StBoxLayout:first-child { @@ -1937,22 +1866,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .sound-player-overlay { width: 290px; - height: 70px; - padding: 15px; + height: 80px; + padding: 12px 16px 8px; spacing: 0.5em; - background: rgba(29, 29, 29, 0.8); - border: 0px solid rgba(22, 22, 22, 0.9); - border-bottom: 1px; + background-color: rgba(69, 69, 69, 0.9); + border: none; + border-radius: 0 0 6px 6px; color: #dadada; } .sound-player-overlay StButton { - width: 22px; + width: 16px; height: 16px; - padding: 6px; - margin: 0 2px; + padding: 8px; + margin: 0 6px 6px; color: #dadada; - border-radius: 3px; + border-radius: 100px; border: none; } @@ -1961,15 +1890,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .sound-player-overlay StButton:hover { - text-shadow: none; - color: #dadada; - background-color: #747474; + background-color: rgba(218, 218, 218, 0.1); } .sound-player-overlay StButton:active { - text-shadow: none; - color: white; - background-color: #0860F2; + background-color: rgba(218, 218, 218, 0.25); +} + +.sound-player-overlay StButton:insensitive { + opacty: 0.35; + color: rgba(218, 218, 218, 0.35); } .sound-player-overlay StLabel { @@ -2064,70 +1994,36 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: 6px; } .panel-launcher:hover { background-gradient-direction: none; - border: 0px solid #0860F2; + background-color: rgba(36, 36, 36, 0.1); } -.panel-bottom .panel-launcher:hover { - border-bottom-width: 2px; - padding-bottom: 0; -} - -.panel-top .panel-launcher:hover { - border-top-width: 2px; - padding-top: 0; -} - -.panel-left .panel-launcher:hover { - border-left-width: 2px; - padding-left: 0; -} - -.panel-right .panel-launcher:hover { - border-right-width: 2px; - padding-right: 0; +.panel-launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher { padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: 6px; } .launcher:hover { - border: 0 solid #0860F2; background-gradient-direction: none; + background-color: rgba(36, 36, 36, 0.1); } -.panel-top .launcher:hover { - padding-top: 0; - border-top-width: 2px; -} - -.panel-bottom .launcher:hover { - padding-bottom: 0; - border-bottom-width: 2px; -} - -.panel-left .launcher:hover { - padding-left: 0; - border-left-width: 2px; -} - -.panel-right .launcher:hover { - padding-right: 0; - border-right-width: 2px; +.launcher:active { + background-color: rgba(36, 36, 36, 0.2); } .launcher .icon-box { - padding: 0 2px; -} - -.launcher .icon-box.vertical { - padding: 2px 0; + padding: 2px; } .applet-separator { @@ -2140,15 +2036,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .applet-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: white; text-shadow: none; transition-duration: 100; + border-radius: 6px; } .applet-box.vertical { - padding: 3px 0; + padding: 8px 0; } .applet-box:hover { @@ -2158,7 +2054,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-box:checked, .applet-box:checked:hover { color: white; - background-color: #0860F2; + background-color: rgba(255, 255, 255, 0.25); } .applet-box:highlight { @@ -2179,7 +2075,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .applet-icon { color: white; - icon-size: 22px; + icon-size: 16px; } .applet-box:checked .applet-icon { @@ -2258,9 +2154,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-bottom: 16px; } -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/main/gtk-3.0/gtk-dark-blue.css b/src/main/gtk-3.0/gtk-dark-blue.css index d1e747c9..73d1a7fd 100644 --- a/src/main/gtk-3.0/gtk-dark-blue.css +++ b/src/main/gtk-3.0/gtk-dark-blue.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-green.css b/src/main/gtk-3.0/gtk-dark-green.css index 77fe0df4..8c818ae6 100644 --- a/src/main/gtk-3.0/gtk-dark-green.css +++ b/src/main/gtk-3.0/gtk-dark-green.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-grey.css b/src/main/gtk-3.0/gtk-dark-grey.css index ed3e877e..16a47159 100644 --- a/src/main/gtk-3.0/gtk-dark-grey.css +++ b/src/main/gtk-3.0/gtk-dark-grey.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-orange.css b/src/main/gtk-3.0/gtk-dark-orange.css index 0d792b8b..b79e06f8 100644 --- a/src/main/gtk-3.0/gtk-dark-orange.css +++ b/src/main/gtk-3.0/gtk-dark-orange.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-pink.css b/src/main/gtk-3.0/gtk-dark-pink.css index b95aa8bb..741c921b 100644 --- a/src/main/gtk-3.0/gtk-dark-pink.css +++ b/src/main/gtk-3.0/gtk-dark-pink.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-purple.css b/src/main/gtk-3.0/gtk-dark-purple.css index 79d48c5d..384cd104 100644 --- a/src/main/gtk-3.0/gtk-dark-purple.css +++ b/src/main/gtk-3.0/gtk-dark-purple.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-red.css b/src/main/gtk-3.0/gtk-dark-red.css index 2ef39fae..54ca338d 100644 --- a/src/main/gtk-3.0/gtk-dark-red.css +++ b/src/main/gtk-3.0/gtk-dark-red.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-solid-blue.css b/src/main/gtk-3.0/gtk-dark-solid-blue.css index a9ccbf77..93d27105 100644 --- a/src/main/gtk-3.0/gtk-dark-solid-blue.css +++ b/src/main/gtk-3.0/gtk-dark-solid-blue.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-solid-green.css b/src/main/gtk-3.0/gtk-dark-solid-green.css index d0ed13cb..ad61e815 100644 --- a/src/main/gtk-3.0/gtk-dark-solid-green.css +++ b/src/main/gtk-3.0/gtk-dark-solid-green.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-solid-grey.css b/src/main/gtk-3.0/gtk-dark-solid-grey.css index f5d0c45c..eaebf290 100644 --- a/src/main/gtk-3.0/gtk-dark-solid-grey.css +++ b/src/main/gtk-3.0/gtk-dark-solid-grey.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-solid-orange.css b/src/main/gtk-3.0/gtk-dark-solid-orange.css index aea95047..b1462202 100644 --- a/src/main/gtk-3.0/gtk-dark-solid-orange.css +++ b/src/main/gtk-3.0/gtk-dark-solid-orange.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-solid-pink.css b/src/main/gtk-3.0/gtk-dark-solid-pink.css index f46764ec..6720f7c7 100644 --- a/src/main/gtk-3.0/gtk-dark-solid-pink.css +++ b/src/main/gtk-3.0/gtk-dark-solid-pink.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-solid-purple.css b/src/main/gtk-3.0/gtk-dark-solid-purple.css index f4d63676..74b3104a 100644 --- a/src/main/gtk-3.0/gtk-dark-solid-purple.css +++ b/src/main/gtk-3.0/gtk-dark-solid-purple.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-solid-red.css b/src/main/gtk-3.0/gtk-dark-solid-red.css index 011a9163..1e8d7138 100644 --- a/src/main/gtk-3.0/gtk-dark-solid-red.css +++ b/src/main/gtk-3.0/gtk-dark-solid-red.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-solid-yellow.css b/src/main/gtk-3.0/gtk-dark-solid-yellow.css index 2bf59659..91ad3636 100644 --- a/src/main/gtk-3.0/gtk-dark-solid-yellow.css +++ b/src/main/gtk-3.0/gtk-dark-solid-yellow.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-dark-yellow.css b/src/main/gtk-3.0/gtk-dark-yellow.css index 43cdedbb..0fea7007 100644 --- a/src/main/gtk-3.0/gtk-dark-yellow.css +++ b/src/main/gtk-3.0/gtk-dark-yellow.css @@ -4099,7 +4099,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(255, 255, 255, 0.25); - border-color: rgba(0, 0, 0, 0.25); + border-color: rgba(0, 0, 0, 0.15); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-blue.css b/src/main/gtk-3.0/gtk-light-blue.css index 55ff6277..ee26e77b 100644 --- a/src/main/gtk-3.0/gtk-light-blue.css +++ b/src/main/gtk-3.0/gtk-light-blue.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-green.css b/src/main/gtk-3.0/gtk-light-green.css index 10d53ec3..644890bf 100644 --- a/src/main/gtk-3.0/gtk-light-green.css +++ b/src/main/gtk-3.0/gtk-light-green.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-grey.css b/src/main/gtk-3.0/gtk-light-grey.css index 64cf0711..1673a574 100644 --- a/src/main/gtk-3.0/gtk-light-grey.css +++ b/src/main/gtk-3.0/gtk-light-grey.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-orange.css b/src/main/gtk-3.0/gtk-light-orange.css index 0ee1f1aa..da5e1c5e 100644 --- a/src/main/gtk-3.0/gtk-light-orange.css +++ b/src/main/gtk-3.0/gtk-light-orange.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-pink.css b/src/main/gtk-3.0/gtk-light-pink.css index 28ad9546..804659e5 100644 --- a/src/main/gtk-3.0/gtk-light-pink.css +++ b/src/main/gtk-3.0/gtk-light-pink.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-purple.css b/src/main/gtk-3.0/gtk-light-purple.css index d86814f7..0ac8f102 100644 --- a/src/main/gtk-3.0/gtk-light-purple.css +++ b/src/main/gtk-3.0/gtk-light-purple.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-red.css b/src/main/gtk-3.0/gtk-light-red.css index d7f2fac3..7f24f220 100644 --- a/src/main/gtk-3.0/gtk-light-red.css +++ b/src/main/gtk-3.0/gtk-light-red.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-solid-blue.css b/src/main/gtk-3.0/gtk-light-solid-blue.css index 1a819f67..fc9eff74 100644 --- a/src/main/gtk-3.0/gtk-light-solid-blue.css +++ b/src/main/gtk-3.0/gtk-light-solid-blue.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-solid-green.css b/src/main/gtk-3.0/gtk-light-solid-green.css index 0f4a2e86..65f528a0 100644 --- a/src/main/gtk-3.0/gtk-light-solid-green.css +++ b/src/main/gtk-3.0/gtk-light-solid-green.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-solid-grey.css b/src/main/gtk-3.0/gtk-light-solid-grey.css index d4666e0d..ee9dedd8 100644 --- a/src/main/gtk-3.0/gtk-light-solid-grey.css +++ b/src/main/gtk-3.0/gtk-light-solid-grey.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-solid-orange.css b/src/main/gtk-3.0/gtk-light-solid-orange.css index 605908b9..b5fc1768 100644 --- a/src/main/gtk-3.0/gtk-light-solid-orange.css +++ b/src/main/gtk-3.0/gtk-light-solid-orange.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-solid-pink.css b/src/main/gtk-3.0/gtk-light-solid-pink.css index b4607693..4157dbb9 100644 --- a/src/main/gtk-3.0/gtk-light-solid-pink.css +++ b/src/main/gtk-3.0/gtk-light-solid-pink.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-solid-purple.css b/src/main/gtk-3.0/gtk-light-solid-purple.css index a047b6d1..44c14056 100644 --- a/src/main/gtk-3.0/gtk-light-solid-purple.css +++ b/src/main/gtk-3.0/gtk-light-solid-purple.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-solid-red.css b/src/main/gtk-3.0/gtk-light-solid-red.css index 2c84ec0e..8013a8e1 100644 --- a/src/main/gtk-3.0/gtk-light-solid-red.css +++ b/src/main/gtk-3.0/gtk-light-solid-red.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-solid-yellow.css b/src/main/gtk-3.0/gtk-light-solid-yellow.css index b5d580c7..83704949 100644 --- a/src/main/gtk-3.0/gtk-light-solid-yellow.css +++ b/src/main/gtk-3.0/gtk-light-solid-yellow.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/main/gtk-3.0/gtk-light-yellow.css b/src/main/gtk-3.0/gtk-light-yellow.css index 44299ce6..938f80e5 100644 --- a/src/main/gtk-3.0/gtk-light-yellow.css +++ b/src/main/gtk-3.0/gtk-light-yellow.css @@ -4110,7 +4110,7 @@ placessidebar row:selected button.sidebar-button:active, placessidebar row:selec background-image: none; color: white; background-color: rgba(0, 0, 0, 0.5); - border-color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.25); } placessidebar row.sidebar-placeholder-row { diff --git a/src/sass/cinnamon/_common.scss b/src/sass/cinnamon/_common.scss index f5034be0..3ed4f466 100644 --- a/src/sass/cinnamon/_common.scss +++ b/src/sass/cinnamon/_common.scss @@ -35,22 +35,30 @@ stage { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; - + border-radius: $bt_radius; @include button(normal); - &:focus { @include button(focus); border-radius: 5px; } - &:hover { @include button(hover); border-radius: 5px; } - &:hover:focus { @include button(focus-hover); border-radius: 5px; } - &:active, &:active:focus { @include button(active); border-radius: 5px; } - &:insensitive { @include button(insensitive); border-radius: 5px; } + &:focus { @include button(focus); border-radius: $bt_radius; } + &:hover { @include button(hover); border-radius: $bt_radius; } + &:hover:focus { @include button(focus-hover); border-radius: $bt_radius; } + &:active, &:active:focus { @include button(active); border-radius: $bt_radius; } + &:insensitive { @include button(insensitive); border-radius: $bt_radius; } +} + +%flat_button { + border-radius: $bt_radius; + @include button(flat); + + &:hover { @include button(flat-hover); border-radius: $bt_radius; } + &:active { @include button(flat-active); border-radius: $bt_radius; } + &:insensitive { @include button(flat-insensitive); border-radius: $bt_radius; } } %osd_button { min-height: 20px; padding: 5px 32px; transition-duration: 100ms; - border-radius: 5px; + border-radius: $bt_radius; @include button(osd); @@ -69,7 +77,7 @@ stage { selection-background-color: $selected_bg_color; selected-color: $selected_fg_color; transition-duration: 300ms; - border-radius: 5px; + border-radius: $bt_radius; @include entry(normal); @@ -90,7 +98,7 @@ stage { selection-background-color: $selected_bg_color; selected-color: $selected_fg_color; transition-duration: 300ms; - border-radius: 5px; + border-radius: $bt_radius; @include entry(osd); @@ -117,11 +125,11 @@ StScrollBar { StBin#trough { background-color: transparentize($base_color, 0.9); - border-radius: 8px; + border-radius: 100px; } StButton#vhandle, StButton#hhandle { - border-radius: 2px; + border-radius: 100px; background-color: mix($fg_color, $bg_color, 40%); border: 0px solid; margin: 0px; @@ -169,7 +177,6 @@ StScrollBar { // Check Boxes // .check-box { - CinnamonGenericContainer { spacing: .2em; min-height: 30px; @@ -253,7 +260,7 @@ StScrollBar { // Tooltip // #Tooltip { - border-radius: 3px; + border-radius: $bt_radius; padding: 5px 12px; background-color: $osd_bg_color; color: $osd_fg_color; @@ -263,7 +270,7 @@ StScrollBar { } // -// Pop0vers/Menus +// Popovers/Menus // $menu_bg: if($variant=='light', rgba($base_color, 0.95), rgba($bg_color, 0.95)); @@ -272,35 +279,27 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) .menu, .popup-menu, %menu { - padding: 4px 4px 6px 4px; + padding: 0 6px; color: $fg_color; - // background-color: $menu_bg; - // border-radius: 6px; - // margin: 5px; - // @if $variant == 'dark' { border: 1px solid $menu_border; } - // box-shadow: 0 3px 8px rgba(0, 0, 0, 0.56), 0 3px 15px rgba(0, 0, 0, 0.36); @if $trans == 'true' { - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } @else { - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } &-arrow { icon-size: 16px; } .popup-sub-menu { + border-radius: $bt_radius; background-gradient-direction: none; box-shadow: none; - border-image: url("assets/submenu.svg") 15 15 2 2; + background-color: if($variant == 'light', rgba(white, 0.75), rgba(white, 0.15)); - // background-color: if($variant=='light', $bg_color, $base_color); - // border-top: 1px solid $dark_borders_color; - // border-bottom: 1px solid $dark_borders_color; - - .popup-menu-item:ltr { padding-right: 8px; } - .popup-menu-item:rtl { padding-left: 8px; } + // .popup-menu-item:ltr { padding-right: 8px; } + // .popup-menu-item:rtl { padding-left: 8px; } StScrollBar { padding: 4px; @@ -308,14 +307,16 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } } - .popup-menu-content { padding: 1em 0em 1em 0em; } + .popup-menu-content { padding: 1em 6px 1em 6px; } + .popup-menu-item { padding: .4em 1.75em; spacing: 1em; + border-radius: $bt_radius; - &:active { + &:active, &:checked { color: $selected_fg_color; - border-image: url("assets/menu-hover.svg") 15 15 2 2; + background-color: $selected_bg_color; } &:insensitive { @@ -336,14 +337,14 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } .popup-menu-boxpointer { - -arrow-border-radius: 3px; + -arrow-border-radius: $bt_radius; -arrow-background-color: rgba(0,0,0,0.0); -arrow-border-width: 0; -arrow-border-color: rgba(0,0,0,0.0); -arrow-base: 0; -arrow-rise: 0; margin: 0.4em 0.5em 0.5em; - border-radius: 2px; + border-radius: $bt_radius; } .popup-combo-menu { @@ -413,7 +414,6 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } &Right { - &:dnd { background-gradient-direction: vertical; background-gradient-start: rgba(0,0,255,0.05); @@ -464,13 +464,6 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } } - @if $variant == 'dark' { - &-top { border-bottom: 1px solid $panel_border_color; } - &-bottom { border-top: 1px solid $panel_border_color; } - &-left { border-right: 1px solid $panel_border_color; } - &-right { border-left: 1px solid $panel_border_color; } - } - &-dummy { background-color: transparentize($error_color, 0.5); @@ -510,7 +503,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) border: 1px solid $osd_bg_color; color: $osd_fg_color; spacing: 25px; - border-radius: 2px; + border-radius: $bt_radius; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -526,7 +519,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) .expo-workspaces-name-entry, .expo-workspaces-name-entry#selected { height: 15px; - border-radius: 2px; + border-radius: $bt_radius; font-size: 9pt; padding: 5px 8px; -cinnamon-caption-spacing: 4px; @@ -546,12 +539,12 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) .expo-workspace-thumbnail-frame { border: 4px solid rgba(255,255,255,0.0); background-color: rgba(255,255,255,0.0); - border-radius: 2px; + border-radius: $bt_radius; &#active { border: 4px solid $selected_bg_color; background-color: black; - border-radius: 2px; + border-radius: $bt_radius; } } @@ -600,6 +593,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) height: 26px; width: 26px; } + &:active { background-image: url("#{$asset_path}/close-active.svg"); background-size: 26px; @@ -647,7 +641,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } &-scrollBox { border: 1px solid $borders_color; - border-radius: 2px; + border-radius: $bt_radius; background-color: $base_color; padding: 4px; padding-right: 0; @@ -669,7 +663,6 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } } - // // Calendar // @@ -718,26 +711,25 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) .datemenu-date-label { padding: .4em 1.75em; - font-weight: bold; + font-weight: normal; text-align: center; + font-size: 14px; color: $fg_color; - border-radius: 2px; + border-radius: $bt_radius; } .calendar-day-base { - font-size: 80%; text-align: center; - width: 25px; - height: 25px; - padding: 0.1em; + width: 28px; + height: 28px; + padding: 0; margin: 2px; - border-radius: 12.5px; + border-radius: 100px; } .calendar-day-heading { color: transparentize($fg_color, 0.15); margin-top: 1em; - font-size: 70%; } .calendar-day { @@ -775,25 +767,35 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } .calendar-week-number { + width: 20px; + height: 20px; + margin: 6px 0; color: transparentize($fg_color, 0.3); - font-size: 80%; + font-weight: bold; + background-color: rgba($fg_color, 0.05); + border-radius: 100px; + + StLabel { + padding: 0; + margin-top: 3px; + } } // // Notifications // #notification { - border-radius: 3px; + border-radius: $wm_radius; padding: 13px; spacing-rows: 10px; spacing-columns: 10px; margin-from-right-edge-of-screen: 20px; width: 34em; color: $text_color; - background-color: $bg_color; + background-color: $base_color; .notification-button, .notification-icon-button { - @extend %button; + @extend %flat_button; padding: 5px; } @@ -801,11 +803,19 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) .menu &, .popup-menu & { + border: none; + border-radius: $bt_radius; + background-color: rgba($fg_color, 0.05); + + &:hover { + background-color: rgba($fg_color, 0.1); + box-shadow: 0 3px 8px rgba(black, 0.15); + } + &, &.multi-line-notification { color: $text_color; } - border: 1px solid $borders_color; .notification-button, .notification-icon-button { - @extend %button; + @extend %flat_button; padding: 5px; } @@ -838,7 +848,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } &-button, &-icon-button { - @extend %button; + @extend %flat_button; padding: 5px; } @@ -856,12 +866,20 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } .switcher-list { - color: $osd_fg_color; - background-color: $osd_bg_color; - border: 1px solid $borders_color; - border-radius: 3px; + color: $text_color; + background-color: $menu_bg; + border: none; + border-radius: $bt_radius; padding: 20px; + @if $trans == 'true' { + border-image: url("assets/menu.svg") 17 17 17 17; + } + + @else { + border-image: url("assets/menu-solid.svg") 17 17 17 17; + } + > StBoxLayout { padding: 4px; } @@ -870,7 +888,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) .item-box { padding: 8px; - border-radius: 2px; + border-radius: $bt_radius; &:outlined { padding: 8px; @@ -945,7 +963,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) background-color: rgba(darken($osd_bg_color, 3%), 0.95); border: 1px solid rgba(black, 0.65); padding: 0 5px 6px 5px; - border-radius: 5px; + border-radius: $bt_radius; box-shadow: 0 3px 8px rgba(black, 0.75), 0 5px 18px rgba(black, 0.55); > StBoxLayout:first-child { @@ -975,7 +993,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) .run-dialog { padding: 0px 15px 10px 15px; background-color: $bg_color; - border-radius: 5px; + border-radius: $bt_radius; > * { padding: 0; } @@ -999,7 +1017,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) &-entry { width: 21em; padding: 7px; - border-radius: 3px; + border-radius: $bt_radius; caret-color: $osd_fg_color; selected-color: $selected_fg_color; selection-background-color: $selected_bg_color; @@ -1106,7 +1124,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 3px; + border-radius: $bt_radius; box-shadow: none; @include button(osd); @@ -1120,7 +1138,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) .keyboard-subkeys { //long press on a key popup color: $osd_fg_color; padding: 5px; - -arrow-border-radius: 2px; + -arrow-border-radius: $bt_radius; -arrow-background-color: $osd_bg_color; -arrow-border-width: 1px; -arrow-border-color: transparentize(black, 0.6);; @@ -1139,23 +1157,25 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) .menu { &-favorites-box { margin: auto; - padding: 10px; + padding: 6px; transition-duration: 300; - background-color: $bg_color; - border: 1px solid $borders_color; - border-radius: 3px; + background-color: rgba($fg_color, 0.05); + border: none; + border-radius: $bt_radius; } &-favorites-button { padding: 10px; - border: 1px solid rgba(0,0,0,0); - border-radius: 5px; + border: none; + border-radius: $bt_radius; - &:hover { @include button(hover); border-radius: 5px; } + &:hover { + border-radius: $bt_radius; + background-color: rgba($fg_color, 0.1); + } } &-places { - &-box { margin: auto; padding: 10px; @@ -1172,7 +1192,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) &-application-button { padding: 6px; - border-radius: 2px; + border-radius: $bt_radius; border: none; // This style is used in menu application buttons for applications which were newly installed @@ -1181,7 +1201,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) &-selected { @include button(active); padding: 6px; - border-radius: 2px; + border-radius: $bt_radius; border: none; &:highlighted { font-weight: bold; } @@ -1192,14 +1212,16 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } StScrollView.menu-application-button { // extracted submenu container - padding: 0; - border-radius: 3px; - border: 1px solid $borders_color; + padding: 3px 0; + border-radius: $bt_radius; background-color: $base_color; .popup-menu-item { padding: 0; spacing: 0; + margin: 0 3px; + border-radius: $bt_radius; + &:ltr { padding-left: 7px; } &:rtl { padding-right: 7px; } @@ -1219,21 +1241,18 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) &-category-button { padding: 6px; - border: 1px solid rgba(0,0,0,0); - border-radius: 5px; + border-radius: $bt_radius; &-selected { padding: 6px; - border: 1px solid $button_borders; } &-hover, &-selected { - @include button(hover); - border-radius: 5px; + @include button(flat-hover); + border-radius: $bt_radius; } &-greyed { padding: 6px; color: $disabled_fg_color; - border: 1px solid rgba(0,0,0,0); } &-label:ltr { padding-left: 5px; } @@ -1276,7 +1295,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) color: $fg_color; } -/* Context menu (at the moment only for favorites) */ +// Context menu (at the moment only for favorites) // .menu-context-menu { } // @@ -1307,11 +1326,11 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) border: none; @if $trans == 'true' { - border-image: url("assets/menu.svg") 15 15 15 15; + border-image: url("assets/menu.svg") 17 17 17 17; } @else { - border-image: url("assets/menu-solid.svg") 15 15 15 15; + border-image: url("assets/menu-solid.svg") 17 17 17 17; } .osd-monitor-label { font-size: 3em; } @@ -1320,12 +1339,12 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) padding: 0; height: 4px; background-color: rgba(black, 0.35); - border-radius: 2px; + border-radius: $bt_radius; color: $selected_bg_color; } .level-bar { - border-radius: 2px; + border-radius: $bt_radius; background-color: $selected_bg_color; } } @@ -1335,9 +1354,8 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) // .window-list { - &-box { - spacing: 0; + spacing: 2px; .panel-bottom &, .panel-top & { @@ -1367,7 +1385,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) background-image: none; transition-duration: 100; color: rgba($panel_fg, 0.9); - border: 0 solid transparent; + border-radius: $bt_radius; .panel-bottom & StLabel { padding-left: 6px; } .panel-top & StLabel { padding-left: 6px; } @@ -1386,51 +1404,33 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) &:hover { color: $panel_fg; - border: 0 solid rgba($panel_fg, 0.5); background-gradient-direction: none; - - @each $position in (top), - (bottom), - (left), - (right) { - .panel-#{$position} & { - border-#{$position}-width: 2px; - } - } + background-color: rgba($panel_fg, 0.15); } &:active, &:checked, &:running { color: $panel_fg; - border: 0 solid rgba($selected_bg_color, 0.35); background-gradient-direction: none; - - @each $position in (top), - (bottom), - (left), - (right) { - .panel-#{$position} & { - border-#{$position}-width: 2px; - } - } + background-color: rgba($panel_fg, 0.25); &:hover { - border-color: rgba($selected_bg_color, 0.5); + background-color: rgba($panel_fg, 0.3); } } &:focus { color: $panel_fg; - border: 0 solid $selected_bg_color; background-gradient-direction: none; + background-image: radial-gradient(5px 5px 45deg, circle cover, $panel_fg 0%, $panel_fg 100%); @each $position in (top), (bottom), (left), (right) { .panel-#{$position} & { - border-#{$position}-width: 2px; + background-position: #{$position} center; } } } @@ -1444,7 +1444,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) background-gradient-direction: vertical; background-gradient-start: $progress_color; background-gradient-end: $progress_color; - border-radius: 2px; + border-radius: $bt_radius; box-shadow: none; } } @@ -1456,11 +1456,11 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) // >= 3.6.7 &-preview { // thumbnail popup windows = .switcher-list - padding: 20px - 8px; // = .switcher-list - .item-box + padding: 16px; // = .switcher-list - .item-box spacing: 8px; // = .switcher-list-item-container border: none; background-color: $base_color; - border-radius: 5px; + border-radius: $bt_radius; color: $fg_color; box-shadow: 0 3px 5px rgba(#000, 0.35), 0 3px 12px rgba(#000, 0.16); } @@ -1471,7 +1471,6 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) // .grouped-window-list { - &-thumbnail-label { padding-left: 4px; } @@ -1481,19 +1480,20 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } &-thumbnail-menu { + padding: 6px; .item-box { - padding: 6px; - border-radius: 2px; - spacing: 4px; + padding: 8px; + border-radius: $bt_radius; + spacing: 8px; + margin: 2px; &:outlined { - padding: 2px; - border: 2px solid $selected_bg_color; + background-color: rgba($fg_color, 0.1); } - &:selected { - background-color: rgba($selected_fg_color, 0.33); + &:hover { + background-color: rgba($fg_color, 0.15); } } @@ -1503,20 +1503,19 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) .separator { width: 1px; - background-color: rgba($panel_fg, 0.33); + background-color: $borders_color; } } &-number-label { - z-index: 99; + z-index: 120; text-shadow: none; - font-size: 10px; color: $selected_fg_color; padding: 0; } &-button-label { - padding-left: 4px; + padding-left: 2px; } &-badge { @@ -1528,73 +1527,39 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) font-weight: normal; background-image: none; transition-duration: 100; + border: none; + margin: 0; color: rgba($panel_fg, 0.6); - border: 0 solid transparent; + border-radius: $bt_radius; + spacing: 0.5em; - @each $position in (top), - (bottom), - (left), - (right) { - - &.#{$position} { // Cinnamon 4.0.3 - border-#{$position}-width: 2px; - StIcon, StBin, #appMenuIcon { padding: 2px; padding-#{$position}: 0; } - } + &.top, &.bottom { + padding: 0 2px; } - // &.bottom StLabel { padding-left: 6px; } - // &.top StLabel { padding-left: 6px; } - // &.left StLabel { padding-top: 6px; } - // &.right StLabel { padding-top: 6px; } - &:hover { color: $panel_fg; - border: 0 solid rgba($panel_fg, 0.5); background-gradient-direction: none; - - @each $position in (top), - (bottom), - (left), - (right) { - .panel-#{$position} & { - border-#{$position}-width: 2px; - } - } + background-color: rgba($panel_fg, 0.15); } - &:active, - &:checked, - &:running { + &:active { color: $panel_fg; - border: 0 solid rgba($selected_bg_color, 0.35); background-gradient-direction: none; - - @each $position in (top), - (bottom), - (left), - (right) { - .panel-#{$position} & { - border-#{$position}-width: 2px; - } - } + background-color: rgba($panel_fg, 0.08); &:hover { - border-color: rgba($selected_bg_color, 0.5); + background-color: rgba($panel_fg, 0.15); } } &:focus { color: $panel_fg; - border: 0 solid $selected_bg_color; background-gradient-direction: none; + background-color: rgba($panel_fg, 0.3); - @each $position in (top), - (bottom), - (left), - (right) { - .panel-#{$position} & { - border-#{$position}-width: 2px; - } + &:hover { + background-color: rgba($panel_fg, 0.36); } } @@ -1602,7 +1567,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) background-gradient-direction: vertical; background-gradient-start: $progress_color; background-gradient-end: $progress_color; - border-radius: 2px; + border-radius: $bt_radius; box-shadow: none; } } @@ -1673,7 +1638,10 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) // 2.8 .sound-player { - padding: 0 3px; + padding: 0 0; + margin-top: 6px; + border-radius: $bt_radius; + background-color: if($variant == 'light', rgba(white, 0.75), rgba(white, 0.15)); > StBoxLayout:first-child { padding: 5px 10px 10px 10px; @@ -1692,32 +1660,36 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } &-generic-coverart { - background: rgba(0,0,0,0.2); + background: rgba(black, 0.2); } &-overlay { width: 290px; - height: 70px; - padding: 15px; + height: 80px; + padding: 12px 16px 8px; spacing: 0.5em; - background: transparentize(darken($osd_bg_color, 5%), 0.1); - border: 0px solid darken($osd_bg_color, 8%); - border-bottom: 1px; + background-color: if($variant == 'light', rgba(#454545, 0.9), rgba(#686868, 0.9)); + border: none; + border-radius: 0 0 $bt_radius $bt_radius; color: $osd_fg_color; StButton { - width: 22px; + width: 16px; height: 16px; - padding: 6px; - margin: 0 2px; + padding: 8px; + margin: 0 6px 6px; color: $osd_fg_color; - border-radius: 3px; + border-radius: 100px; border: none; StIcon { icon-size: 16px; } - &:hover { @include button(osd-hover); } - &:active { @include button(osd-active); } + &:hover { background-color: rgba($osd_fg_color, 0.1); } + &:active { background-color: rgba($osd_fg_color, 0.25); } + &:insensitive { + opacty: 0.35; + color: rgba($osd_fg_color, 0.35); + } } StLabel { padding: 0 6px; } @@ -1813,15 +1785,15 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) .panel-launcher { padding: 2px; transition-duration: 200ms; + border-radius: $bt_radius; &:hover { background-gradient-direction: none; - border: 0px solid $selected_bg_color; + background-color: rgba($fg_color, 0.1); + } - .panel-bottom & { border-bottom-width: 2px; padding-bottom: 0;} - .panel-top & { border-top-width: 2px; padding-top: 0;} - .panel-left & { border-left-width: 2px; padding-left: 0; } - .panel-right & { border-right-width: 2px; padding-right: 0; } + &:active { + background-color: rgba($fg_color, 0.2); } } @@ -1830,26 +1802,18 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) padding: 2px; spacing: 2px; transition-duration: 0.2s; + border-radius: $bt_radius; + &:hover { - border: 0 solid $selected_bg_color; background-gradient-direction: none; - - @each $position in (top), - (bottom), - (left), - (right) { - .panel-#{$position} & { - padding-#{$position}: 0; - border-#{$position}-width: 2px; - } - } + background-color: rgba($fg_color, 0.1); } - .icon-box { - padding: 0 2px; - - &.vertical { padding: 2px 0; } + &:active { + background-color: rgba($fg_color, 0.2); } + + .icon-box { padding: 2px; } } // @@ -1869,18 +1833,18 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) &-separator-line { width: 1px; - background: rgba(255,255,255, 0.12); + background: rgba($panel_fg, 0.12); } &-box { - padding-left: 3px; - padding-right: 3px; + padding: 0 8px; color: $panel_fg; text-shadow: none; transition-duration: 100; + border-radius: $bt_radius; &.vertical { - padding: 3px 0; + padding: 8px 0; } &:hover { @@ -1889,8 +1853,8 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) } &:checked, &:checked:hover { - color: $selected_fg_color; - background-color: $selected_bg_color; + color: $panel_fg; + background-color: rgba($panel_fg, 0.25); } &:highlight { @@ -1905,17 +1869,17 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) color: $panel_fg; .applet-box:checked & { - color: $selected_fg_color; + color: $panel_fg; text-shadow: none; } } &-icon { color: $panel_fg; - icon-size: 22px; + icon-size: 16px; .applet-box:checked & { - color: $selected_fg_color; + color: $panel_fg; text-shadow: none; } } @@ -1998,9 +1962,7 @@ $menu_border: if($variant=='light', darken($menu_bg, 18%), darken($menu_bg, 12%) // // Workspace OSD // -/*FIXME*/ .workspace-osd { - /*color: red;*/ text-shadow: black 5px 5px 5px; font-weight: bold; font-size: 48pt; diff --git a/src/sass/cinnamon/_drawing.scss b/src/sass/cinnamon/_drawing.scss index b7fb0a2b..ef86543a 100644 --- a/src/sass/cinnamon/_drawing.scss +++ b/src/sass/cinnamon/_drawing.scss @@ -102,6 +102,26 @@ background-color: rgba($button_bg, 0.55); } + @else if $t==flat { + color: $fg_color; + background-color: transparent; + } + + @else if $t==flat-hover { + color: $fg_color; + background-color: rgba($fg_color, 0.1); + } + + @else if $t==flat-active { + color: $fg_color; + background-color: rgba($fg_color, 0.2); + } + + @else if $t==flat-insensitive { + color: $disabled_fg_color; + background-color: transparent; + } + @else if $t==osd { color: $osd_fg_color; background-color: $osd_button_bg;