diff --git a/cinnamon-shell/upstream/cinnamon-dark.css b/cinnamon-shell/upstream/cinnamon-dark.css
index a267a0733e..e2f2e7ba4f 100644
--- a/cinnamon-shell/upstream/cinnamon-dark.css
+++ b/cinnamon-shell/upstream/cinnamon-dark.css
@@ -1,46 +1,46 @@
stage {
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
.label-shadow {
color: rgba(0, 0, 0, 0); }
-.sound-button, .modal-dialog-button-box .modal-dialog-button, .notification-button, .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button {
+.sound-button, .notification-button, .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button {
min-height: 20px;
padding: 5px 32px;
transition-duration: 0;
- color: rgba(255, 255, 255, 0.87);
- background-color: #454545;
- border: 1px solid #202020;
- box-shadow: inset 0 2px 4px rgba(69, 69, 69, 0.05); }
- .sound-button, .modal-dialog-button-box .modal-dialog-button, .notification-button, .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button {
+ color: #e1e1e1;
+ background-color: #303036;
+ border: 1px solid #303036;
+ box-shadow: inset 0 2px 4px rgba(48, 48, 54, 0.05); }
+ .sound-button, .notification-button, .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button {
border-radius: 2px; }
- .sound-button:focus, .modal-dialog-button-box .modal-dialog-button:focus, .notification-button:focus, .notification-icon-button:focus, .popup-menu #notification .notification-button:focus, .popup-menu #notification .notification-icon-button:focus {
- color: rgba(255, 255, 255, 0.87);
- background-color: #454545;
+ .sound-button:focus, .notification-button:focus, .notification-icon-button:focus, .popup-menu #notification .notification-button:focus, .popup-menu #notification .notification-icon-button:focus {
+ color: #e1e1e1;
+ background-color: #303036;
border: 1px solid #35a854;
- box-shadow: inset 0 2px 4px rgba(69, 69, 69, 0.05); }
- .sound-button:hover, .modal-dialog-button-box .modal-dialog-button:hover, .notification-button:hover, .notification-icon-button:hover, .popup-menu #notification .notification-button:hover, .popup-menu #notification .notification-icon-button:hover {
- color: rgba(255, 255, 255, 0.87);
- background-color: #525252;
- border: 1px solid #202020;
- box-shadow: inset 0 2px 4px rgba(82, 82, 82, 0.05); }
- .sound-button:hover:focus, .modal-dialog-button-box .modal-dialog-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, .popup-menu #notification .notification-button:hover:focus, .popup-menu #notification .notification-icon-button:hover:focus {
- color: rgba(255, 255, 255, 0.87);
- background-color: #525252;
+ box-shadow: inset 0 2px 4px rgba(48, 48, 54, 0.05); }
+ .sound-button:hover, .notification-button:hover, .notification-icon-button:hover, .popup-menu #notification .notification-button:hover, .popup-menu #notification .notification-icon-button:hover {
+ color: #e1e1e1;
+ background-color: #3c3c44;
+ border: 1px solid #303036;
+ box-shadow: inset 0 2px 4px rgba(60, 60, 68, 0.05); }
+ .sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, .popup-menu #notification .notification-button:hover:focus, .popup-menu #notification .notification-icon-button:hover:focus {
+ color: #e1e1e1;
+ background-color: #3c3c44;
border: 1px solid #35a854;
- box-shadow: inset 0 2px 4px rgba(69, 69, 69, 0.05); }
- .sound-button:active, .modal-dialog-button-box .modal-dialog-button:active, .notification-button:active, .notification-icon-button:active, .popup-menu #notification .notification-button:active, .popup-menu #notification .notification-icon-button:active {
+ box-shadow: inset 0 2px 4px rgba(48, 48, 54, 0.05); }
+ .sound-button:active, .notification-button:active, .notification-icon-button:active, .popup-menu #notification .notification-button:active, .popup-menu #notification .notification-icon-button:active {
color: #ffffff;
background-color: #35a854;
border: 1px solid #35a854;
box-shadow: inset 0 2px 4px #35a854; }
- .sound-button:insensitive, .modal-dialog-button-box .modal-dialog-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, .popup-menu #notification .notification-button:insensitive, .popup-menu #notification .notification-icon-button:insensitive {
- color: rgba(255, 255, 255, 0.32);
- border: 1px solid rgba(32, 32, 32, 0.55);
- background-color: rgba(69, 69, 69, 0.55);
- box-shadow: inset 0 2px 4px rgba(69, 69, 69, 0.05); }
+ .sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, .popup-menu #notification .notification-button:insensitive, .popup-menu #notification .notification-icon-button:insensitive {
+ color: rgba(225, 225, 225, 0.45);
+ border: 1px solid rgba(48, 48, 54, 0.55);
+ background-color: rgba(48, 48, 54, 0.55);
+ box-shadow: inset 0 2px 4px rgba(48, 48, 54, 0.05); }
-#menu-search-entry, .popup-menu #notification StEntry {
+.prompt-dialog-password-entry, .run-dialog-entry, #appmenu-search-entry, #menu-search-entry, .popup-menu #notification StEntry {
padding: 7px;
caret-size: 1px;
selection-background-color: #35a854;
@@ -48,23 +48,28 @@ stage {
transition-duration: 300ms;
border-radius: 3px;
color: #D3D3D3;
- background-color: #404040;
- border: 1px solid #202020;
- box-shadow: inset 0 2px 4px rgba(64, 64, 64, 0.05); }
- #menu-search-entry:focus, .popup-menu #notification StEntry:focus, #menu-search-entry:hover, .popup-menu #notification StEntry:hover {
- color: rgba(255, 255, 255, 0.87);
- background-color: #404040;
+ background-color: #303036;
+ border: 1px solid #303036;
+ box-shadow: inset 0 2px 4px rgba(48, 48, 54, 0.05); }
+ .prompt-dialog-password-entry:focus, .run-dialog-entry:focus, #appmenu-search-entry:focus, #menu-search-entry:focus, .popup-menu #notification StEntry:focus, .prompt-dialog-password-entry:hover, .run-dialog-entry:hover, #appmenu-search-entry:hover, #menu-search-entry:hover, .popup-menu #notification StEntry:hover {
+ color: #e1e1e1;
+ background-color: #303036;
border: 1px solid #35a854;
- box-shadow: inset 0 2px 4px rgba(64, 64, 64, 0.05); }
- #menu-search-entry:insensitive, .popup-menu #notification StEntry:insensitive {
- color: rgba(255, 255, 255, 0.32);
- background-color: #383838;
- border-color: 1px solid #272727;
- box-shadow: inset 0 2px 4px rgba(56, 56, 56, 0.05); }
- #menu-search-entry StIcon.capslock-warning, .popup-menu #notification StEntry StIcon.capslock-warning {
+ box-shadow: inset 0 2px 4px rgba(48, 48, 54, 0.05); }
+ .prompt-dialog-password-entry:insensitive, .run-dialog-entry:insensitive, #appmenu-search-entry:insensitive, #menu-search-entry:insensitive, .popup-menu #notification StEntry:insensitive {
+ color: rgba(225, 225, 225, 0.45);
+ background-color: #2a2a2f;
+ border-color: 1px solid #2a2a2f;
+ box-shadow: inset 0 2px 4px rgba(42, 42, 47, 0.05); }
+ .prompt-dialog-password-entry StIcon.capslock-warning, .run-dialog-entry StIcon.capslock-warning, #appmenu-search-entry StIcon.capslock-warning, #menu-search-entry StIcon.capslock-warning, .popup-menu #notification StEntry StIcon.capslock-warning {
icon-size: 16px;
warning-color: #F27835;
padding: 0 4px; }
+ .prompt-dialog-password-entry StLabel.hint-text, .run-dialog-entry StLabel.hint-text, #appmenu-search-entry StLabel.hint-text, #menu-search-entry StLabel.hint-text, .popup-menu #notification StEntry StLabel.hint-text {
+ color: rgba(225, 225, 225, 0.3); }
+ .prompt-dialog-password-entry StIcon.peek-password, .run-dialog-entry StIcon.peek-password, #appmenu-search-entry StIcon.peek-password, #menu-search-entry StIcon.peek-password, .popup-menu #notification StEntry StIcon.peek-password {
+ icon-size: 16px;
+ color: #e1e1e1; }
.notification StEntry {
padding: 7px;
@@ -75,8 +80,8 @@ stage {
transition-duration: 300ms;
border-radius: 3px;
color: #c3c3c3;
- background-color: rgba(109, 109, 109, 0.4);
- border: 1px solid rgba(22, 22, 22, 0.4);
+ background-color: rgba(104, 104, 104, 0.4);
+ border: 1px solid rgba(17, 17, 17, 0.4);
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05); }
.notification StEntry:focus {
color: #ffffff;
@@ -85,8 +90,8 @@ stage {
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05); }
.notification StEntry:insensitive {
color: rgba(195, 195, 195, 0.55);
- background-color: rgba(109, 109, 109, 0.25);
- border: 1px solid rgba(22, 22, 22, 0.4);
+ background-color: rgba(104, 104, 104, 0.25);
+ border: 1px solid rgba(17, 17, 17, 0.4);
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05); }
StScrollView.vfade {
@@ -101,15 +106,15 @@ StScrollBar {
min-width: 5px;
min-height: 5px; }
StScrollBar StBin#trough {
- background-color: rgba(64, 64, 64, 0.1);
+ background-color: rgba(48, 48, 54, 0.1);
border-radius: 8px; }
StScrollBar StButton#vhandle, StScrollBar StButton#hhandle {
border-radius: 2px;
- background-color: rgba(118, 118, 118, 0.948);
+ background-color: #303036;
border: 0px solid;
margin: 0px; }
StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover {
- background-color: rgba(99, 99, 99, 0.961); }
+ background-color: #44444c; }
StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
background-color: #35a854; }
@@ -130,10 +135,10 @@ StScrollBar {
.popup-slider-menu-item,
.slider {
-slider-height: 0.3em;
- -slider-background-color: #202020;
- -slider-border-color: rgba(47, 47, 47, 0.3);
+ -slider-background-color: #303036;
+ -slider-border-color: rgba(34, 34, 38, 0.3);
-slider-active-background-color: #35a854;
- -slider-active-border-color: rgba(47, 47, 47, 0.3);
+ -slider-active-border-color: rgba(34, 34, 38, 0.3);
-slider-border-width: 1px;
-slider-handle-radius: 0.5em;
height: 1em;
@@ -215,34 +220,33 @@ StScrollBar {
margin: 3px; }
#LookingGlassDialog {
- color: rgba(255, 255, 255, 0.87);
- border: 1px solid #202020;
+ color: #e1e1e1;
+ border: 1px solid #303036;
border-radius: 3px;
- background-color: #2f2f2f;
+ background-color: #222226;
spacing: 4px;
padding: 8px; }
.menu {
- color: rgba(255, 255, 255, 0.87);
- border: 1px solid #202020;
- border-radius: 3px;
- background-color: rgba(47, 47, 47, 0.99); }
- .menu.top {
- border-radius: 0 0 3px 3px; }
- .menu.bottom {
- border-radius: 3px 3px 0 0; }
- .menu.left {
- border-radius: 0 3px 3px 0; }
- .menu.right {
- border-radius: 3px 0 0 3px; }
+ color: #e1e1e1;
+ background-color: #222226;
+ box-shadow: 0 0 6px rgba(0, 0, 0, 0.5); }
+ .menu-top {
+ border-radius: 0 0 6px 6px; }
+ .menu-bottom {
+ border-radius: 6px 6px 0 0; }
+ .menu-left {
+ border-radius: 0 6px 6px 0; }
+ .menu-right {
+ border-radius: 6px 0 0 6px; }
.popup-sub-menu {
- background-color: #404040;
+ background-color: #222226;
box-shadow: none; }
.popup-sub-menu .popup-menu-item:ltr {
- padding-right: 1.75em; }
+ padding-left: 2.5em; }
.popup-sub-menu .popup-menu-item:rtl {
- padding-left: 1.75em; }
+ padding-right: 2.5em; }
.popup-sub-menu StScrollBar {
padding: 4px; }
.popup-sub-menu StScrollBar StBin#trough, .popup-sub-menu StScrollBar StBin#vhandle {
@@ -258,70 +262,22 @@ StScrollBar {
border-right-width: 0; }
.popup-menu-item:active {
color: #ffffff;
- background-color: #525352; }
+ background-color: #303036; }
.popup-menu-item:insensitive {
- color: rgba(255, 255, 255, 0.37);
+ color: rgba(225, 225, 225, 0.5);
background: none; }
.popup-inactive-menu-item {
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
.popup-inactive-menu-item:insensitive {
- color: rgba(255, 255, 255, 0.32); }
-
-/* This is for popup menus in Cinnamon versions < 3.2 */
-.popup-menu {
- color: white;
- color: rgba(255, 255, 255, 0.87); }
- .popup-menu-arrow {
- icon-size: 16px; }
- .popup-menu .popup-sub-menu {
- background-color: #404040;
- box-shadow: none; }
- .popup-menu .popup-sub-menu .popup-menu-item:ltr {
- padding-right: 1.75em; }
- .popup-menu .popup-sub-menu .popup-menu-item:rtl {
- padding-left: 1.75em; }
- .popup-menu .popup-sub-menu StScrollBar {
- padding: 4px; }
- .popup-menu .popup-sub-menu StScrollBar StBin#trough, .popup-menu .popup-sub-menu StScrollBar StBin#vhandle {
- border-width: 0; }
- .popup-menu .popup-menu-content {
- padding: 1em 0em 1em 0em; }
- .popup-menu .popup-menu-item {
- padding: .4em 1.75em;
- spacing: 1em;
- border: 1px solid transparent;
- border-left-width: 0;
- border-right-width: 0; }
- .popup-menu .popup-menu-item:active {
- color: rgba(255, 255, 255, 0.87);
- border-color: rgba(255, 255, 255, 0);
- background-color: rgba(255, 255, 255, 0); }
- .popup-menu .popup-menu-item:insensitive {
- color: rgba(255, 255, 255, 0.37);
- background: none; }
- .popup-menu .popup-inactive-menu-item {
- color: rgba(255, 255, 255, 0.87); }
- .popup-menu .popup-inactive-menu-item:insensitive {
- color: rgba(255, 255, 255, 0.32); }
- .popup-menu-icon {
- icon-size: 16px; }
-
-.popup-menu-boxpointer {
- -arrow-border-radius: 3px;
- -arrow-background-color: #2f2f2f;
- -arrow-border-width: 1px;
- -arrow-border-color: #202020;
- -arrow-base: 21px;
- -arrow-rise: 9px;
- -boxpointer-gap: 2px; }
+ color: rgba(225, 225, 225, 0.45); }
/*Scale view context menu*/
.popup-combo-menu {
- color: rgba(255, 255, 255, 0.87);
- border: 1px solid #202020;
+ color: #e1e1e1;
+ border: 1px solid #303036;
border-radius: 3px;
- background-color: #404040;
+ background-color: #303036;
box-shadow: none;
padding: 1em 0em 1em 0em; }
@@ -334,8 +290,8 @@ StScrollBar {
.popup-separator-menu-item {
-gradient-height: 1px;
- -gradient-start: #202020;
- -gradient-end: #202020;
+ -gradient-start: #27272b;
+ -gradient-end: #27272b;
-margin-horizontal: 0;
height: 1px; }
@@ -343,7 +299,15 @@ StScrollBar {
font-weight: normal; }
.popup-device-menu-item {
- spacing: .5em; }
+ spacing: .5em;
+ font-weight: bold;
+ color: #e1e1e1; }
+ .popup-device-menu-item:insensitive {
+ color: #e1e1e1;
+ spacing: 1em; }
+ .popup-device-menu-item .popup-inactive-menu-item {
+ font-weight: normal;
+ color: #e1e1e1; }
.popup-subtitle-menu-item {
font-weight: normal; }
@@ -358,7 +322,7 @@ StScrollBar {
/* sets the width of vertical panels */
width: 32px;
/* Set the symbolic foreground color for icons, and importantly, the system tray applet icons */
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
#panelLeft {
spacing: 4px; }
#panelLeft:dnd {
@@ -453,21 +417,21 @@ StScrollBar {
.panel-top, .panel-bottom, .panel-left, .panel-right {
color: #ffffff;
border: none;
- background-color: rgba(47, 47, 47, 0.99);
+ background-color: rgba(29, 29, 33, 0.99);
font-size: 1em;
padding: 0px; }
.panel-top {
- box-shadow: 0 1px #202020; }
+ box-shadow: 0 1px #222226; }
.panel-bottom {
- box-shadow: 0 -1px #202020; }
+ box-shadow: 0 -1px #222226; }
.panel-left {
- box-shadow: 1px 0 #202020; }
+ box-shadow: 1px 0 #222226; }
.panel-right {
- box-shadow: -1px 0 #202020; }
+ box-shadow: -1px 0 #222226; }
.panel-dummy {
background-color: rgba(252, 65, 56, 0.5); }
@@ -479,7 +443,7 @@ StScrollBar {
-natural-hpadding: 3px;
-minimum-hpadding: 3px;
font-weight: bold;
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
.panel-button {
-natural-hpadding: 6px;
@@ -500,8 +464,8 @@ StScrollBar {
spacing: 12px; }
.window-caption {
- background-color: #353535;
- border: 1px solid #353535;
+ background-color: #303030;
+ border: 1px solid #303030;
color: #c3c3c3;
spacing: 8px;
border-radius: 2px;
@@ -532,8 +496,8 @@ StScrollBar {
padding: 5px 8px;
-cinnamon-caption-spacing: 4px;
color: #c3c3c3;
- background-color: rgba(109, 109, 109, 0.4);
- border: 1px solid rgba(22, 22, 22, 0.4);
+ background-color: rgba(104, 104, 104, 0.4);
+ border: 1px solid rgba(17, 17, 17, 0.4);
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05); }
.expo-workspaces-name-entry:focus,
.expo-workspaces-name-entry#selected:focus {
@@ -555,7 +519,7 @@ StScrollBar {
border-radius: 2px; }
.expo-background {
- background-color: #353535; }
+ background-color: #303030; }
.workspace-thumbnails {
spacing: 26px; }
@@ -614,14 +578,16 @@ StScrollBar {
margin-right: .5em;
padding: .5em;
min-width: 350px;
- border: 1px solid #202020;
- background-color: #404040; }
+ border: 1px solid rgba(0, 0, 0, 0);
+ background-color: #303036;
+ border-radius: 6px; }
.calendar-events-no-events-button {
margin: 6px 0 6px 0;
padding: 6px; }
.calendar-events-no-events-button:hover {
- background-color: #35a854; }
+ background-color: #35a854;
+ border-radius: 6px; }
.calendar-events-no-events-button:hover .calendar-events-no-events-icon,
.calendar-events-no-events-button:hover .calendar-events-no-events-label {
color: #ffffff; }
@@ -629,12 +595,12 @@ StScrollBar {
.calendar-events-no-events-icon,
.calendar-events-no-events-label {
font-weight: bold;
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
text-align: center; }
.calendar-events-date-label {
padding: .1em .1em .5em .1em;
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
font-weight: bold;
text-align: center; }
@@ -642,32 +608,34 @@ StScrollBar {
padding: 0; }
.calendar-event-button {
- border: 1px solid rgba(0, 0, 0, 0); }
+ border: 1px solid rgba(0, 0, 0, 0);
+ border-radius-topright: 6px;
+ border-radius-bottomright: 6px; }
.calendar-event-button .calendar-event-time-past {
- color: rgba(255, 255, 255, 0.27);
+ color: rgba(225, 225, 225, 0.4);
font-weight: bold;
text-align: left;
margin-bottom: .2em; }
.calendar-event-button .calendar-event-time-present {
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
font-weight: bold;
text-align: left;
margin-bottom: .2em; }
.calendar-event-button .calendar-event-time-present:all-day {
color: #35a854; }
.calendar-event-button .calendar-event-time-future {
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
font-weight: bold;
text-align: left;
margin-bottom: .2em; }
.calendar-event-button .calendar-event-summary {
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
text-align: left;
width: 200px; }
.calendar-event-button .calendar-event-countdown {
text-align: right;
margin-bottom: .6em;
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
.calendar-event-button .calendar-event-countdown:soon {
font-weight: bold; }
.calendar-event-button .calendar-event-countdown:imminent {
@@ -678,7 +646,7 @@ StScrollBar {
color: #35a854; }
.calendar-event-button:hover {
background-color: #35a854;
- border: 1px solid #202020; }
+ border: 1px solid #303036; }
.calendar-event-button:hover .calendar-event-time-past,
.calendar-event-button:hover .calendar-event-time-present,
.calendar-event-button:hover .calendar-event-time-future,
@@ -696,26 +664,27 @@ StScrollBar {
font-weight: bold; }
.calendar-event-color-strip {
- width: 2px; }
+ width: 3px; }
.calendar-today-home-button {
padding: 6px; }
.calendar-today-day-label {
font-size: 1.75em;
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
font-weight: bold;
text-align: center;
padding-bottom: .1em; }
.calendar-today-date-label {
font-size: 1.1em;
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
font-weight: bold;
text-align: center; }
.calendar-today-home-button-enabled {
- padding: 6px; }
+ padding: 6px;
+ border-radius: 6px; }
.calendar-today-home-button-enabled:hover {
background-color: #35a854; }
.calendar-today-home-button-enabled:hover .calendar-today-day-label {
@@ -724,7 +693,7 @@ StScrollBar {
color: #ffffff; }
.calendar-month-label {
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
font-weight: bold;
padding: 8px 0; }
@@ -778,16 +747,17 @@ StScrollBar {
.calendar-day-base:hover {
font-weight: bold;
color: #ffffff;
- background-color: #35a854; }
+ background-color: #35a854;
+ border-radius: 6px; }
.calendar-day-heading {
- color: rgba(255, 255, 255, 0.72);
+ color: rgba(225, 225, 225, 0.85);
margin-top: 1em;
font-size: 1.05em; }
.calendar-day {
border-width: 0;
- color: rgba(255, 255, 255, 0.77); }
+ color: rgba(225, 225, 225, 0.9); }
.calendar-day-top {
border-top-width: 0; }
@@ -796,28 +766,30 @@ StScrollBar {
border-left-width: 0; }
.calendar-nonwork-day {
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
background-color: transparent;
font-weight: bold; }
.calendar-today {
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
background-color: rgba(53, 168, 84, 0.4);
- border-width: 0; }
+ border-width: 0;
+ border-radius: 6px; }
.calendar-today:selected {
font-weight: bold; }
.calendar-not-today {
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1;
+ border-radius: 6px; }
.calendar-not-today:selected {
font-weight: bold;
- background-color: rgba(255, 255, 255, 0.27); }
+ background-color: rgba(225, 225, 225, 0.4); }
.calendar-not-today:selected:hover {
font-weight: bold;
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
.calendar-other-month-day {
- color: rgba(255, 255, 255, 0.17);
+ color: rgba(225, 225, 225, 0.3);
opacity: 1; }
.calendar-other-month-day:hover {
@@ -825,30 +797,30 @@ StScrollBar {
opacity: 1; }
.calendar-week-number {
- color: rgba(255, 255, 255, 0.72);
+ color: rgba(225, 225, 225, 0.85);
font-size: 0.8em;
margin-top: 0.8em; }
#notification {
- box-shadow: 0 1px 15px 4px #202020;
+ box-shadow: 0 1px 15px 4px #303036;
border-top-color: #35a854;
border-top: 4px;
border-radius: 5px;
- background-color: #2f2f2f;
+ background-color: #222226;
padding: 13px;
spacing-rows: 10px;
spacing-columns: 10px;
margin-from-right-edge-of-screen: 20px;
width: 34em;
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
.popup-menu #notification {
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
border-image: url("dark-assets/misc/message.svg") 9 9 9 9; }
.popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button {
padding: 5px; }
#notification.multi-line-notification {
padding-bottom: 13px;
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
#notification-scrollview {
max-height: 10em; }
#notification-scrollview > .top-shadow, #notification-scrollview > .bottom-shadow {
@@ -864,7 +836,7 @@ StScrollBar {
.notification-with-image {
min-height: 159px;
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
.notification-button, .notification-icon-button {
padding: 5px; }
@@ -877,10 +849,10 @@ StScrollBar {
spacing: 16px; }
.switcher-list {
- color: rgba(255, 255, 255, 0.87);
- border: 1px solid #202020;
- background-color: #2f2f2f;
- border-radius: 3px;
+ color: #e1e1e1;
+ border: 1px solid #303036;
+ background-color: #1d1d21;
+ border-radius: 6px;
padding: 20px; }
.switcher-list > StBoxLayout {
padding: 4px; }
@@ -888,13 +860,12 @@ StScrollBar {
spacing: 8px; }
.switcher-list .item-box {
padding: 8px;
- border-radius: 2px; }
+ border-radius: 6px; }
.switcher-list .item-box:outlined {
padding: 8px;
border: 1px solid #35a854; }
.switcher-list .item-box:selected {
- color: #ffffff;
- background-color: #35a854;
+ background-color: #38383e;
border: 0px solid #35a854; }
.switcher-list .thumbnail {
width: 256px; }
@@ -907,7 +878,7 @@ StScrollBar {
.switcher-arrow {
border-color: rgba(0, 0, 0, 0);
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
.switcher-arrow:highlighted {
border-color: rgba(0, 0, 0, 0);
color: #ffffff; }
@@ -934,194 +905,25 @@ StScrollBar {
.ripple-box:rtl {
background-image: url("common-assets/misc/corner-ripple.svg"); }
-.lightbox {
- background-color: rgba(0, 0, 0, 0.4); }
-
-.flashspot {
- background-color: white; }
-
-.modal-dialog {
- background-color: #2f2f2f;
- border: 1px solid #202020;
- border-radius: 3px;
- padding: 5px 10px; }
- .modal-dialog > StBoxLayout:first-child {
- padding: 10px; }
- .modal-dialog-button-box {
- spacing: 0;
- margin: 0px;
- padding: 10px;
- border: none;
- background-color: #2f2f2f; }
- .modal-dialog-button-box .modal-dialog-button {
- padding-top: 0;
- padding-bottom: 0;
- height: 30px; }
- .modal-dialog .confirm-dialog-title {
- text-align: center;
- font-weight: bold;
- font-size: 1.3em;
- padding-bottom: 12px; }
-
-.run-dialog {
- padding: 10px 15px 10px 15px;
- border: 1px solid #202020;
- border-radius: 3px;
- background-color: #2f2f2f; }
- .run-dialog > * {
- padding: 0; }
- .run-dialog-label {
- font-size: 1.3em;
- font-weight: bold;
- color: rgba(255, 255, 255, 0.87);
- padding-bottom: 15px;
- text-align: center; }
- .run-dialog-description {
- color: rgba(255, 255, 255, 0.87);
- padding-top: 15px;
- text-align: center; }
- .run-dialog-description.error {
- color: #FC4138; }
- .run-dialog-completion-box {
- padding-top: 5px;
- padding-left: 15px;
- font-size: 1em; }
- .run-dialog-entry {
- width: 21em;
- height: 1.2em;
- padding: 7px;
- border-radius: 3px;
- caret-color: #c3c3c3;
- selected-color: #ffffff;
- selection-background-color: #35a854;
- color: #c3c3c3;
- background-color: rgba(109, 109, 109, 0.4);
- border: 1px solid rgba(22, 22, 22, 0.4);
- box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05); }
- .run-dialog-entry:focus {
- color: rgba(255, 255, 255, 0.87);
- background-color: #404040;
- border: 1px solid #35a854;
- box-shadow: inset 0 2px 4px rgba(64, 64, 64, 0.05); }
- .run-dialog .modal-dialog-button-box {
- border: none;
- box-shadow: none;
- background: none; }
-
-/* CinnamonMountOperation Dialogs */
-.cinnamon-mount-operation-icon {
- icon-size: 48px; }
-
-.mount-password-reask {
- color: #F27835; }
-
-.show-processes-dialog,
-.mount-question-dialog {
- spacing: 24px; }
- .show-processes-dialog-subject,
- .mount-question-dialog-subject {
- padding-top: 10px;
- padding-left: 17px;
- padding-bottom: 6px; }
- .show-processes-dialog-subject:rtl,
- .mount-question-dialog-subject:rtl {
- padding-left: 0px;
- padding-right: 17px; }
- .show-processes-dialog-description,
- .mount-question-dialog-description {
- padding-left: 17px;
- width: 28em; }
- .show-processes-dialog-description:rtl,
- .mount-question-dialog-description:rtl {
- padding-right: 17px; }
-
-.show-processes-dialog-app-list {
- max-height: 200px;
- padding-top: 24px;
- padding-left: 49px;
- padding-right: 32px; }
- .show-processes-dialog-app-list:rtl {
- padding-right: 49px;
- padding-left: 32px; }
- .show-processes-dialog-app-list-item {
- color: #ccc; }
- .show-processes-dialog-app-list-item:hover {
- color: white; }
- .show-processes-dialog-app-list-item:ltr {
- padding-right: 1em; }
- .show-processes-dialog-app-list-item:rtl {
- padding-left: 1em; }
- .show-processes-dialog-app-list-item-icon:ltr {
- padding-right: 17px; }
- .show-processes-dialog-app-list-item-icon:rtl {
- padding-left: 17px; }
- .show-processes-dialog-app-list-item-name {
- font-size: 1.1em; }
-
.magnifier-zoom-region {
border: 2px solid maroon; }
.magnifier-zoom-region .full-screen {
border-width: 0px; }
-#keyboard {
- background-color: #353535;
- border-width: 0;
- border-top-width: 1px;
- border-color: rgba(0, 0, 0, 0.4); }
-
-.keyboard-layout {
- spacing: 10px;
- padding: 10px; }
-
-.keyboard-row {
- spacing: 15px; }
-
-.keyboard-key {
- min-height: 2em;
- min-width: 2em;
- font-size: 1.4em;
- font-weight: bold;
- border-radius: 3px;
- box-shadow: none;
- color: #c3c3c3;
- border: 1px solid #202020;
- background-color: rgba(109, 109, 109, 0.4); }
- .keyboard-key:hover {
- color: #c3c3c3;
- border: 1px solid rgba(2, 2, 2, 0.4);
- background-color: rgba(127, 127, 127, 0.5); }
- .keyboard-key:active, .keyboard-key:checked {
- color: #ffffff;
- border: 1px solid #35a854;
- background-color: #35a854; }
- .keyboard-key:grayed {
- color: #606060;
- border: 1px solid rgba(2, 2, 2, 0.4);
- background-color: rgba(109, 109, 109, 0.25); }
-
-.keyboard-subkeys {
- color: #c3c3c3;
- padding: 5px;
- -arrow-border-radius: 2px;
- -arrow-background-color: #353535;
- -arrow-border-width: 1px;
- -arrow-border-color: rgba(0, 0, 0, 0.4);
- -arrow-base: 20px;
- -arrow-rise: 10px;
- -boxpointer-gap: 5px; }
-
.menu-favorites-box {
padding: 10px;
transition-duration: 300;
- background-color: #333333;
- border: 1px solid #202020; }
+ background-color: #303036;
+ border: 1px solid rgba(0, 0, 0, 0);
+ border-radius: 6px; }
.menu-favorites-button {
padding: .9em 1em;
border: 1px solid rgba(0, 0, 0, 0);
- border-radius: 2px; }
+ border-radius: 6px; }
.menu-favorites-button:hover {
- background-color: #525352; }
+ background-color: #44444c;
+ border: 1px solid rgba(0, 0, 0, 0); }
.menu-places-box {
padding: 10px;
@@ -1144,8 +946,9 @@ StScrollBar {
.menu-application-button-selected {
padding: 7px;
color: #ffffff;
- background-color: #525352;
- border: 1px solid #202020; }
+ background-color: #303036;
+ border: 1px solid rgba(0, 0, 0, 0);
+ border-radius: 6px; }
.menu-application-button-selected:highlighted {
font-weight: bold; }
.menu-application-button-label:ltr {
@@ -1159,16 +962,19 @@ StScrollBar {
.menu-category-button-selected {
padding: 7px;
color: #ffffff;
- background-color: #525352;
- border: 1px solid #202020; }
- .menu-category-button:hover {
- background-color: #3d3d3d;
- border: 1px solid #292929;
- border-radius: 0px; }
+ background-color: #303036;
+ border: 1px solid rgba(0, 0, 0, 0);
+ border-radius: 6px; }
.menu-category-button-greyed {
padding: 7px;
- color: rgba(255, 255, 255, 0.32);
+ color: rgba(225, 225, 225, 0.45);
border: 1px solid rgba(0, 0, 0, 0); }
+ .menu-category-button:hover {
+ padding: 7px;
+ color: #ffffff;
+ background-color: #303036;
+ border: 1px solid rgba(0, 0, 0, 0);
+ border-radius: 6px; }
.menu-category-button-label:ltr {
padding-left: 5px; }
.menu-category-button-label:rtl {
@@ -1199,48 +1005,125 @@ StScrollBar {
width: 250px;
min-height: 16px;
font-weight: normal;
- caret-color: rgba(255, 255, 255, 0.87); }
+ caret-color: #e1e1e1;
+ border-radius: 6px; }
.menu-search-entry-icon {
icon-size: 1em;
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
/* Context menu (at the moment only for favorites) */
-.info-osd {
- text-align: center;
- font-weight: bold;
- spacing: 1em;
- padding: 16px;
- color: rgba(255, 255, 255, 0.87);
- border: 1px solid #202020;
- border-radius: 5px;
- background-color: #2f2f2f; }
+.appmenu-category-button-greyed, .appmenu-category-button-selected, .appmenu-category-button, .appmenu-application-button-selected, .appmenu-application-button, .appmenu-sidebar-button {
+ padding: 7px;
+ spacing: 5px;
+ border-radius: 6px; }
-.restart-osd {
- font-size: 1.6em; }
+.appmenu-background .popup-menu-content {
+ padding: 0; }
-.workspace-osd {
- font-size: 4em; }
+.appmenu-main-box {
+ spacing: 10px; }
-.osd-window {
- text-align: center;
- font-weight: bold;
- spacing: 1em;
- padding: 20px;
- color: rgba(255, 255, 255, 0.87);
- background-color: #2f2f2f;
- border: 1px solid #202020;
- border-radius: 5px; }
- .osd-window .osd-monitor-label {
- font-size: 3em; }
- .osd-window .level {
- padding: 0;
- height: 0.7em;
- background-color: rgba(0, 0, 0, 0.5);
- border-radius: 2px; }
- .osd-window .level-bar {
- border-radius: 2px;
- background-color: #35a854; }
+.appmenu-right-box {
+ spacing: 5px;
+ padding: 10px 10px; }
+
+.appmenu-categories-applications-box {
+ spacing: 15px; }
+ .appmenu-categories-applications-box:top {
+ padding-top: 5px; }
+
+.appmenu-applications-box {
+ padding-right: 5px; }
+
+.appmenu-search-box {
+ spacing: 10px; }
+
+.appmenu-sidebar {
+ padding: 15px 0px;
+ background-color: #303036;
+ border-radius: 6px 0 0 0;
+ border-right-width: 1px;
+ border-color: #303036;
+ spacing: 5px; }
+ .menu-top .appmenu-sidebar {
+ border-radius: 0 0 0 6px; }
+ .menu-bottom .appmenu-sidebar {
+ border-radius: 6px 0 0 0; }
+ .menu-left .appmenu-sidebar {
+ border-radius: 0; }
+ .menu-right .appmenu-sidebar {
+ border-radius: 0; }
+ .appmenu-sidebar .appmenu-system-button {
+ background-color: #494951; }
+ .appmenu-sidebar .appmenu-system-button-lock:hover {
+ background-color: #55555f; }
+ .appmenu-sidebar .appmenu-system-button-logout:hover {
+ background-color: #55555f; }
+ .appmenu-sidebar .appmenu-system-button-shutdown {
+ color: white;
+ background-color: #c01c28; }
+ .appmenu-sidebar .appmenu-system-button-shutdown:hover {
+ color: white;
+ background-color: #d61f2d; }
+
+.appmenu-system-box {
+ spacing: 10px; }
+
+.appmenu-sidebar-button {
+ padding: 4px 7px;
+ margin: 0 10px; }
+ .appmenu-sidebar-button:hover {
+ background-color: #44444c;
+ border-color: #303036; }
+
+.appmenu-system-button {
+ padding: 8.4px;
+ border: 1px solid #303036;
+ border-radius: 9999px;
+ background-color: #3c3c44; }
+ .appmenu-system-button-shutdown {
+ color: white;
+ background-color: #c01c28; }
+ .appmenu-system-button-lock:hover {
+ background-color: #494951; }
+ .appmenu-system-button-logout:hover {
+ background-color: #494951; }
+ .appmenu-system-button-shutdown:hover {
+ color: white;
+ background-color: #d61f2d; }
+
+.appmenu-application-button-label {
+ padding: 0; }
+
+.appmenu-application-button-description {
+ color: #a0a0a0; }
+
+.appmenu-application-button:highlighted {
+ font-weight: bold; }
+
+.appmenu-application-button-selected {
+ background-color: #303036; }
+ .appmenu-application-button-selected:highlighted {
+ font-weight: bold; }
+
+.appmenu-category-button-label {
+ padding: 0; }
+
+.appmenu-category-button:hover {
+ background-color: #44444c; }
+
+.appmenu-category-button-selected {
+ background-color: #303036; }
+
+.appmenu-category-button-greyed {
+ color: rgba(225, 225, 225, 0.45);
+ font-style: italic; }
+ .appmenu-category-button-greyed StIcon {
+ opacity: 0.5; }
+
+.appmenu-search-entry-icon {
+ icon-size: 1em; }
.window-list-box {
spacing: 6px;
@@ -1267,7 +1150,7 @@ StScrollBar {
padding-left: 8px;
padding-right: 8px;
transition-duration: 100;
- color: rgba(255, 255, 255, 0.67); }
+ color: rgba(225, 225, 225, 0.8); }
.window-list-item-box.top, .window-list-item-box.bottom {
border-bottom-width: 2px; }
.window-list-item-box.top StLabel, .window-list-item-box.bottom StLabel {
@@ -1285,12 +1168,12 @@ StScrollBar {
.window-list-item-box.left StBin {
padding-left: 1px; }
.window-list-item-box:hover, .window-list-item-box:groupFocus {
- color: rgba(255, 255, 255, 0.87);
- background-color: rgba(255, 255, 255, 0.07); }
+ color: #e1e1e1;
+ background-color: rgba(225, 225, 225, 0.2); }
.window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:focus, .window-list-item-box:running {
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
border-color: #35a854;
- background-color: rgba(255, 255, 255, 0.07); }
+ background-color: rgba(225, 225, 225, 0.2); }
.window-list-item-box .progress {
background-color: rgba(53, 168, 84, 0.8); }
@@ -1301,9 +1184,9 @@ StScrollBar {
.window-list-preview {
spacing: 6px;
- color: rgba(255, 255, 255, 0.87);
- border: 1px solid #202020;
- background-color: #2f2f2f;
+ color: #e1e1e1;
+ border: 1px solid rgba(0, 0, 0, 0);
+ background-color: #222226;
border-radius: 3px;
padding: 6px 12px 12px 12px;
font-size: 1em; }
@@ -1321,11 +1204,9 @@ StScrollBar {
padding-left: 8px;
padding-right: 8px;
transition-duration: 100;
- color: rgba(255, 255, 255, 0.67); }
+ color: rgba(225, 225, 225, 0.8); }
.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom {
border-bottom-width: 2px; }
- .grouped-window-list-item-box.top StLabel, .grouped-window-list-item-box.bottom StLabel {
- padding-left: 2px; }
.grouped-window-list-item-box.right {
padding-left: 0px;
padding-right: 0px;
@@ -1339,10 +1220,10 @@ StScrollBar {
.grouped-window-list-item-box.left StBin {
padding-left: 1px; }
.grouped-window-list-item-box:hover, .grouped-window-list-item-box:focus {
- color: rgba(255, 255, 255, 0.87);
- background-color: rgba(255, 255, 255, 0.17); }
+ color: #e1e1e1;
+ background-color: #41584d; }
.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked {
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
border-color: #35a854; }
.grouped-window-list-item-box .progress {
background-color: rgba(53, 168, 84, 0.8); }
@@ -1356,15 +1237,17 @@ StScrollBar {
padding-left: 4px; }
.grouped-window-list-number-label {
- font-size: 0.8em;
- z-index: 99;
+ font-size: 12px;
color: #ffffff; }
.grouped-window-list-badge {
- border-radius: 9999px;
+ border-radius: 99px;
background-color: #35a854;
margin: 0; }
+.grouped-window-list-notifications-badge-label {
+ font-size: 12px; }
+
.grouped-window-list-button-label {
padding-left: 4px; }
@@ -1372,9 +1255,9 @@ StScrollBar {
background: rgba(255, 52, 52, 0.3); }
.grouped-window-list-thumbnail-menu {
- color: rgba(255, 255, 255, 0.87);
- border: 1px solid #202020;
- background-color: #2f2f2f;
+ color: #e1e1e1;
+ border: 1px solid rgba(0, 0, 0, 0);
+ background-color: #222226;
border-radius: 3px;
padding: 0px; }
.grouped-window-list-thumbnail-menu > StBoxLayout {
@@ -1451,10 +1334,10 @@ StScrollBar {
.sound-player > StBoxLayout:first-child StButton:small StIcon {
icon-size: 12px; }
.sound-player > StBoxLayout:first-child StButton:small:hover {
- color: rgba(255, 255, 255, 0.87);
- background-color: #525252;
- border: 1px solid #202020;
- box-shadow: inset 0 2px 4px rgba(82, 82, 82, 0.05); }
+ color: #e1e1e1;
+ background-color: #3c3c44;
+ border: 1px solid #303036;
+ box-shadow: inset 0 2px 4px rgba(60, 60, 68, 0.05); }
.sound-player > StBoxLayout:first-child StButton:small:active {
color: #ffffff;
background-color: #35a854;
@@ -1468,23 +1351,23 @@ StScrollBar {
width: 290px;
padding: 15px;
spacing: 0.5em;
- background: rgba(47, 47, 47, 0.9);
- border-top: 1px solid #202020;
- color: rgba(255, 255, 255, 0.87); }
+ background: rgba(34, 34, 38, 0.9);
+ border-top: 1px solid #303036;
+ color: #e1e1e1; }
.sound-player-overlay StButton {
width: 22px;
height: 13px;
padding: 5px;
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
border-radius: 2px;
border: 1px solid transparent; }
.sound-player-overlay StButton StIcon {
icon-size: 16px; }
.sound-player-overlay StButton:hover {
- color: rgba(255, 255, 255, 0.87);
- background-color: #525252;
- border: 1px solid #202020;
- box-shadow: inset 0 2px 4px rgba(82, 82, 82, 0.05); }
+ color: #e1e1e1;
+ background-color: #3c3c44;
+ border: 1px solid #303036;
+ box-shadow: inset 0 2px 4px rgba(60, 60, 68, 0.05); }
.sound-player-overlay StButton:active {
color: #ffffff;
background-color: #35a854;
@@ -1500,72 +1383,52 @@ StScrollBar {
padding: 0;
border: none;
-slider-height: 0.5em;
- -slider-background-color: #222222;
+ -slider-background-color: #161619;
-slider-border-color: rgba(0, 0, 0, 0);
-slider-active-background-color: #35a854;
-slider-active-border-color: rgba(0, 0, 0, 0);
-slider-border-width: 0px;
-slider-handle-radius: 0px; }
-#workspaceSwitcher {
- spacing: 0px;
- padding: 3px; }
-
-/* Controls the styling when using the "Simple buttons" option */
-.workspace-switcher {
- padding-left: 3px;
- padding-right: 3px; }
- .panel-left .workspace-switcher, .panel-right .workspace-switcher {
- padding: 0; }
+.panel-top .workspace-switcher,
+.panel-bottom .workspace-switcher {
+ padding: 0 4px; }
.workspace-button {
- border: 1px solid rgba(0, 0, 0, 0.4);
- background-color: rgba(0, 0, 0, 0.2);
- width: 20px;
- height: 14px;
- color: rgba(255, 255, 255, 0.45);
- padding: 3px;
- padding-top: 4px;
- transition-duration: 200; }
+ border: 1px solid #303036;
+ width: 2em;
+ color: rgba(225, 225, 225, 0.45);
+ background-color: rgba(225, 225, 225, 0.05); }
.workspace-button.vertical {
- height: 1.5em;
- width: 24px;
- padding: 0;
- padding-top: 3px;
- padding-bottom: 3px; }
+ height: 2em; }
.workspace-button:outlined {
- background-color: #35a854;
- color: #ffffff; }
+ background-color: #303036;
+ color: #e1e1e1; }
.workspace-button:outlined:hover {
- background-color: rgba(53, 168, 84, 0.7);
- color: #ffffff; }
+ background-color: #44444c; }
.workspace-button:hover {
- background-color: rgba(255, 255, 255, 0.07);
- color: #ffffff; }
+ background-color: #303036; }
+ .workspace-button:shaded {
+ background-color: #161619; }
-/* Controls the style when using the "Visual representation" option */
.workspace-graph {
- padding: 3px;
- spacing: 6px; }
-
-.workspace-graph .workspace {
- border: 1px solid rgba(0, 0, 0, 0.4);
- background-color: rgba(0, 0, 0, 0.2); }
-
-.workspace-graph .workspace:active {
- border: 1px solid #35a854; }
-
-.workspace-graph .workspace .windows {
- -active-window-background: #555555;
- -active-window-border: rgba(0, 0, 0, 0.8);
- -inactive-window-background: #555555;
- -inactive-window-border: rgba(0, 0, 0, 0.8); }
-
-.workspace-graph .workspace:active .windows {
- -active-window-background: #6f6f6f;
- -active-window-border: rgba(0, 0, 0, 0.8);
- -inactive-window-background: #3c3c3c;
- -inactive-window-border: rgba(0, 0, 0, 0.8); }
+ padding: 4px;
+ spacing: 4px; }
+ .workspace-graph .workspace {
+ border: 1px solid rgba(225, 225, 225, 0.2);
+ background-color: #222226; }
+ .workspace-graph .workspace:active {
+ border-color: #35a854; }
+ .workspace-graph .workspace:active .windows {
+ -active-window-background: rgba(255, 255, 255, 0.3);
+ -active-window-border: rgba(255, 255, 255, 0.35);
+ -inactive-window-background: rgba(255, 255, 255, 0.1);
+ -inactive-window-border: rgba(255, 255, 255, 0.15); }
+ .workspace-graph .workspace .windows {
+ -active-window-background: rgba(255, 255, 255, 0.3);
+ -active-window-border: rgba(255, 255, 255, 0.35);
+ -inactive-window-background: rgba(255, 255, 255, 0.1);
+ -inactive-window-border: rgba(255, 255, 255, 0.15); }
.panel-launchers {
padding-left: 7px;
@@ -1576,7 +1439,7 @@ StScrollBar {
padding-bottom: 2px;
transition-duration: 200; }
.panel-launchers .launcher:hover {
- background-color: #525352; }
+ background-color: #303036; }
.panel-launchers.vertical {
padding-top: 2px;
padding-bottom: 2px;
@@ -1599,27 +1462,23 @@ StScrollBar {
.applet-separator-line {
width: 1px;
- background: rgba(255, 255, 255, 0.12); }
+ background: #303036; }
.applet-separator-line-vertical {
height: 1px;
- background: rgba(255, 255, 255, 0.12); }
+ background: #303036; }
.applet-box {
- padding-left: 4px;
- padding-right: 4px;
- spacing: 4px;
- color: rgba(255, 255, 255, 0.87);
+ padding: 0 5px;
+ spacing: 5px;
+ color: #e1e1e1;
text-shadow: none;
transition-duration: 100;
text-align: center; }
.applet-box.vertical {
- padding-left: 0px;
- padding-right: 0px;
- padding-top: 3px;
- padding-bottom: 3px; }
+ padding: 5px 0; }
.applet-box:hover, .applet-box:checked {
color: #ffffff;
- background-color: #525352; }
+ background-color: #41584d; }
.applet-box:highlight {
background-image: none;
border-image: none;
@@ -1627,7 +1486,7 @@ StScrollBar {
.applet-label {
font-weight: bold;
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
.applet-label:hover, .applet-label:checked, .applet-box:hover .applet-label, .applet-box:checked .applet-label {
color: #ffffff;
text-shadow: none; }
@@ -1640,47 +1499,69 @@ StScrollBar {
text-shadow: none; }
.user-icon {
- width: 32px;
- height: 32px;
- background-color: transparent;
- border: none;
- border-radius: 0; }
+ background-size: contain;
+ border-radius: 99px;
+ color: #e1e1e1;
+ border-color: transparent; }
+ .user-icon StIcon {
+ border: 1px solid transparent;
+ border-radius: 99px;
+ padding: 14px; }
+ .user-icon StIcon.highlighted {
+ border: 1px solid #e1e1e1;
+ border-radius: 99px;
+ padding: 14px; }
+ .user-icon.user-avatar {
+ border: 1px solid transparent;
+ border-radius: 99px; }
.user-label {
- color: rgba(255, 255, 255, 0.87);
+ color: #e1e1e1;
font-size: 1em;
font-weight: bold;
margin: 0px; }
+.user-widget.horizontal {
+ spacing: 7px; }
+
+.user-widget.vertical {
+ spacing: 10px; }
+
+.user-widget.vertical .user-widget-label {
+ color: #e1e1e1;
+ text-align: center; }
+
.applet-cornerbar {
width: 8px;
- background-color: rgba(255, 255, 255, 0.12); }
- .applet-cornerbar-box {
- padding: 4px 4px; }
- .applet-cornerbar-box:hover > .applet-cornerbar {
- background-color: rgba(255, 255, 255, 0.22); }
+ background-color: #303036;
+ border: 1px solid #303036; }
.applet-cornerbar.vertical {
height: 8px; }
+ .applet-cornerbar-box {
+ background: none; }
+
+.applet-cornerbar-box:hover > .applet-cornerbar {
+ background-color: #494951; }
.desklet {
- color: rgba(255, 255, 255, 0.87); }
+ color: #e1e1e1; }
.desklet:highlight {
background-color: rgba(252, 65, 56, 0.5); }
.desklet-with-borders {
- border: 1px solid #202020;
+ border: 1px solid #303036;
border-radius: 5px;
- background-color: #2f2f2f;
- color: rgba(255, 255, 255, 0.87);
+ background-color: #222226;
+ color: #e1e1e1;
padding: 12px;
padding-bottom: 16px; }
.desklet-with-borders:highlight {
background-color: rgba(252, 65, 56, 0.5); }
.desklet-with-borders-and-header {
- border: 1px solid #202020;
+ border: 1px solid #303036;
border-top-width: 0;
border-radius: 0 0 5px 5px;
- background-color: #2f2f2f;
- color: rgba(255, 255, 255, 0.87);
+ background-color: #222226;
+ color: #e1e1e1;
border-radius: 0;
border-radius-topleft: 0;
border-radius-topright: 0;
@@ -1689,10 +1570,10 @@ StScrollBar {
.desklet-with-borders-and-header:highlight {
background-color: rgba(252, 65, 56, 0.5); }
.desklet-header {
- border: 1px solid #202020;
+ border: 1px solid #303036;
border-radius: 5px 5px 0 0;
- background-color: #272727;
- color: rgba(255, 255, 255, 0.87);
+ background-color: #1b1b1e;
+ color: #e1e1e1;
font-size: 1em;
padding: 12px;
padding-bottom: 6px; }
@@ -1701,10 +1582,10 @@ StScrollBar {
background-color: rgba(53, 168, 84, 0.3); }
.photoframe-box {
- border: 1px solid #202020;
+ border: 1px solid #303036;
border-radius: 5px;
- background-color: #2f2f2f;
- color: rgba(255, 255, 255, 0.87);
+ background-color: #222226;
+ color: #e1e1e1;
padding: 12px;
padding-bottom: 16px; }
@@ -1751,3 +1632,484 @@ StScrollBar {
border: 0px;
background-color: rgba(0, 0, 0, 0);
border-radius: 0px; }
+
+.prompt-dialog-error-label, .prompt-dialog-info-label, .prompt-dialog-null-label, .run-dialog-description, .message-dialog-content .message-dialog-caption, .dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-description, .appmenu-application-button-description {
+ font-weight: 400;
+ font-size: 0.818em; }
+
+.message-dialog-content .message-dialog-title, .dialog .confirm-dialog-title {
+ font-weight: 800;
+ font-size: 1.364em; }
+
+.workspace-switch-osd, .media-keys-osd, .message-dialog-content .message-dialog-title.lightweight, .user-widget.vertical .user-widget-label {
+ font-weight: 700;
+ font-size: 1.182em; }
+
+.polkit-dialog-user-combo, .dialog-list .dialog-list-title {
+ font-weight: 700;
+ font-size: 1em; }
+
+.audio-device-selection-dialog .audio-selection-box .audio-selection-device, .polkit-dialog-user-combo {
+ border: 1px solid #222226;
+ color: #e1e1e1;
+ background-color: #222226; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device:focus, .polkit-dialog-user-combo:focus {
+ border: 1px solid #222226;
+ color: #e1e1e1;
+ background-color: #222226;
+ border: 1px solid #6a6a77; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device:hover, .polkit-dialog-user-combo:hover {
+ border: 1px solid #222226;
+ color: #e1e1e1;
+ background-color: #3a3a41; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device:insensitive, .polkit-dialog-user-combo:insensitive {
+ border: 1px solid #222226;
+ color: rgba(225, 225, 225, 0.5);
+ background-color: #222226; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device:selected, .polkit-dialog-user-combo:selected, .audio-device-selection-dialog .audio-selection-box .audio-selection-device:active, .polkit-dialog-user-combo:active {
+ border: 1px solid #222226;
+ color: #e1e1e1;
+ background-color: #2e2e33; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device:checked, .polkit-dialog-user-combo:checked {
+ border: 1px solid #222226;
+ color: #e1e1e1;
+ background-color: #2e2e33; }
+
+.dialog .dialog-button, .dialog .dialog-button:destructive-action, .dialog .dialog-button:default {
+ font-weight: bold;
+ padding: 12px;
+ border-radius: 18px;
+ border: 1px solid #303036;
+ color: #e1e1e1;
+ background-color: #303036; }
+ .dialog .dialog-button:focus {
+ border: 1px solid #303036;
+ color: #e1e1e1;
+ background-color: #303036;
+ border: 1px solid #797987; }
+ .dialog .dialog-button:hover {
+ border: 1px solid #303036;
+ color: #e1e1e1;
+ background-color: #494951; }
+ .dialog .dialog-button:active {
+ border: 1px solid #303036;
+ color: #e1e1e1;
+ background-color: #3c3c44; }
+ .dialog .dialog-button:checked {
+ border: 1px solid #303036;
+ color: #e1e1e1;
+ background-color: #3c3c44; }
+ .dialog .dialog-button:insensitive {
+ border: 1px solid #303036;
+ color: rgba(225, 225, 225, 0.5);
+ background-color: #29292e; }
+
+.dialog .dialog-button:default {
+ border: 1px solid #35a854;
+ color: #e1e1e1;
+ background-color: #35a854; }
+ .dialog .dialog-button:focus:default {
+ border: 1px solid #35a854;
+ color: #e1e1e1;
+ background-color: #35a854;
+ border: 1px solid #98deab; }
+ .dialog .dialog-button:hover:default {
+ border: 1px solid #35a854;
+ color: #e1e1e1;
+ background-color: #4ac66b; }
+ .dialog .dialog-button:active:default {
+ border: 1px solid #35a854;
+ color: #e1e1e1;
+ background-color: #3bbb5e; }
+ .dialog .dialog-button:checked:default {
+ border: 1px solid #35a854;
+ color: #e1e1e1;
+ background-color: #3bbb5e; }
+ .dialog .dialog-button:insensitive:default {
+ border-color: #303036;
+ border: 1px solid #303036;
+ color: rgba(225, 225, 225, 0.5);
+ background-color: #29292e; }
+
+.dialog .dialog-button:destructive-action {
+ border: 1px solid #c01c28;
+ color: #e1e1e1;
+ background-color: #c01c28; }
+ .dialog .dialog-button:focus:destructive-action {
+ border: 1px solid #c01c28;
+ color: #e1e1e1;
+ background-color: #c01c28;
+ border: 1px solid #ee878f; }
+ .dialog .dialog-button:hover:destructive-action {
+ border: 1px solid #c01c28;
+ color: #e1e1e1;
+ background-color: #e12e3b; }
+ .dialog .dialog-button:active:destructive-action {
+ border: 1px solid #c01c28;
+ color: #e1e1e1;
+ background-color: #d61f2d; }
+ .dialog .dialog-button:checked:destructive-action {
+ border: 1px solid #c01c28;
+ color: #e1e1e1;
+ background-color: #d61f2d; }
+ .dialog .dialog-button:insensitive:destructive-action {
+ border-color: #303036;
+ border: 1px solid #303036;
+ color: rgba(225, 225, 225, 0.5);
+ background-color: #29292e; }
+
+.dialog {
+ background-color: #222226;
+ border-radius: 18px;
+ border: 1px solid #303036;
+ padding: 18px; }
+ .dialog .dialog-content-box {
+ margin-top: 8px;
+ margin-bottom: 16px;
+ spacing: 32px;
+ max-width: 28em; }
+ .dialog .confirm-dialog-title {
+ text-align: center; }
+
+.dialog-list {
+ spacing: 18px; }
+ .dialog-list .dialog-list-title {
+ text-align: center; }
+ .dialog-list .dialog-list-scrollview {
+ max-height: 200px; }
+ .dialog-list .dialog-list-box {
+ spacing: 1em; }
+ .dialog-list .dialog-list-box .dialog-list-item {
+ spacing: 1em; }
+ .dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-title {
+ font-weight: bold; }
+ .dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-description {
+ color: #d4d4d4; }
+
+.end-session-dialog {
+ min-width: 40em; }
+ .end-session-dialog .dialog-content-box {
+ spacing: 0; }
+ .end-session-dialog .dialog-list {
+ spacing: 0; }
+ .end-session-dialog .dialog-list .dialog-list-title {
+ color: #F27835;
+ background-color: tranparentize(#F27835, 0.9);
+ padding: 9px;
+ border-radius: 20px;
+ margin: 4px 0; }
+
+.message-dialog-content {
+ spacing: 18px; }
+ .message-dialog-content .message-dialog-title {
+ text-align: center; }
+ .message-dialog-content .message-dialog-description {
+ text-align: center; }
+ .message-dialog-content .message-dialog-caption {
+ text-align: center; }
+
+.run-dialog .dialog-content-box {
+ margin: 4px; }
+
+.run-dialog-description {
+ text-align: center;
+ color: #aeaeae; }
+ .run-dialog-description.error {
+ color: #FC4138; }
+
+.run-dialog-completion-box {
+ padding-top: 6px;
+ padding-left: 12px; }
+
+.run-dialog-entry {
+ width: 20em;
+ height: 1.2em; }
+
+.prompt-dialog {
+ width: 28em; }
+ .prompt-dialog .dialog-content-box {
+ spacing: 16px;
+ margin-bottom: 12px; }
+ .prompt-dialog-password-entry {
+ width: 20em; }
+ .prompt-dialog-password-layout {
+ spacing: 8px; }
+ .prompt-dialog-error-label, .prompt-dialog-info-label, .prompt-dialog-null-label {
+ text-align: center; }
+ .prompt-dialog-error-label {
+ color: #FC4138; }
+
+.polkit-dialog-user-layout {
+ text-align: center;
+ spacing: 2px; }
+
+.polkit-dialog-user-combo {
+ border-radius: 6px;
+ padding: 6px 36px; }
+ .polkit-dialog-user-combo:insensitive {
+ color: #e1e1e1; }
+
+.audio-device-selection-dialog {
+ min-width: 24em; }
+ .audio-device-selection-dialog .audio-selection-box {
+ spacing: 12px; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device {
+ border-radius: 20px; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device .audio-selection-device-box {
+ padding: 12px;
+ spacing: 12px; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device .audio-selection-device-icon {
+ icon-size: 64px; }
+
+.workspace-switch-osd, .info-osd, .media-keys-osd {
+ background-color: #222226;
+ border: 1px solid #303036;
+ border-radius: 20px;
+ text-align: center;
+ padding: 24px; }
+
+.media-keys-osd {
+ margin-bottom: 1em;
+ border-radius: 20px;
+ font-weight: bold;
+ spacing: 12px;
+ padding: 12px 24px; }
+ .media-keys-osd > * {
+ spacing: 12px; }
+ .media-keys-osd StIcon {
+ icon-size: 32px; }
+ .media-keys-osd StLabel:ltr {
+ margin-right: 6px; }
+ .media-keys-osd StLabel:rtl {
+ margin-left: 6px; }
+ .media-keys-osd .level {
+ min-width: 160px;
+ -barlevel-height: 6px;
+ -barlevel-background-color: #303036;
+ -barlevel-active-background-color: #e1e1e1;
+ -barlevel-amplify-color: #F27835;
+ -barlevel-amplify-separator-width: 3px; }
+ .media-keys-osd .level:ltr {
+ margin-right: 6px; }
+ .media-keys-osd .level:rtl {
+ margin-left: 6px; }
+ .media-keys-osd .level-bar {
+ border-radius: 20px;
+ background-color: #e1e1e1; }
+
+.info-osd {
+ font-size: 1.2em;
+ font-weight: 700;
+ text-align: center; }
+
+.workspace-switch-osd {
+ min-width: 140px;
+ margin-bottom: 1em;
+ border-radius: 20px;
+ font-weight: bold;
+ padding: 12px 36px 0 36px; }
+ .workspace-switch-osd-indicator-box {
+ spacing: 12px; }
+ .workspace-switch-osd-indicator {
+ background-color: rgba(225, 225, 225, 0.5);
+ padding: 3px;
+ margin: 15px;
+ border-radius: 36px; }
+ .workspace-switch-osd-indicator:active {
+ background-color: #35a854;
+ padding: 6px;
+ margin: 12px; }
+
+.monitor-label {
+ border-radius: 0;
+ color: black;
+ padding: 12px;
+ text-align: center; }
+
+.resize-popup {
+ color: #e1e1e1;
+ background-color: #222226;
+ border-radius: 6px;
+ padding: 12px; }
+
+/*
+On-Screen Keyboard (>= Cinnamon 6.6)
+*/
+#virtual-keyboard {
+ background-color: #1d1d21;
+ box-shadow: inset 0 1px 0 0 #303036; }
+
+.vkeyboard-key-container {
+ padding: 4px;
+ spacing: 4px; }
+
+.vkeyboard-key {
+ color: #e1e1e1;
+ background-color: #303036;
+ border: 1px solid #303036;
+ box-shadow: inset 0 2px 4px rgba(48, 48, 54, 0.05);
+ font-size: 1.364em;
+ border-width: 1px;
+ border-style: solid;
+ border-radius: 6px;
+ background-color: #303036; }
+ .vkeyboard-key:focus {
+ color: #e1e1e1;
+ background-color: #303036;
+ border: 1px solid #35a854;
+ box-shadow: inset 0 2px 4px rgba(48, 48, 54, 0.05); }
+ .vkeyboard-key:hover, .vkeyboard-key:checked {
+ color: #e1e1e1;
+ background-color: #3c3c44;
+ border: 1px solid #303036;
+ box-shadow: inset 0 2px 4px rgba(60, 60, 68, 0.05); }
+ .vkeyboard-key:active {
+ color: #ffffff;
+ background-color: #35a854;
+ border: 1px solid #35a854;
+ box-shadow: inset 0 2px 4px #35a854; }
+ .vkeyboard-key.shift-key-uppercase {
+ background-color: #5e5e69; }
+ .vkeyboard-key.enter-key {
+ background-color: #35a854; }
+ .vkeyboard-key.shift-key-lowercase, .vkeyboard-key.escape-key, .vkeyboard-key.hide-key, .vkeyboard-key.non-alpha-key {
+ background-color: #38383e; }
+ .vkeyboard-key.shift-key-lowercase:focus, .vkeyboard-key.escape-key:focus, .vkeyboard-key.hide-key:focus, .vkeyboard-key.non-alpha-key:focus {
+ color: #e1e1e1;
+ background-color: #303036;
+ border: 1px solid #35a854;
+ box-shadow: inset 0 2px 4px rgba(48, 48, 54, 0.05); }
+ .vkeyboard-key.shift-key-lowercase:hover, .vkeyboard-key.shift-key-lowercase:checked, .vkeyboard-key.escape-key:hover, .vkeyboard-key.escape-key:checked, .vkeyboard-key.hide-key:hover, .vkeyboard-key.hide-key:checked, .vkeyboard-key.non-alpha-key:hover, .vkeyboard-key.non-alpha-key:checked {
+ color: #e1e1e1;
+ background-color: #3c3c44;
+ border: 1px solid #303036;
+ box-shadow: inset 0 2px 4px rgba(60, 60, 68, 0.05); }
+ .vkeyboard-key.shift-key-lowercase:active, .vkeyboard-key.escape-key:active, .vkeyboard-key.hide-key:active, .vkeyboard-key.non-alpha-key:active {
+ color: #ffffff;
+ background-color: #35a854;
+ border: 1px solid #35a854;
+ box-shadow: inset 0 2px 4px #35a854; }
+ .vkeyboard-key.modifier-key {
+ background-color: #38383e; }
+ .vkeyboard-key.modifier-key:hover, .vkeyboard-key.modifier-key:checked {
+ color: #e1e1e1;
+ background-color: #3c3c44;
+ border: 1px solid #303036;
+ box-shadow: inset 0 2px 4px rgba(60, 60, 68, 0.05); }
+ .vkeyboard-key.modifier-key:latched {
+ background-color: #5e5e69; }
+ .vkeyboard-key StIcon {
+ icon-size: 1.125em; }
+
+.vkeyboard-subkeys {
+ color: #e1e1e1;
+ -arrow-border-radius: 8px;
+ -arrow-background-color: #222226;
+ -arrow-border-width: 1px;
+ -arrow-border-color: #38383e;
+ -arrow-base: 20px;
+ -arrow-rise: 10px;
+ -boxpointer-gap: 6px; }
+
+.word-suggestions {
+ font-size: 1.227em;
+ spacing: 20px;
+ min-height: 20pt; }
+
+.candidate-popup-boxpointer {
+ -arrow-border-radius: 8px;
+ -arrow-background-color: #222226;
+ -arrow-border-width: 1px;
+ -arrow-border-color: #303036;
+ -arrow-base: 12px;
+ -arrow-rise: 6px;
+ -arrow-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5); }
+
+.candidate-popup-content {
+ padding: 0.5em;
+ spacing: 0.3em; }
+
+.candidate-index {
+ padding: 0 0.5em 0 0;
+ color: #c8c8c8; }
+
+.candidate-box {
+ padding: 0.3em 0.5em 0.3em 0.5em;
+ border-radius: 6px;
+ color: #e1e1e1; }
+ .candidate-box:selected, .candidate-box:hover {
+ background-color: #38383e; }
+
+.candidate-page-button-box {
+ height: 2em; }
+ .vertical .candidate-page-button-box {
+ padding-top: 0.5em; }
+ .horizontal .candidate-page-button-box {
+ padding-left: 0.5em; }
+
+.candidate-page-button {
+ padding: 4px; }
+
+.candidate-page-button-previous {
+ border-radius: 6px 0px 0px 6px;
+ border-right-width: 0; }
+
+.candidate-page-button-next {
+ border-radius: 0px 6px 6px 0px; }
+
+.candidate-page-button-icon {
+ icon-size: 1em; }
+
+/*
+****** DEPRECATED
+
+On-Screen Keyboard (<= Cinnamon 6.4)
+*/
+#keyboard {
+ background-color: #303030;
+ border-width: 0;
+ border-top-width: 1px;
+ border-color: rgba(0, 0, 0, 0.4); }
+
+.keyboard-layout {
+ spacing: 10px;
+ padding: 10px; }
+
+.keyboard-row {
+ spacing: 15px; }
+
+.keyboard-key {
+ min-height: 2em;
+ min-width: 2em;
+ font-size: 1.4em;
+ font-weight: bold;
+ border-radius: 3px;
+ box-shadow: none;
+ color: #c3c3c3;
+ border: 1px solid #303036;
+ background-color: rgba(104, 104, 104, 0.4); }
+ .keyboard-key:hover {
+ color: #c3c3c3;
+ border: 1px solid rgba(0, 0, 0, 0.4);
+ background-color: rgba(122, 122, 122, 0.5); }
+ .keyboard-key:active, .keyboard-key:checked {
+ color: #ffffff;
+ border: 1px solid #35a854;
+ background-color: #35a854; }
+ .keyboard-key:grayed {
+ color: #5c5c5c;
+ border: 1px solid rgba(0, 0, 0, 0.4);
+ background-color: rgba(104, 104, 104, 0.25); }
+
+.keyboard-subkeys {
+ color: #c3c3c3;
+ padding: 5px;
+ -arrow-border-radius: 2px;
+ -arrow-background-color: #303030;
+ -arrow-border-width: 1px;
+ -arrow-border-color: rgba(0, 0, 0, 0.4);
+ -arrow-base: 20px;
+ -arrow-rise: 10px;
+ -boxpointer-gap: 5px; }
+
+/* ****** DEPRECATED */
diff --git a/cinnamon-shell/upstream/cinnamon.css b/cinnamon-shell/upstream/cinnamon.css
index 1c5b372a90..72f7535887 100644
--- a/cinnamon-shell/upstream/cinnamon.css
+++ b/cinnamon-shell/upstream/cinnamon.css
@@ -4,43 +4,43 @@ stage {
.label-shadow {
color: rgba(0, 0, 0, 0); }
-.sound-button, .modal-dialog-button-box .modal-dialog-button, .notification-button, .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button {
+.sound-button, .notification-button, .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button {
min-height: 20px;
padding: 5px 32px;
transition-duration: 0;
color: #303030;
- background-color: #ededed;
- border: 1px solid #b5b5b5;
- box-shadow: inset 0 2px 4px rgba(237, 237, 237, 0.05); }
- .sound-button, .modal-dialog-button-box .modal-dialog-button, .notification-button, .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button {
+ background-color: #b0b0b8;
+ border: 1px solid #b5b5bd;
+ box-shadow: inset 0 2px 4px rgba(176, 176, 184, 0.05); }
+ .sound-button, .notification-button, .notification-icon-button, .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button {
border-radius: 2px; }
- .sound-button:focus, .modal-dialog-button-box .modal-dialog-button:focus, .notification-button:focus, .notification-icon-button:focus, .popup-menu #notification .notification-button:focus, .popup-menu #notification .notification-icon-button:focus {
+ .sound-button:focus, .notification-button:focus, .notification-icon-button:focus, .popup-menu #notification .notification-button:focus, .popup-menu #notification .notification-icon-button:focus {
color: #303030;
- background-color: #ededed;
+ background-color: #b0b0b8;
border: 1px solid #35a854;
- box-shadow: inset 0 2px 4px rgba(237, 237, 237, 0.05); }
- .sound-button:hover, .modal-dialog-button-box .modal-dialog-button:hover, .notification-button:hover, .notification-icon-button:hover, .popup-menu #notification .notification-button:hover, .popup-menu #notification .notification-icon-button:hover {
+ box-shadow: inset 0 2px 4px rgba(176, 176, 184, 0.05); }
+ .sound-button:hover, .notification-button:hover, .notification-icon-button:hover, .popup-menu #notification .notification-button:hover, .popup-menu #notification .notification-icon-button:hover {
color: #303030;
- background-color: #fafafa;
- border: 1px solid #b5b5b5;
- box-shadow: inset 0 2px 4px rgba(250, 250, 250, 0.05); }
- .sound-button:hover:focus, .modal-dialog-button-box .modal-dialog-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, .popup-menu #notification .notification-button:hover:focus, .popup-menu #notification .notification-icon-button:hover:focus {
+ background-color: #bdbdc4;
+ border: 1px solid #b5b5bd;
+ box-shadow: inset 0 2px 4px rgba(189, 189, 196, 0.05); }
+ .sound-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, .popup-menu #notification .notification-button:hover:focus, .popup-menu #notification .notification-icon-button:hover:focus {
color: #303030;
- background-color: #fafafa;
+ background-color: #bdbdc4;
border: 1px solid #35a854;
- box-shadow: inset 0 2px 4px rgba(237, 237, 237, 0.05); }
- .sound-button:active, .modal-dialog-button-box .modal-dialog-button:active, .notification-button:active, .notification-icon-button:active, .popup-menu #notification .notification-button:active, .popup-menu #notification .notification-icon-button:active {
+ box-shadow: inset 0 2px 4px rgba(176, 176, 184, 0.05); }
+ .sound-button:active, .notification-button:active, .notification-icon-button:active, .popup-menu #notification .notification-button:active, .popup-menu #notification .notification-icon-button:active {
color: #ffffff;
background-color: #35a854;
border: 1px solid #35a854;
box-shadow: inset 0 2px 4px #35a854; }
- .sound-button:insensitive, .modal-dialog-button-box .modal-dialog-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, .popup-menu #notification .notification-button:insensitive, .popup-menu #notification .notification-icon-button:insensitive {
+ .sound-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, .popup-menu #notification .notification-button:insensitive, .popup-menu #notification .notification-icon-button:insensitive {
color: rgba(48, 48, 48, 0.55);
- border: 1px solid rgba(181, 181, 181, 0.55);
- background-color: rgba(237, 237, 237, 0.55);
- box-shadow: inset 0 2px 4px rgba(237, 237, 237, 0.05); }
+ border: 1px solid rgba(181, 181, 189, 0.55);
+ background-color: rgba(176, 176, 184, 0.55);
+ box-shadow: inset 0 2px 4px rgba(176, 176, 184, 0.05); }
-#menu-search-entry, .popup-menu #notification StEntry {
+.prompt-dialog-password-entry, .run-dialog-entry, #appmenu-search-entry, #menu-search-entry, .popup-menu #notification StEntry {
padding: 7px;
caret-size: 1px;
selection-background-color: #35a854;
@@ -48,23 +48,28 @@ stage {
transition-duration: 300ms;
border-radius: 3px;
color: #303030;
- background-color: #f4f4f4;
+ background-color: #d3d3d7;
border: 1px solid #cfd6e6;
- box-shadow: inset 0 2px 4px rgba(244, 244, 244, 0.05); }
- #menu-search-entry:focus, .popup-menu #notification StEntry:focus, #menu-search-entry:hover, .popup-menu #notification StEntry:hover {
+ box-shadow: inset 0 2px 4px rgba(211, 211, 215, 0.05); }
+ .prompt-dialog-password-entry:focus, .run-dialog-entry:focus, #appmenu-search-entry:focus, #menu-search-entry:focus, .popup-menu #notification StEntry:focus, .prompt-dialog-password-entry:hover, .run-dialog-entry:hover, #appmenu-search-entry:hover, #menu-search-entry:hover, .popup-menu #notification StEntry:hover {
color: #303030;
- background-color: #f4f4f4;
+ background-color: #d3d3d7;
border: 1px solid #35a854;
- box-shadow: inset 0 2px 4px rgba(244, 244, 244, 0.05); }
- #menu-search-entry:insensitive, .popup-menu #notification StEntry:insensitive {
+ box-shadow: inset 0 2px 4px rgba(211, 211, 215, 0.05); }
+ .prompt-dialog-password-entry:insensitive, .run-dialog-entry:insensitive, #appmenu-search-entry:insensitive, #menu-search-entry:insensitive, .popup-menu #notification StEntry:insensitive {
color: rgba(48, 48, 48, 0.55);
- background-color: #efefef;
- border-color: 1px solid #dadee7;
- box-shadow: inset 0 2px 4px rgba(239, 239, 239, 0.05); }
- #menu-search-entry StIcon.capslock-warning, .popup-menu #notification StEntry StIcon.capslock-warning {
+ background-color: #dedee1;
+ border-color: 1px solid #dcdfe9;
+ box-shadow: inset 0 2px 4px rgba(222, 222, 225, 0.05); }
+ .prompt-dialog-password-entry StIcon.capslock-warning, .run-dialog-entry StIcon.capslock-warning, #appmenu-search-entry StIcon.capslock-warning, #menu-search-entry StIcon.capslock-warning, .popup-menu #notification StEntry StIcon.capslock-warning {
icon-size: 16px;
warning-color: #F27835;
padding: 0 4px; }
+ .prompt-dialog-password-entry StLabel.hint-text, .run-dialog-entry StLabel.hint-text, #appmenu-search-entry StLabel.hint-text, #menu-search-entry StLabel.hint-text, .popup-menu #notification StEntry StLabel.hint-text {
+ color: rgba(48, 48, 48, 0.3); }
+ .prompt-dialog-password-entry StIcon.peek-password, .run-dialog-entry StIcon.peek-password, #appmenu-search-entry StIcon.peek-password, #menu-search-entry StIcon.peek-password, .popup-menu #notification StEntry StIcon.peek-password {
+ icon-size: 16px;
+ color: #303030; }
.notification StEntry {
padding: 7px;
@@ -75,8 +80,8 @@ stage {
transition-duration: 300ms;
border-radius: 3px;
color: #c3c3c3;
- background-color: rgba(109, 109, 109, 0.4);
- border: 1px solid rgba(22, 22, 22, 0.4);
+ background-color: rgba(104, 104, 104, 0.4);
+ border: 1px solid rgba(17, 17, 17, 0.4);
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05); }
.notification StEntry:focus {
color: #ffffff;
@@ -85,8 +90,8 @@ stage {
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05); }
.notification StEntry:insensitive {
color: rgba(195, 195, 195, 0.55);
- background-color: rgba(109, 109, 109, 0.25);
- border: 1px solid rgba(22, 22, 22, 0.4);
+ background-color: rgba(104, 104, 104, 0.25);
+ border: 1px solid rgba(17, 17, 17, 0.4);
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05); }
StScrollView.vfade {
@@ -101,15 +106,15 @@ StScrollBar {
min-width: 5px;
min-height: 5px; }
StScrollBar StBin#trough {
- background-color: rgba(244, 244, 244, 0.1);
+ background-color: rgba(211, 211, 215, 0.1);
border-radius: 8px; }
StScrollBar StButton#vhandle, StScrollBar StButton#hhandle {
border-radius: 2px;
- background-color: #9e9e9e;
+ background-color: #d3d3d7;
border: 0px solid;
margin: 0px; }
StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover {
- background-color: #b1b1b1; }
+ background-color: #b0b0b8; }
StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
background-color: #35a854; }
@@ -131,9 +136,9 @@ StScrollBar {
.slider {
-slider-height: 0.3em;
-slider-background-color: #cfd6e6;
- -slider-border-color: rgba(232, 232, 232, 0.3);
+ -slider-border-color: rgba(235, 235, 237, 0.3);
-slider-active-background-color: #35a854;
- -slider-active-border-color: rgba(232, 232, 232, 0.3);
+ -slider-active-border-color: rgba(235, 235, 237, 0.3);
-slider-border-width: 1px;
-slider-handle-radius: 0.5em;
height: 1em;
@@ -216,33 +221,32 @@ StScrollBar {
#LookingGlassDialog {
color: #303030;
- border: 1px solid #b5b5b5;
+ border: 1px solid #b5b5bd;
border-radius: 3px;
- background-color: #e8e8e8;
+ background-color: #ebebed;
spacing: 4px;
padding: 8px; }
.menu {
color: #303030;
- border: 1px solid #b5b5b5;
- border-radius: 3px;
- background-color: rgba(232, 232, 232, 0.99); }
- .menu.top {
- border-radius: 0 0 3px 3px; }
- .menu.bottom {
- border-radius: 3px 3px 0 0; }
- .menu.left {
- border-radius: 0 3px 3px 0; }
- .menu.right {
- border-radius: 3px 0 0 3px; }
+ background-color: #ebebed;
+ box-shadow: 0 0 6px rgba(0, 0, 0, 0.5); }
+ .menu-top {
+ border-radius: 0 0 6px 6px; }
+ .menu-bottom {
+ border-radius: 6px 6px 0 0; }
+ .menu-left {
+ border-radius: 0 6px 6px 0; }
+ .menu-right {
+ border-radius: 6px 0 0 6px; }
.popup-sub-menu {
- background-color: #f4f4f4;
+ background-color: #ebebed;
box-shadow: none; }
.popup-sub-menu .popup-menu-item:ltr {
- padding-right: 1.75em; }
+ padding-left: 2.5em; }
.popup-sub-menu .popup-menu-item:rtl {
- padding-left: 1.75em; }
+ padding-right: 2.5em; }
.popup-sub-menu StScrollBar {
padding: 4px; }
.popup-sub-menu StScrollBar StBin#trough, .popup-sub-menu StScrollBar StBin#vhandle {
@@ -258,7 +262,7 @@ StScrollBar {
border-right-width: 0; }
.popup-menu-item:active {
color: #303030;
- background-color: #c0c0c0; }
+ background-color: #d3d3d7; }
.popup-menu-item:insensitive {
color: rgba(48, 48, 48, 0.5);
background: none; }
@@ -268,60 +272,12 @@ StScrollBar {
.popup-inactive-menu-item:insensitive {
color: rgba(48, 48, 48, 0.55); }
-/* This is for popup menus in Cinnamon versions < 3.2 */
-.popup-menu {
- color: white;
- color: #303030; }
- .popup-menu-arrow {
- icon-size: 16px; }
- .popup-menu .popup-sub-menu {
- background-color: #f4f4f4;
- box-shadow: none; }
- .popup-menu .popup-sub-menu .popup-menu-item:ltr {
- padding-right: 1.75em; }
- .popup-menu .popup-sub-menu .popup-menu-item:rtl {
- padding-left: 1.75em; }
- .popup-menu .popup-sub-menu StScrollBar {
- padding: 4px; }
- .popup-menu .popup-sub-menu StScrollBar StBin#trough, .popup-menu .popup-sub-menu StScrollBar StBin#vhandle {
- border-width: 0; }
- .popup-menu .popup-menu-content {
- padding: 1em 0em 1em 0em; }
- .popup-menu .popup-menu-item {
- padding: .4em 1.75em;
- spacing: 1em;
- border: 1px solid transparent;
- border-left-width: 0;
- border-right-width: 0; }
- .popup-menu .popup-menu-item:active {
- color: #303030;
- border-color: rgba(48, 48, 48, 0.11);
- background-color: rgba(48, 48, 48, 0.08); }
- .popup-menu .popup-menu-item:insensitive {
- color: rgba(48, 48, 48, 0.5);
- background: none; }
- .popup-menu .popup-inactive-menu-item {
- color: #303030; }
- .popup-menu .popup-inactive-menu-item:insensitive {
- color: rgba(48, 48, 48, 0.55); }
- .popup-menu-icon {
- icon-size: 16px; }
-
-.popup-menu-boxpointer {
- -arrow-border-radius: 3px;
- -arrow-background-color: #e8e8e8;
- -arrow-border-width: 1px;
- -arrow-border-color: #b5b5b5;
- -arrow-base: 21px;
- -arrow-rise: 9px;
- -boxpointer-gap: 2px; }
-
/*Scale view context menu*/
.popup-combo-menu {
color: #303030;
- border: 1px solid #b5b5b5;
+ border: 1px solid #b5b5bd;
border-radius: 3px;
- background-color: #f4f4f4;
+ background-color: #d3d3d7;
box-shadow: none;
padding: 1em 0em 1em 0em; }
@@ -334,8 +290,8 @@ StScrollBar {
.popup-separator-menu-item {
-gradient-height: 1px;
- -gradient-start: #c2c2c2;
- -gradient-end: #c2c2c2;
+ -gradient-start: #c3c3c9;
+ -gradient-end: #c3c3c9;
-margin-horizontal: 0;
height: 1px; }
@@ -343,7 +299,15 @@ StScrollBar {
font-weight: normal; }
.popup-device-menu-item {
- spacing: .5em; }
+ spacing: .5em;
+ font-weight: bold;
+ color: #303030; }
+ .popup-device-menu-item:insensitive {
+ color: #303030;
+ spacing: 1em; }
+ .popup-device-menu-item .popup-inactive-menu-item {
+ font-weight: normal;
+ color: #303030; }
.popup-subtitle-menu-item {
font-weight: normal; }
@@ -453,21 +417,21 @@ StScrollBar {
.panel-top, .panel-bottom, .panel-left, .panel-right {
color: #ffffff;
border: none;
- background-color: rgba(232, 232, 232, 0.99);
+ background-color: rgba(243, 243, 244, 0.99);
font-size: 1em;
padding: 0px; }
.panel-top {
- box-shadow: 0 1px #b5b5b5; }
+ box-shadow: 0 1px #ebebed; }
.panel-bottom {
- box-shadow: 0 -1px #b5b5b5; }
+ box-shadow: 0 -1px #ebebed; }
.panel-left {
- box-shadow: 1px 0 #b5b5b5; }
+ box-shadow: 1px 0 #ebebed; }
.panel-right {
- box-shadow: -1px 0 #b5b5b5; }
+ box-shadow: -1px 0 #ebebed; }
.panel-dummy {
background-color: rgba(252, 65, 56, 0.5); }
@@ -500,8 +464,8 @@ StScrollBar {
spacing: 12px; }
.window-caption {
- background-color: #353535;
- border: 1px solid #353535;
+ background-color: #303030;
+ border: 1px solid #303030;
color: #c3c3c3;
spacing: 8px;
border-radius: 2px;
@@ -532,8 +496,8 @@ StScrollBar {
padding: 5px 8px;
-cinnamon-caption-spacing: 4px;
color: #c3c3c3;
- background-color: rgba(109, 109, 109, 0.4);
- border: 1px solid rgba(22, 22, 22, 0.4);
+ background-color: rgba(104, 104, 104, 0.4);
+ border: 1px solid rgba(17, 17, 17, 0.4);
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05); }
.expo-workspaces-name-entry:focus,
.expo-workspaces-name-entry#selected:focus {
@@ -555,7 +519,7 @@ StScrollBar {
border-radius: 2px; }
.expo-background {
- background-color: #353535; }
+ background-color: #303030; }
.workspace-thumbnails {
spacing: 26px; }
@@ -614,14 +578,16 @@ StScrollBar {
margin-right: .5em;
padding: .5em;
min-width: 350px;
- border: 1px solid #b5b5b5;
- background-color: #f4f4f4; }
+ border: 1px solid rgba(0, 0, 0, 0);
+ background-color: #d3d3d7;
+ border-radius: 6px; }
.calendar-events-no-events-button {
margin: 6px 0 6px 0;
padding: 6px; }
.calendar-events-no-events-button:hover {
- background-color: #35a854; }
+ background-color: #35a854;
+ border-radius: 6px; }
.calendar-events-no-events-button:hover .calendar-events-no-events-icon,
.calendar-events-no-events-button:hover .calendar-events-no-events-label {
color: #ffffff; }
@@ -642,7 +608,9 @@ StScrollBar {
padding: 0; }
.calendar-event-button {
- border: 1px solid rgba(0, 0, 0, 0); }
+ border: 1px solid rgba(0, 0, 0, 0);
+ border-radius-topright: 6px;
+ border-radius-bottomright: 6px; }
.calendar-event-button .calendar-event-time-past {
color: rgba(48, 48, 48, 0.4);
font-weight: bold;
@@ -678,7 +646,7 @@ StScrollBar {
color: #35a854; }
.calendar-event-button:hover {
background-color: #35a854;
- border: 1px solid #b5b5b5; }
+ border: 1px solid #b5b5bd; }
.calendar-event-button:hover .calendar-event-time-past,
.calendar-event-button:hover .calendar-event-time-present,
.calendar-event-button:hover .calendar-event-time-future,
@@ -696,7 +664,7 @@ StScrollBar {
font-weight: bold; }
.calendar-event-color-strip {
- width: 2px; }
+ width: 3px; }
.calendar-today-home-button {
padding: 6px; }
@@ -715,7 +683,8 @@ StScrollBar {
text-align: center; }
.calendar-today-home-button-enabled {
- padding: 6px; }
+ padding: 6px;
+ border-radius: 6px; }
.calendar-today-home-button-enabled:hover {
background-color: #35a854; }
.calendar-today-home-button-enabled:hover .calendar-today-day-label {
@@ -778,7 +747,8 @@ StScrollBar {
.calendar-day-base:hover {
font-weight: bold;
color: #ffffff;
- background-color: #35a854; }
+ background-color: #35a854;
+ border-radius: 6px; }
.calendar-day-heading {
color: rgba(48, 48, 48, 0.85);
@@ -803,12 +773,14 @@ StScrollBar {
.calendar-today {
color: #303030;
background-color: rgba(53, 168, 84, 0.4);
- border-width: 0; }
+ border-width: 0;
+ border-radius: 6px; }
.calendar-today:selected {
font-weight: bold; }
.calendar-not-today {
- color: #303030; }
+ color: #303030;
+ border-radius: 6px; }
.calendar-not-today:selected {
font-weight: bold;
background-color: rgba(48, 48, 48, 0.3); }
@@ -830,11 +802,11 @@ StScrollBar {
margin-top: 0.8em; }
#notification {
- box-shadow: 0 1px 15px 4px #b5b5b5;
+ box-shadow: 0 1px 15px 4px #b5b5bd;
border-top-color: #35a854;
border-top: 4px;
border-radius: 5px;
- background-color: #e8e8e8;
+ background-color: #ebebed;
padding: 13px;
spacing-rows: 10px;
spacing-columns: 10px;
@@ -878,9 +850,9 @@ StScrollBar {
.switcher-list {
color: #303030;
- border: 1px solid #b5b5b5;
- background-color: #e8e8e8;
- border-radius: 3px;
+ border: 1px solid #b5b5bd;
+ background-color: #f3f3f4;
+ border-radius: 6px;
padding: 20px; }
.switcher-list > StBoxLayout {
padding: 4px; }
@@ -888,13 +860,12 @@ StScrollBar {
spacing: 8px; }
.switcher-list .item-box {
padding: 8px;
- border-radius: 2px; }
+ border-radius: 6px; }
.switcher-list .item-box:outlined {
padding: 8px;
border: 1px solid #35a854; }
.switcher-list .item-box:selected {
- color: #ffffff;
- background-color: #35a854;
+ background-color: #c0c0c6;
border: 0px solid #35a854; }
.switcher-list .thumbnail {
width: 256px; }
@@ -934,194 +905,25 @@ StScrollBar {
.ripple-box:rtl {
background-image: url("common-assets/misc/corner-ripple.svg"); }
-.lightbox {
- background-color: rgba(0, 0, 0, 0.4); }
-
-.flashspot {
- background-color: white; }
-
-.modal-dialog {
- background-color: #e8e8e8;
- border: 1px solid #b5b5b5;
- border-radius: 3px;
- padding: 5px 10px; }
- .modal-dialog > StBoxLayout:first-child {
- padding: 10px; }
- .modal-dialog-button-box {
- spacing: 0;
- margin: 0px;
- padding: 10px;
- border: none;
- background-color: #e8e8e8; }
- .modal-dialog-button-box .modal-dialog-button {
- padding-top: 0;
- padding-bottom: 0;
- height: 30px; }
- .modal-dialog .confirm-dialog-title {
- text-align: center;
- font-weight: bold;
- font-size: 1.3em;
- padding-bottom: 12px; }
-
-.run-dialog {
- padding: 10px 15px 10px 15px;
- border: 1px solid #b5b5b5;
- border-radius: 3px;
- background-color: #e8e8e8; }
- .run-dialog > * {
- padding: 0; }
- .run-dialog-label {
- font-size: 1.3em;
- font-weight: bold;
- color: #303030;
- padding-bottom: 15px;
- text-align: center; }
- .run-dialog-description {
- color: #303030;
- padding-top: 15px;
- text-align: center; }
- .run-dialog-description.error {
- color: #FC4138; }
- .run-dialog-completion-box {
- padding-top: 5px;
- padding-left: 15px;
- font-size: 1em; }
- .run-dialog-entry {
- width: 21em;
- height: 1.2em;
- padding: 7px;
- border-radius: 3px;
- caret-color: #c3c3c3;
- selected-color: #ffffff;
- selection-background-color: #35a854;
- color: #c3c3c3;
- background-color: rgba(109, 109, 109, 0.4);
- border: 1px solid rgba(22, 22, 22, 0.4);
- box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05); }
- .run-dialog-entry:focus {
- color: #303030;
- background-color: #f4f4f4;
- border: 1px solid #35a854;
- box-shadow: inset 0 2px 4px rgba(244, 244, 244, 0.05); }
- .run-dialog .modal-dialog-button-box {
- border: none;
- box-shadow: none;
- background: none; }
-
-/* CinnamonMountOperation Dialogs */
-.cinnamon-mount-operation-icon {
- icon-size: 48px; }
-
-.mount-password-reask {
- color: #F27835; }
-
-.show-processes-dialog,
-.mount-question-dialog {
- spacing: 24px; }
- .show-processes-dialog-subject,
- .mount-question-dialog-subject {
- padding-top: 10px;
- padding-left: 17px;
- padding-bottom: 6px; }
- .show-processes-dialog-subject:rtl,
- .mount-question-dialog-subject:rtl {
- padding-left: 0px;
- padding-right: 17px; }
- .show-processes-dialog-description,
- .mount-question-dialog-description {
- padding-left: 17px;
- width: 28em; }
- .show-processes-dialog-description:rtl,
- .mount-question-dialog-description:rtl {
- padding-right: 17px; }
-
-.show-processes-dialog-app-list {
- max-height: 200px;
- padding-top: 24px;
- padding-left: 49px;
- padding-right: 32px; }
- .show-processes-dialog-app-list:rtl {
- padding-right: 49px;
- padding-left: 32px; }
- .show-processes-dialog-app-list-item {
- color: #ccc; }
- .show-processes-dialog-app-list-item:hover {
- color: white; }
- .show-processes-dialog-app-list-item:ltr {
- padding-right: 1em; }
- .show-processes-dialog-app-list-item:rtl {
- padding-left: 1em; }
- .show-processes-dialog-app-list-item-icon:ltr {
- padding-right: 17px; }
- .show-processes-dialog-app-list-item-icon:rtl {
- padding-left: 17px; }
- .show-processes-dialog-app-list-item-name {
- font-size: 1.1em; }
-
.magnifier-zoom-region {
border: 2px solid maroon; }
.magnifier-zoom-region .full-screen {
border-width: 0px; }
-#keyboard {
- background-color: #353535;
- border-width: 0;
- border-top-width: 1px;
- border-color: rgba(0, 0, 0, 0.4); }
-
-.keyboard-layout {
- spacing: 10px;
- padding: 10px; }
-
-.keyboard-row {
- spacing: 15px; }
-
-.keyboard-key {
- min-height: 2em;
- min-width: 2em;
- font-size: 1.4em;
- font-weight: bold;
- border-radius: 3px;
- box-shadow: none;
- color: #c3c3c3;
- border: 1px solid #b5b5b5;
- background-color: rgba(109, 109, 109, 0.4); }
- .keyboard-key:hover {
- color: #c3c3c3;
- border: 1px solid rgba(2, 2, 2, 0.4);
- background-color: rgba(127, 127, 127, 0.5); }
- .keyboard-key:active, .keyboard-key:checked {
- color: #ffffff;
- border: 1px solid #35a854;
- background-color: #35a854; }
- .keyboard-key:grayed {
- color: #606060;
- border: 1px solid rgba(2, 2, 2, 0.4);
- background-color: rgba(109, 109, 109, 0.25); }
-
-.keyboard-subkeys {
- color: #c3c3c3;
- padding: 5px;
- -arrow-border-radius: 2px;
- -arrow-background-color: #353535;
- -arrow-border-width: 1px;
- -arrow-border-color: rgba(0, 0, 0, 0.4);
- -arrow-base: 20px;
- -arrow-rise: 10px;
- -boxpointer-gap: 5px; }
-
.menu-favorites-box {
padding: 10px;
transition-duration: 300;
- background-color: #e7e7e7;
- border: 1px solid #b5b5b5; }
+ background-color: #d3d3d7;
+ border: 1px solid rgba(0, 0, 0, 0);
+ border-radius: 6px; }
.menu-favorites-button {
padding: .9em 1em;
border: 1px solid rgba(0, 0, 0, 0);
- border-radius: 2px; }
+ border-radius: 6px; }
.menu-favorites-button:hover {
- background-color: #c0c0c0; }
+ background-color: #b0b0b8;
+ border: 1px solid rgba(0, 0, 0, 0); }
.menu-places-box {
padding: 10px;
@@ -1144,8 +946,9 @@ StScrollBar {
.menu-application-button-selected {
padding: 7px;
color: #303030;
- background-color: #c0c0c0;
- border: 1px solid #b5b5b5; }
+ background-color: #d3d3d7;
+ border: 1px solid rgba(0, 0, 0, 0);
+ border-radius: 6px; }
.menu-application-button-selected:highlighted {
font-weight: bold; }
.menu-application-button-label:ltr {
@@ -1159,16 +962,19 @@ StScrollBar {
.menu-category-button-selected {
padding: 7px;
color: #303030;
- background-color: #c0c0c0;
- border: 1px solid #b5b5b5; }
- .menu-category-button:hover {
- background-color: #d8d8d8;
- border: 1px solid #d4d4d4;
- border-radius: 0px; }
+ background-color: #d3d3d7;
+ border: 1px solid rgba(0, 0, 0, 0);
+ border-radius: 6px; }
.menu-category-button-greyed {
padding: 7px;
color: rgba(48, 48, 48, 0.55);
border: 1px solid rgba(0, 0, 0, 0); }
+ .menu-category-button:hover {
+ padding: 7px;
+ color: #303030;
+ background-color: #d3d3d7;
+ border: 1px solid rgba(0, 0, 0, 0);
+ border-radius: 6px; }
.menu-category-button-label:ltr {
padding-left: 5px; }
.menu-category-button-label:rtl {
@@ -1199,48 +1005,125 @@ StScrollBar {
width: 250px;
min-height: 16px;
font-weight: normal;
- caret-color: #303030; }
+ caret-color: #303030;
+ border-radius: 6px; }
.menu-search-entry-icon {
icon-size: 1em;
color: #303030; }
/* Context menu (at the moment only for favorites) */
-.info-osd {
- text-align: center;
- font-weight: bold;
- spacing: 1em;
- padding: 16px;
- color: #303030;
- border: 1px solid #b5b5b5;
- border-radius: 5px;
- background-color: #e8e8e8; }
+.appmenu-category-button-greyed, .appmenu-category-button-selected, .appmenu-category-button, .appmenu-application-button-selected, .appmenu-application-button, .appmenu-sidebar-button {
+ padding: 7px;
+ spacing: 5px;
+ border-radius: 6px; }
-.restart-osd {
- font-size: 1.6em; }
+.appmenu-background .popup-menu-content {
+ padding: 0; }
-.workspace-osd {
- font-size: 4em; }
+.appmenu-main-box {
+ spacing: 10px; }
-.osd-window {
- text-align: center;
- font-weight: bold;
- spacing: 1em;
- padding: 20px;
- color: #303030;
- background-color: #e8e8e8;
- border: 1px solid #b5b5b5;
- border-radius: 5px; }
- .osd-window .osd-monitor-label {
- font-size: 3em; }
- .osd-window .level {
- padding: 0;
- height: 0.7em;
- background-color: rgba(0, 0, 0, 0.5);
- border-radius: 2px; }
- .osd-window .level-bar {
- border-radius: 2px;
- background-color: #35a854; }
+.appmenu-right-box {
+ spacing: 5px;
+ padding: 10px 10px; }
+
+.appmenu-categories-applications-box {
+ spacing: 15px; }
+ .appmenu-categories-applications-box:top {
+ padding-top: 5px; }
+
+.appmenu-applications-box {
+ padding-right: 5px; }
+
+.appmenu-search-box {
+ spacing: 10px; }
+
+.appmenu-sidebar {
+ padding: 15px 0px;
+ background-color: #d3d3d7;
+ border-radius: 6px 0 0 0;
+ border-right-width: 1px;
+ border-color: #b5b5bd;
+ spacing: 5px; }
+ .menu-top .appmenu-sidebar {
+ border-radius: 0 0 0 6px; }
+ .menu-bottom .appmenu-sidebar {
+ border-radius: 6px 0 0 0; }
+ .menu-left .appmenu-sidebar {
+ border-radius: 0; }
+ .menu-right .appmenu-sidebar {
+ border-radius: 0; }
+ .appmenu-sidebar .appmenu-system-button {
+ background-color: #eeeeef; }
+ .appmenu-sidebar .appmenu-system-button-lock:hover {
+ background-color: #fbfbfb; }
+ .appmenu-sidebar .appmenu-system-button-logout:hover {
+ background-color: #fbfbfb; }
+ .appmenu-sidebar .appmenu-system-button-shutdown {
+ color: white;
+ background-color: #F04A50; }
+ .appmenu-sidebar .appmenu-system-button-shutdown:hover {
+ color: white;
+ background-color: #f26267; }
+
+.appmenu-system-box {
+ spacing: 10px; }
+
+.appmenu-sidebar-button {
+ padding: 4px 7px;
+ margin: 0 10px; }
+ .appmenu-sidebar-button:hover {
+ background-color: #b0b0b8;
+ border-color: #b5b5bd; }
+
+.appmenu-system-button {
+ padding: 8.4px;
+ border: 1px solid #b5b5bd;
+ border-radius: 9999px;
+ background-color: #e0e0e3; }
+ .appmenu-system-button-shutdown {
+ color: white;
+ background-color: #F04A50; }
+ .appmenu-system-button-lock:hover {
+ background-color: #eeeeef; }
+ .appmenu-system-button-logout:hover {
+ background-color: #eeeeef; }
+ .appmenu-system-button-shutdown:hover {
+ color: white;
+ background-color: #f26267; }
+
+.appmenu-application-button-label {
+ padding: 0; }
+
+.appmenu-application-button-description {
+ color: #636363; }
+
+.appmenu-application-button:highlighted {
+ font-weight: bold; }
+
+.appmenu-application-button-selected {
+ background-color: #d3d3d7; }
+ .appmenu-application-button-selected:highlighted {
+ font-weight: bold; }
+
+.appmenu-category-button-label {
+ padding: 0; }
+
+.appmenu-category-button:hover {
+ background-color: #b0b0b8; }
+
+.appmenu-category-button-selected {
+ background-color: #d3d3d7; }
+
+.appmenu-category-button-greyed {
+ color: rgba(48, 48, 48, 0.55);
+ font-style: italic; }
+ .appmenu-category-button-greyed StIcon {
+ opacity: 0.5; }
+
+.appmenu-search-entry-icon {
+ icon-size: 1em; }
.window-list-box {
spacing: 6px;
@@ -1302,8 +1185,8 @@ StScrollBar {
.window-list-preview {
spacing: 6px;
color: #303030;
- border: 1px solid #b5b5b5;
- background-color: #e8e8e8;
+ border: 1px solid rgba(0, 0, 0, 0);
+ background-color: #ebebed;
border-radius: 3px;
padding: 6px 12px 12px 12px;
font-size: 1em; }
@@ -1324,8 +1207,6 @@ StScrollBar {
color: rgba(48, 48, 48, 0.8); }
.grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom {
border-bottom-width: 2px; }
- .grouped-window-list-item-box.top StLabel, .grouped-window-list-item-box.bottom StLabel {
- padding-left: 2px; }
.grouped-window-list-item-box.right {
padding-left: 0px;
padding-right: 0px;
@@ -1340,7 +1221,7 @@ StScrollBar {
padding-left: 1px; }
.grouped-window-list-item-box:hover, .grouped-window-list-item-box:focus {
color: #303030;
- background-color: rgba(48, 48, 48, 0.3); }
+ background-color: #d3d3d7; }
.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked {
color: #303030;
border-color: #35a854; }
@@ -1356,15 +1237,17 @@ StScrollBar {
padding-left: 4px; }
.grouped-window-list-number-label {
- font-size: 0.8em;
- z-index: 99;
+ font-size: 12px;
color: #ffffff; }
.grouped-window-list-badge {
- border-radius: 9999px;
+ border-radius: 99px;
background-color: #35a854;
margin: 0; }
+.grouped-window-list-notifications-badge-label {
+ font-size: 12px; }
+
.grouped-window-list-button-label {
padding-left: 4px; }
@@ -1373,8 +1256,8 @@ StScrollBar {
.grouped-window-list-thumbnail-menu {
color: #303030;
- border: 1px solid #b5b5b5;
- background-color: #e8e8e8;
+ border: 1px solid rgba(0, 0, 0, 0);
+ background-color: #ebebed;
border-radius: 3px;
padding: 0px; }
.grouped-window-list-thumbnail-menu > StBoxLayout {
@@ -1452,9 +1335,9 @@ StScrollBar {
icon-size: 12px; }
.sound-player > StBoxLayout:first-child StButton:small:hover {
color: #303030;
- background-color: #fafafa;
- border: 1px solid #b5b5b5;
- box-shadow: inset 0 2px 4px rgba(250, 250, 250, 0.05); }
+ background-color: #bdbdc4;
+ border: 1px solid #b5b5bd;
+ box-shadow: inset 0 2px 4px rgba(189, 189, 196, 0.05); }
.sound-player > StBoxLayout:first-child StButton:small:active {
color: #ffffff;
background-color: #35a854;
@@ -1468,8 +1351,8 @@ StScrollBar {
width: 290px;
padding: 15px;
spacing: 0.5em;
- background: rgba(232, 232, 232, 0.9);
- border-top: 1px solid #b5b5b5;
+ background: rgba(235, 235, 237, 0.9);
+ border-top: 1px solid #b5b5bd;
color: #303030; }
.sound-player-overlay StButton {
width: 22px;
@@ -1482,9 +1365,9 @@ StScrollBar {
icon-size: 16px; }
.sound-player-overlay StButton:hover {
color: #303030;
- background-color: #fafafa;
- border: 1px solid #b5b5b5;
- box-shadow: inset 0 2px 4px rgba(250, 250, 250, 0.05); }
+ background-color: #bdbdc4;
+ border: 1px solid #b5b5bd;
+ box-shadow: inset 0 2px 4px rgba(189, 189, 196, 0.05); }
.sound-player-overlay StButton:active {
color: #ffffff;
background-color: #35a854;
@@ -1507,65 +1390,45 @@ StScrollBar {
-slider-border-width: 0px;
-slider-handle-radius: 0px; }
-#workspaceSwitcher {
- spacing: 0px;
- padding: 3px; }
-
-/* Controls the styling when using the "Simple buttons" option */
-.workspace-switcher {
- padding-left: 3px;
- padding-right: 3px; }
- .panel-left .workspace-switcher, .panel-right .workspace-switcher {
- padding: 0; }
+.panel-top .workspace-switcher,
+.panel-bottom .workspace-switcher {
+ padding: 0 4px; }
.workspace-button {
- border: 1px solid rgba(0, 0, 0, 0.4);
- background-color: rgba(0, 0, 0, 0.2);
- width: 20px;
- height: 14px;
- color: rgba(255, 255, 255, 0.45);
- padding: 3px;
- padding-top: 4px;
- transition-duration: 200; }
+ border: 1px solid #b5b5bd;
+ width: 2em;
+ color: rgba(48, 48, 48, 0.55);
+ background-color: rgba(48, 48, 48, 0.05); }
.workspace-button.vertical {
- height: 1.5em;
- width: 24px;
- padding: 0;
- padding-top: 3px;
- padding-bottom: 3px; }
+ height: 2em; }
.workspace-button:outlined {
- background-color: #35a854;
- color: #ffffff; }
+ background-color: #d3d3d7;
+ color: #303030; }
.workspace-button:outlined:hover {
- background-color: rgba(53, 168, 84, 0.7);
- color: #ffffff; }
+ background-color: #b0b0b8; }
.workspace-button:hover {
- background-color: rgba(48, 48, 48, 0.2);
- color: #ffffff; }
+ background-color: #d3d3d7; }
+ .workspace-button:shaded {
+ background-color: #dedee1; }
-/* Controls the style when using the "Visual representation" option */
.workspace-graph {
- padding: 3px;
- spacing: 6px; }
-
-.workspace-graph .workspace {
- border: 1px solid rgba(0, 0, 0, 0.4);
- background-color: rgba(0, 0, 0, 0.2); }
-
-.workspace-graph .workspace:active {
- border: 1px solid #35a854; }
-
-.workspace-graph .workspace .windows {
- -active-window-background: white;
- -active-window-border: rgba(0, 0, 0, 0.8);
- -inactive-window-background: white;
- -inactive-window-border: rgba(0, 0, 0, 0.8); }
-
-.workspace-graph .workspace:active .windows {
- -active-window-background: white;
- -active-window-border: rgba(0, 0, 0, 0.8);
- -inactive-window-background: whitesmoke;
- -inactive-window-border: rgba(0, 0, 0, 0.8); }
+ padding: 4px;
+ spacing: 4px; }
+ .workspace-graph .workspace {
+ border: 1px solid rgba(48, 48, 48, 0.2);
+ background-color: #ebebed; }
+ .workspace-graph .workspace:active {
+ border-color: #35a854; }
+ .workspace-graph .workspace:active .windows {
+ -active-window-background: rgba(0, 0, 0, 0.3);
+ -active-window-border: rgba(0, 0, 0, 0.35);
+ -inactive-window-background: rgba(0, 0, 0, 0.1);
+ -inactive-window-border: rgba(0, 0, 0, 0.15); }
+ .workspace-graph .workspace .windows {
+ -active-window-background: rgba(0, 0, 0, 0.3);
+ -active-window-border: rgba(0, 0, 0, 0.35);
+ -inactive-window-background: rgba(0, 0, 0, 0.1);
+ -inactive-window-border: rgba(0, 0, 0, 0.15); }
.panel-launchers {
padding-left: 7px;
@@ -1576,7 +1439,7 @@ StScrollBar {
padding-bottom: 2px;
transition-duration: 200; }
.panel-launchers .launcher:hover {
- background-color: #c0c0c0; }
+ background-color: #d3d3d7; }
.panel-launchers.vertical {
padding-top: 2px;
padding-bottom: 2px;
@@ -1599,27 +1462,23 @@ StScrollBar {
.applet-separator-line {
width: 1px;
- background: #c2c2c2; }
+ background: #b5b5bd; }
.applet-separator-line-vertical {
height: 1px;
- background: #c2c2c2; }
+ background: #b5b5bd; }
.applet-box {
- padding-left: 4px;
- padding-right: 4px;
- spacing: 4px;
+ padding: 0 5px;
+ spacing: 5px;
color: #303030;
text-shadow: none;
transition-duration: 100;
text-align: center; }
.applet-box.vertical {
- padding-left: 0px;
- padding-right: 0px;
- padding-top: 3px;
- padding-bottom: 3px; }
+ padding: 5px 0; }
.applet-box:hover, .applet-box:checked {
color: #303030;
- background-color: #c0c0c0; }
+ background-color: #d3d3d7; }
.applet-box:highlight {
background-image: none;
border-image: none;
@@ -1640,11 +1499,21 @@ StScrollBar {
text-shadow: none; }
.user-icon {
- width: 32px;
- height: 32px;
- background-color: transparent;
- border: none;
- border-radius: 0; }
+ background-size: contain;
+ border-radius: 99px;
+ color: #303030;
+ border-color: transparent; }
+ .user-icon StIcon {
+ border: 1px solid transparent;
+ border-radius: 99px;
+ padding: 14px; }
+ .user-icon StIcon.highlighted {
+ border: 1px solid #303030;
+ border-radius: 99px;
+ padding: 14px; }
+ .user-icon.user-avatar {
+ border: 1px solid transparent;
+ border-radius: 99px; }
.user-label {
color: #303030;
@@ -1652,34 +1521,46 @@ StScrollBar {
font-weight: bold;
margin: 0px; }
+.user-widget.horizontal {
+ spacing: 7px; }
+
+.user-widget.vertical {
+ spacing: 10px; }
+
+.user-widget.vertical .user-widget-label {
+ color: #303030;
+ text-align: center; }
+
.applet-cornerbar {
width: 8px;
- background-color: #c2c2c2; }
- .applet-cornerbar-box {
- padding: 4px 4px; }
- .applet-cornerbar-box:hover > .applet-cornerbar {
- background-color: #a8a8a8; }
+ background-color: #b5b5bd;
+ border: 1px solid #b5b5bd; }
.applet-cornerbar.vertical {
height: 8px; }
+ .applet-cornerbar-box {
+ background: none; }
+
+.applet-cornerbar-box:hover > .applet-cornerbar {
+ background-color: #9a9aa5; }
.desklet {
color: #303030; }
.desklet:highlight {
background-color: rgba(252, 65, 56, 0.5); }
.desklet-with-borders {
- border: 1px solid #b5b5b5;
+ border: 1px solid #b5b5bd;
border-radius: 5px;
- background-color: #e8e8e8;
+ background-color: #ebebed;
color: #303030;
padding: 12px;
padding-bottom: 16px; }
.desklet-with-borders:highlight {
background-color: rgba(252, 65, 56, 0.5); }
.desklet-with-borders-and-header {
- border: 1px solid #b5b5b5;
+ border: 1px solid #b5b5bd;
border-top-width: 0;
border-radius: 0 0 5px 5px;
- background-color: #e8e8e8;
+ background-color: #ebebed;
color: #303030;
border-radius: 0;
border-radius-topleft: 0;
@@ -1689,9 +1570,9 @@ StScrollBar {
.desklet-with-borders-and-header:highlight {
background-color: rgba(252, 65, 56, 0.5); }
.desklet-header {
- border: 1px solid #b5b5b5;
+ border: 1px solid #b5b5bd;
border-radius: 5px 5px 0 0;
- background-color: #e0e0e0;
+ background-color: #e3e3e6;
color: #303030;
font-size: 1em;
padding: 12px;
@@ -1701,9 +1582,9 @@ StScrollBar {
background-color: rgba(53, 168, 84, 0.3); }
.photoframe-box {
- border: 1px solid #b5b5b5;
+ border: 1px solid #b5b5bd;
border-radius: 5px;
- background-color: #e8e8e8;
+ background-color: #ebebed;
color: #303030;
padding: 12px;
padding-bottom: 16px; }
@@ -1751,3 +1632,486 @@ StScrollBar {
border: 0px;
background-color: rgba(0, 0, 0, 0);
border-radius: 0px; }
+
+.prompt-dialog-error-label, .prompt-dialog-info-label, .prompt-dialog-null-label, .run-dialog-description, .message-dialog-content .message-dialog-caption, .dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-description, .appmenu-application-button-description {
+ font-weight: 400;
+ font-size: 0.818em; }
+
+.message-dialog-content .message-dialog-title, .dialog .confirm-dialog-title {
+ font-weight: 800;
+ font-size: 1.364em; }
+
+.workspace-switch-osd, .media-keys-osd, .message-dialog-content .message-dialog-title.lightweight, .user-widget.vertical .user-widget-label {
+ font-weight: 700;
+ font-size: 1.182em; }
+
+.polkit-dialog-user-combo, .dialog-list .dialog-list-title {
+ font-weight: 700;
+ font-size: 1em; }
+
+.audio-device-selection-dialog .audio-selection-box .audio-selection-device, .polkit-dialog-user-combo {
+ border: 1px solid #ebebed;
+ color: #303030;
+ background-color: #ebebed; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device:focus, .polkit-dialog-user-combo:focus {
+ border: 1px solid #ebebed;
+ color: #303030;
+ background-color: #ebebed;
+ border: 1px solid #9a9aa5; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device:hover, .polkit-dialog-user-combo:hover {
+ border: 1px solid #ebebed;
+ color: #303030;
+ background-color: #d0d0d5; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device:insensitive, .polkit-dialog-user-combo:insensitive {
+ border: 1px solid #ebebed;
+ color: rgba(48, 48, 48, 0.5);
+ background-color: #ebebed; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device:selected, .polkit-dialog-user-combo:selected, .audio-device-selection-dialog .audio-selection-box .audio-selection-device:active, .polkit-dialog-user-combo:active {
+ border: 1px solid #ebebed;
+ color: #303030;
+ background-color: #dedee1; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device:checked, .polkit-dialog-user-combo:checked {
+ border: 1px solid #ebebed;
+ color: #303030;
+ background-color: #dedee1; }
+
+.dialog .dialog-button, .dialog .dialog-button:destructive-action, .dialog .dialog-button:default {
+ font-weight: bold;
+ padding: 12px;
+ border-radius: 18px;
+ border: 1px solid #b0b0b8;
+ color: #303030;
+ background-color: #b0b0b8; }
+ .dialog .dialog-button:focus {
+ border: 1px solid #b0b0b8;
+ color: #303030;
+ background-color: #b0b0b8;
+ border: 1px solid #62626d; }
+ .dialog .dialog-button:hover {
+ border: 1px solid #b0b0b8;
+ color: #303030;
+ background-color: #9595a0; }
+ .dialog .dialog-button:active {
+ border: 1px solid #b0b0b8;
+ color: #303030;
+ background-color: #a3a3ac; }
+ .dialog .dialog-button:checked {
+ border: 1px solid #b0b0b8;
+ color: #303030;
+ background-color: #a3a3ac; }
+ .dialog .dialog-button:insensitive {
+ border: 1px solid #b0b0b8;
+ color: rgba(48, 48, 48, 0.5);
+ background-color: #b8b8bf; }
+
+.dialog .dialog-button:default {
+ border: 1px solid #35a854;
+ color: #303030;
+ background-color: #35a854; }
+ .dialog .dialog-button:focus:default {
+ border: 1px solid #35a854;
+ color: #303030;
+ background-color: #35a854;
+ border: 1px solid #10341a; }
+ .dialog .dialog-button:hover:default {
+ border: 1px solid #35a854;
+ color: #303030;
+ background-color: #298141; }
+ .dialog .dialog-button:active:default {
+ border: 1px solid #35a854;
+ color: #303030;
+ background-color: #2f954a; }
+ .dialog .dialog-button:checked:default {
+ border: 1px solid #35a854;
+ color: #303030;
+ background-color: #2f954a; }
+ .dialog .dialog-button:insensitive:default {
+ border-color: #b5b5bd;
+ border: 1px solid #b0b0b8;
+ color: rgba(48, 48, 48, 0.5);
+ background-color: #b8b8bf; }
+
+.dialog .dialog-button:destructive-action {
+ border: 1px solid #F04A50;
+ color: #303030;
+ background-color: #F04A50; }
+ .dialog .dialog-button:focus:destructive-action {
+ border: 1px solid #F04A50;
+ color: #303030;
+ background-color: #F04A50;
+ border: 1px solid #950c11; }
+ .dialog .dialog-button:hover:destructive-action {
+ border: 1px solid #F04A50;
+ color: #303030;
+ background-color: #ec1b22; }
+ .dialog .dialog-button:active:destructive-action {
+ border: 1px solid #F04A50;
+ color: #303030;
+ background-color: #ee3239; }
+ .dialog .dialog-button:checked:destructive-action {
+ border: 1px solid #F04A50;
+ color: #303030;
+ background-color: #ee3239; }
+ .dialog .dialog-button:insensitive:destructive-action {
+ border-color: #b5b5bd;
+ border: 1px solid #b0b0b8;
+ color: rgba(48, 48, 48, 0.5);
+ background-color: #b8b8bf; }
+
+.dialog {
+ background-color: #ebebed;
+ border-radius: 18px;
+ border: 1px solid #b5b5bd;
+ padding: 18px; }
+ .dialog .dialog-content-box {
+ margin-top: 8px;
+ margin-bottom: 16px;
+ spacing: 32px;
+ max-width: 28em; }
+ .dialog .confirm-dialog-title {
+ text-align: center; }
+
+.dialog-list {
+ spacing: 18px; }
+ .dialog-list .dialog-list-title {
+ text-align: center; }
+ .dialog-list .dialog-list-scrollview {
+ max-height: 200px; }
+ .dialog-list .dialog-list-box {
+ spacing: 1em; }
+ .dialog-list .dialog-list-box .dialog-list-item {
+ spacing: 1em; }
+ .dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-title {
+ font-weight: bold; }
+ .dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-description {
+ color: #232323; }
+
+.end-session-dialog {
+ min-width: 40em; }
+ .end-session-dialog .dialog-content-box {
+ spacing: 0; }
+ .end-session-dialog .dialog-list {
+ spacing: 0; }
+ .end-session-dialog .dialog-list .dialog-list-title {
+ color: #F27835;
+ background-color: tranparentize(#F27835, 0.9);
+ padding: 9px;
+ border-radius: 20px;
+ margin: 4px 0; }
+
+.message-dialog-content {
+ spacing: 18px; }
+ .message-dialog-content .message-dialog-title {
+ text-align: center; }
+ .message-dialog-content .message-dialog-description {
+ text-align: center; }
+ .message-dialog-content .message-dialog-caption {
+ text-align: center; }
+
+.run-dialog .dialog-content-box {
+ margin: 4px; }
+
+.run-dialog-description {
+ text-align: center;
+ color: black; }
+ .run-dialog-description.error {
+ color: #FC4138; }
+
+.run-dialog-completion-box {
+ padding-top: 6px;
+ padding-left: 12px; }
+
+.run-dialog-entry {
+ width: 20em;
+ height: 1.2em; }
+
+.prompt-dialog {
+ width: 28em; }
+ .prompt-dialog .dialog-content-box {
+ spacing: 16px;
+ margin-bottom: 12px; }
+ .prompt-dialog-password-entry {
+ width: 20em; }
+ .prompt-dialog-password-layout {
+ spacing: 8px; }
+ .prompt-dialog-error-label, .prompt-dialog-info-label, .prompt-dialog-null-label {
+ text-align: center; }
+ .prompt-dialog-error-label {
+ color: #FC4138; }
+
+.polkit-dialog-user-layout {
+ text-align: center;
+ spacing: 2px; }
+
+.polkit-dialog-user-combo {
+ border-radius: 6px;
+ padding: 6px 36px; }
+ .polkit-dialog-user-combo:insensitive {
+ color: #303030; }
+
+.audio-device-selection-dialog {
+ min-width: 24em; }
+ .audio-device-selection-dialog .audio-selection-box {
+ spacing: 12px; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device {
+ border-radius: 20px; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device .audio-selection-device-box {
+ padding: 12px;
+ spacing: 12px; }
+ .audio-device-selection-dialog .audio-selection-box .audio-selection-device .audio-selection-device-icon {
+ icon-size: 64px; }
+
+.workspace-switch-osd, .info-osd, .media-keys-osd {
+ background-color: #ebebed;
+ border: 1px solid #b5b5bd;
+ border-radius: 20px;
+ text-align: center;
+ padding: 24px; }
+
+.media-keys-osd {
+ margin-bottom: 1em;
+ border-radius: 20px;
+ font-weight: bold;
+ spacing: 12px;
+ padding: 12px 24px; }
+ .media-keys-osd > * {
+ spacing: 12px; }
+ .media-keys-osd StIcon {
+ icon-size: 32px; }
+ .media-keys-osd StLabel:ltr {
+ margin-right: 6px; }
+ .media-keys-osd StLabel:rtl {
+ margin-left: 6px; }
+ .media-keys-osd .level {
+ min-width: 160px;
+ -barlevel-height: 6px;
+ -barlevel-background-color: #d3d3d7;
+ -barlevel-active-background-color: #303030;
+ -barlevel-amplify-color: #F27835;
+ -barlevel-amplify-separator-width: 3px; }
+ .media-keys-osd .level:ltr {
+ margin-right: 6px; }
+ .media-keys-osd .level:rtl {
+ margin-left: 6px; }
+ .media-keys-osd .level-bar {
+ border-radius: 20px;
+ background-color: #303030; }
+
+.info-osd {
+ font-size: 1.2em;
+ font-weight: 700;
+ text-align: center; }
+
+.workspace-switch-osd {
+ min-width: 140px;
+ margin-bottom: 1em;
+ border-radius: 20px;
+ font-weight: bold;
+ padding: 12px 36px 0 36px; }
+ .workspace-switch-osd-indicator-box {
+ spacing: 12px; }
+ .workspace-switch-osd-indicator {
+ background-color: rgba(48, 48, 48, 0.5);
+ padding: 3px;
+ margin: 15px;
+ border-radius: 36px; }
+ .workspace-switch-osd-indicator:active {
+ background-color: #35a854;
+ padding: 6px;
+ margin: 12px; }
+
+.monitor-label {
+ border-radius: 0;
+ color: black;
+ padding: 12px;
+ text-align: center; }
+
+.resize-popup {
+ color: #303030;
+ background-color: #ebebed;
+ border-radius: 6px;
+ padding: 12px; }
+
+/*
+On-Screen Keyboard (>= Cinnamon 6.6)
+*/
+#virtual-keyboard {
+ background-color: #f3f3f4;
+ box-shadow: inset 0 1px 0 0 #b5b5bd; }
+
+.vkeyboard-key-container {
+ padding: 4px;
+ spacing: 4px; }
+
+.vkeyboard-key {
+ color: #303030;
+ background-color: #b0b0b8;
+ border: 1px solid #b5b5bd;
+ box-shadow: inset 0 2px 4px rgba(176, 176, 184, 0.05);
+ font-size: 1.364em;
+ border-width: 1px;
+ border-style: solid;
+ border-radius: 6px;
+ background-color: #d3d3d7; }
+ .vkeyboard-key:focus {
+ color: #303030;
+ background-color: #b0b0b8;
+ border: 1px solid #35a854;
+ box-shadow: inset 0 2px 4px rgba(176, 176, 184, 0.05); }
+ .vkeyboard-key:hover, .vkeyboard-key:checked {
+ color: #303030;
+ background-color: #bdbdc4;
+ border: 1px solid #b5b5bd;
+ box-shadow: inset 0 2px 4px rgba(189, 189, 196, 0.05); }
+ .vkeyboard-key:active {
+ color: #ffffff;
+ background-color: #35a854;
+ border: 1px solid #35a854;
+ box-shadow: inset 0 2px 4px #35a854; }
+ .vkeyboard-key.shift-key-uppercase {
+ background-color: #9a9aa5; }
+ .vkeyboard-key.enter-key {
+ border-color: #35a854;
+ background-color: #c0c0c6;
+ border-width: 3px; }
+ .vkeyboard-key.shift-key-lowercase, .vkeyboard-key.escape-key, .vkeyboard-key.hide-key, .vkeyboard-key.non-alpha-key {
+ background-color: #c0c0c6; }
+ .vkeyboard-key.shift-key-lowercase:focus, .vkeyboard-key.escape-key:focus, .vkeyboard-key.hide-key:focus, .vkeyboard-key.non-alpha-key:focus {
+ color: #303030;
+ background-color: #b0b0b8;
+ border: 1px solid #35a854;
+ box-shadow: inset 0 2px 4px rgba(176, 176, 184, 0.05); }
+ .vkeyboard-key.shift-key-lowercase:hover, .vkeyboard-key.shift-key-lowercase:checked, .vkeyboard-key.escape-key:hover, .vkeyboard-key.escape-key:checked, .vkeyboard-key.hide-key:hover, .vkeyboard-key.hide-key:checked, .vkeyboard-key.non-alpha-key:hover, .vkeyboard-key.non-alpha-key:checked {
+ color: #303030;
+ background-color: #bdbdc4;
+ border: 1px solid #b5b5bd;
+ box-shadow: inset 0 2px 4px rgba(189, 189, 196, 0.05); }
+ .vkeyboard-key.shift-key-lowercase:active, .vkeyboard-key.escape-key:active, .vkeyboard-key.hide-key:active, .vkeyboard-key.non-alpha-key:active {
+ color: #ffffff;
+ background-color: #35a854;
+ border: 1px solid #35a854;
+ box-shadow: inset 0 2px 4px #35a854; }
+ .vkeyboard-key.modifier-key {
+ background-color: #c0c0c6; }
+ .vkeyboard-key.modifier-key:hover, .vkeyboard-key.modifier-key:checked {
+ color: #303030;
+ background-color: #bdbdc4;
+ border: 1px solid #b5b5bd;
+ box-shadow: inset 0 2px 4px rgba(189, 189, 196, 0.05); }
+ .vkeyboard-key.modifier-key:latched {
+ background-color: #9a9aa5; }
+ .vkeyboard-key StIcon {
+ icon-size: 1.125em; }
+
+.vkeyboard-subkeys {
+ color: #303030;
+ -arrow-border-radius: 8px;
+ -arrow-background-color: #ebebed;
+ -arrow-border-width: 1px;
+ -arrow-border-color: white;
+ -arrow-base: 20px;
+ -arrow-rise: 10px;
+ -boxpointer-gap: 6px; }
+
+.word-suggestions {
+ font-size: 1.227em;
+ spacing: 20px;
+ min-height: 20pt; }
+
+.candidate-popup-boxpointer {
+ -arrow-border-radius: 8px;
+ -arrow-background-color: #ebebed;
+ -arrow-border-width: 1px;
+ -arrow-border-color: #b5b5bd;
+ -arrow-base: 12px;
+ -arrow-rise: 6px;
+ -arrow-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5); }
+
+.candidate-popup-content {
+ padding: 0.5em;
+ spacing: 0.3em; }
+
+.candidate-index {
+ padding: 0 0.5em 0 0;
+ color: #171717; }
+
+.candidate-box {
+ padding: 0.3em 0.5em 0.3em 0.5em;
+ border-radius: 6px;
+ color: #303030; }
+ .candidate-box:selected, .candidate-box:hover {
+ background-color: #c0c0c6; }
+
+.candidate-page-button-box {
+ height: 2em; }
+ .vertical .candidate-page-button-box {
+ padding-top: 0.5em; }
+ .horizontal .candidate-page-button-box {
+ padding-left: 0.5em; }
+
+.candidate-page-button {
+ padding: 4px; }
+
+.candidate-page-button-previous {
+ border-radius: 6px 0px 0px 6px;
+ border-right-width: 0; }
+
+.candidate-page-button-next {
+ border-radius: 0px 6px 6px 0px; }
+
+.candidate-page-button-icon {
+ icon-size: 1em; }
+
+/*
+****** DEPRECATED
+
+On-Screen Keyboard (<= Cinnamon 6.4)
+*/
+#keyboard {
+ background-color: #303030;
+ border-width: 0;
+ border-top-width: 1px;
+ border-color: rgba(0, 0, 0, 0.4); }
+
+.keyboard-layout {
+ spacing: 10px;
+ padding: 10px; }
+
+.keyboard-row {
+ spacing: 15px; }
+
+.keyboard-key {
+ min-height: 2em;
+ min-width: 2em;
+ font-size: 1.4em;
+ font-weight: bold;
+ border-radius: 3px;
+ box-shadow: none;
+ color: #c3c3c3;
+ border: 1px solid #b5b5bd;
+ background-color: rgba(104, 104, 104, 0.4); }
+ .keyboard-key:hover {
+ color: #c3c3c3;
+ border: 1px solid rgba(0, 0, 0, 0.4);
+ background-color: rgba(122, 122, 122, 0.5); }
+ .keyboard-key:active, .keyboard-key:checked {
+ color: #ffffff;
+ border: 1px solid #35a854;
+ background-color: #35a854; }
+ .keyboard-key:grayed {
+ color: #5c5c5c;
+ border: 1px solid rgba(0, 0, 0, 0.4);
+ background-color: rgba(104, 104, 104, 0.25); }
+
+.keyboard-subkeys {
+ color: #c3c3c3;
+ padding: 5px;
+ -arrow-border-radius: 2px;
+ -arrow-background-color: #303030;
+ -arrow-border-width: 1px;
+ -arrow-border-color: rgba(0, 0, 0, 0.4);
+ -arrow-base: 20px;
+ -arrow-rise: 10px;
+ -boxpointer-gap: 5px; }
+
+/* ****** DEPRECATED */
diff --git a/cinnamon-shell/upstream/dark-assets/switch/switch-off.svg b/cinnamon-shell/upstream/dark-assets/switch/switch-off.svg
index 5d6df1f17f..a9af96776f 100644
--- a/cinnamon-shell/upstream/dark-assets/switch/switch-off.svg
+++ b/cinnamon-shell/upstream/dark-assets/switch/switch-off.svg
@@ -183,7 +183,7 @@
ry="11"
rx="11" />
+ style="color:#bebebe;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:'Andale Mono';-inkscape-font-specification:'Andale Mono';text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;text-anchor:start;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#222222;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.78124988;marker:none;enable-background:new" />
diff --git a/cinnamon-shell/upstream/dark-assets/switch/switch-on.svg b/cinnamon-shell/upstream/dark-assets/switch/switch-on.svg
index a6197cccc5..f330f4dfd5 100644
--- a/cinnamon-shell/upstream/dark-assets/switch/switch-on.svg
+++ b/cinnamon-shell/upstream/dark-assets/switch/switch-on.svg
@@ -184,7 +184,7 @@
ry="11"
rx="11" />
+ style="display:inline;opacity:1;fill:#222222;fill-opacity:1;stroke:none" />
+ style="display:inline;opacity:1;fill:#222222;fill-opacity:1;stroke:none" />
diff --git a/cinnamon-shell/upstream/mint-y-dark-thumbnail.png b/cinnamon-shell/upstream/mint-y-dark-thumbnail.png
index cf25ac4979..a4f1398888 100644
Binary files a/cinnamon-shell/upstream/mint-y-dark-thumbnail.png and b/cinnamon-shell/upstream/mint-y-dark-thumbnail.png differ
diff --git a/cinnamon-shell/upstream/mint-y-thumbnail.png b/cinnamon-shell/upstream/mint-y-thumbnail.png
index 208cd2c126..7699c00aaa 100644
Binary files a/cinnamon-shell/upstream/mint-y-thumbnail.png and b/cinnamon-shell/upstream/mint-y-thumbnail.png differ
diff --git a/cinnamon-shell/upstream/parse-sass.sh b/cinnamon-shell/upstream/parse-sass.sh
index b4483da1e8..95e64e7513 100755
--- a/cinnamon-shell/upstream/parse-sass.sh
+++ b/cinnamon-shell/upstream/parse-sass.sh
@@ -1,4 +1,4 @@
#! /bin/bash
-sassc ./sass/cinnamon.scss cinnamon.css
-sassc ./sass/cinnamon-dark.scss cinnamon-dark.css
\ No newline at end of file
+pysassc ./sass/cinnamon.scss cinnamon.css
+pysassc ./sass/cinnamon-dark.scss cinnamon-dark.css
diff --git a/cinnamon-shell/upstream/sass/_colors.scss b/cinnamon-shell/upstream/sass/_colors.scss
index 3d041e1b53..bb89d85a03 100644
--- a/cinnamon-shell/upstream/sass/_colors.scss
+++ b/cinnamon-shell/upstream/sass/_colors.scss
@@ -1,36 +1,88 @@
-// When color definition differs for dark and light variant,
-// it gets @if ed depending on $variant
-
-// We need to set this first because we use it to tint many
-// of the remaining colors
-$selected_bg_color: if($variant == 'light', #35a854, #35a854);
-
-$base_color: if($variant =='light', mix($selected_bg_color, #f4f4f4, 0%), mix($selected_bg_color, #404040, 0%));
-$text_color: if($variant == 'light', #303030, #D3D3D3);
-$bg_color: if($variant == 'light', mix($selected_bg_color, #e8e8e8, 0%), mix($selected_bg_color, #2f2f2f, 0%));
-$fg_color: if($variant =='light', #303030, transparentize(white, 0.13));
+$accent_color: #35a854;
+$panel_bg: null;
+$panel_fg: null;
+$bg_color: null;
+$bg_color2: null;
+$bg_color3: null;
+$bg_color4: null;
+$panel_active_bg: null;
+$borders_color: null;
+$separator_color: null;
+$text_color: null;
+$fg_color: null;
+$noaccent_selected_fg_color: null;
+$dim_color: null;
+$link_color: null;
+$osd_destructive_color: null;
+$insensitive_fg_color: null;
+$entry_border: null;
+$button_bg: null;
+$corner_bar_highlighted: null;
+
+@if $variant == 'light' {
+ // Light Variant Colors
+ $bg_color: #ebebed;
+ $bg_color2: darken($bg_color, 9%);
+ $bg_color3: darken($bg_color, 22%);
+ $bg_color4: darken($bg_color, 16%);
+ $panel_bg: lighten($bg_color, 3%);
+ $panel_active_bg: $bg_color2;
+ $borders_color: darken($bg_color, 20%);
+ $separator_color: darken($bg_color, 15%);
+ $text_color: #303030;
+ $panel_fg: #303030;
+ $fg_color: #303030;
+ $noaccent_selected_fg_color: $text_color;
+ $dim_color: lighten($text_color, 20%);
+ $link_color: darken($accent_color,10%);
+ $osd_destructive_color: #F04A50;
+ $insensitive_fg_color: transparentize($fg_color, 0.45);
+ $entry_border: #cfd6e6;
+ $button_bg: $bg_color3;
+ $corner_bar_highlighted: darken($borders_color, 10%);
+} @else {
+ // Dark Variant Colors
+ $bg_color: #222226;
+ $bg_color2: lighten($bg_color, 6%);
+ $bg_color3: lighten($bg_color, 14%);
+ $bg_color4: lighten($bg_color, 9%);
+ $panel_bg: darken($bg_color, 2%);
+ $panel_active_bg: mix($bg_color3, $accent_color, 80%);
+ $borders_color: $bg_color2;
+ $separator_color: lighten($bg_color, 2%);
+ $panel_fg: #e1e1e1;
+ $text_color: #D3D3D3;
+ $fg_color: #e1e1e1;
+ $noaccent_selected_fg_color: #ffffff;
+ $dim_color: darken($text_color, 20%);
+ $link_color: lighten($accent_color,20%);
+ $osd_destructive_color: #c01c28;
+ $insensitive_fg_color: transparentize($fg_color, 0.55);
+ $entry_border: $borders_color;
+ $button_bg: $bg_color2;
+ $corner_bar_highlighted: lighten($borders_color, 10%);
+}
+
+
+// General
$selected_fg_color: #ffffff;
+$radius: 6px;
-$borders_color: if($variant =='light', darken($bg_color, 20%), darken($bg_color, 6%));
-
-$separator_color: if($variant == 'light', darken($bg_color, 15%), darken($bg_color, 6%));
-
-$link_color: if($variant == 'light', darken($selected_bg_color,10%),
- lighten($selected_bg_color,20%));
+// Borders and separators
+$menus_border_color: transparentize(black, 1.0);
+$shadow_color: rgba(0, 0, 0, 0.5);
$warning_color: #F27835;
$error_color: #FC4138;
$destructive_color: #F04A50;
-$insensitive_fg_color: if($variant == 'light', transparentize($fg_color, 0.45), transparentize($fg_color, 0.55));
-
-$tooltip_bg_color: transparentize(mix($selected_bg_color, black, 95%), 0.05);
+$tooltip_bg_color: transparentize(mix($accent_color, black, 95%), 0.05);
$tooltip_fg_color: $selected_fg_color;
$tooltip_border_color: #d0d0d0;
$osd_fg_color: #c3c3c3;
-$osd_bg_color: #353535;
+$osd_bg_color: #303030;
$osd_button_bg: transparentize(lighten($osd_bg_color, 22%), 0.6);
$osd_button_border: transparentize(darken($osd_bg_color, 20%), 0.6);
@@ -40,24 +92,7 @@ $osd_entry_border: transparentize(darken($osd_bg_color, 12%), 0.6);
$osd_insensitive_fg_color: mix($osd_fg_color, opacify($osd_bg_color, 1), 30%);
-$panel_bg: $bg_color;
-$panel_fg: $fg_color;
-
-$entry_bg: if($variant=='light', $base_color, lighten($base_color, 0%));
-$entry_border: if($variant == 'light', #cfd6e6, darken($borders_color, 0%));
-
-$button_bg: if($variant == 'light', lighten($bg_color, 2%), lighten($base_color, 2%));
+$entry_bg: $bg_color2;
$button_border: $entry_border;
-// Colors used for highlights in places where we don't want to use accents
-$noaccent_light_bg_color: #c0c0c0;
-$noaccent_light_fg_color: $text_color;
-$noaccent_dark_bg_color: #525352;
-$noaccent_dark_fg_color: #ffffff;
-$noaccent_selected_bg_color: if($variant=='light', $noaccent_light_bg_color, $noaccent_dark_bg_color);
-$noaccent_selected_fg_color: if($variant=='light', $noaccent_light_fg_color, $noaccent_dark_fg_color);
-
-$applet_separator_color: if($variant == 'light', darken($bg_color, 15%), rgba(255,255,255, 0.12));
-
-$corner_bar_unhighlighted: $applet_separator_color;
-$corner_bar_highlighted: if($variant == 'light', darken($applet_separator_color, 10%), opacify($applet_separator_color, .1));
+$corner_bar_unhighlighted: $borders_color;
diff --git a/cinnamon-shell/upstream/sass/_common.scss b/cinnamon-shell/upstream/sass/_common.scss
index b93ca417fe..c461cae8a8 100644
--- a/cinnamon-shell/upstream/sass/_common.scss
+++ b/cinnamon-shell/upstream/sass/_common.scss
@@ -39,7 +39,7 @@ stage {
@include button(osd);
&:hover { @include button(osd-hover); }
- &:focus { color: $selected_bg_color; }
+ &:focus { color: $accent_color; }
&:active { @include button(osd-active); }
&:insensitive { @include button(osd-insensitive); }
}
@@ -50,7 +50,7 @@ stage {
%entry {
padding: 7px;
caret-size: 1px;
- selection-background-color: $selected_bg_color;
+ selection-background-color: $accent_color;
selected-color: $selected_fg_color;
transition-duration: 300ms;
border-radius: 3px;
@@ -65,13 +65,20 @@ stage {
warning-color: $warning_color;
padding: 0 4px;
}
+
+ StLabel.hint-text { color: transparentize($fg_color, 0.7); }
+
+ StIcon.peek-password {
+ icon-size: 16px;
+ color: $fg_color;
+ }
}
%osd_entry {
padding: 7px;
caret-size: 1px;
caret-color: $osd_fg_color;
- selection-background-color: $selected_bg_color;
+ selection-background-color: $accent_color;
selected-color: $selected_fg_color;
transition-duration: 300ms;
border-radius: 3px;
@@ -100,19 +107,19 @@ StScrollBar {
}
StBin#trough {
- background-color: transparentize($base_color, 0.9);
+ background-color: transparentize($bg_color2, 0.9);
border-radius: 8px;
}
StButton#vhandle, StButton#hhandle {
border-radius: 2px;
- background-color: mix($fg_color, $bg_color, 40%);
+ background-color: $bg_color2;
border: 0px solid;
margin: 0px;
- &:hover { background-color: mix($fg_color, $bg_color, 30%); }
+ &:hover { background-color: $bg_color3; }
- &:active { background-color: $selected_bg_color; }
+ &:active { background-color: $accent_color; }
}
}
@@ -131,8 +138,8 @@ StScrollBar {
width: 50px;
height: 50px;
border-radius: 25px;
- background-color: transparentize($selected_bg_color, 0.7);
- box-shadow: 0 0 2px 2px $selected_bg_color;
+ background-color: transparentize($accent_color, 0.7);
+ box-shadow: 0 0 2px 2px $accent_color;
}
//
@@ -143,7 +150,7 @@ StScrollBar {
-slider-height: 0.3em;
-slider-background-color: $button_border; //background of the trough
-slider-border-color: transparentize($bg_color, 0.7); //trough border color
- -slider-active-background-color: $selected_bg_color; //active trough fill
+ -slider-active-background-color: $accent_color; //active trough fill
-slider-active-border-color: transparentize($bg_color, 0.7); //active trough border
-slider-border-width: 1px;
-slider-handle-radius: 0.5em;
@@ -263,37 +270,36 @@ StScrollBar {
}
//
-// Popvers/Menus
+// Popovers/Menus
//
.menu {
color: $fg_color;
- border: 1px solid $borders_color;
- border-radius: 3px;
- background-color: transparentize($bg_color, 0.01);
+ background-color: $bg_color;
+ box-shadow: 0 0 6px $shadow_color;
- &.top {
- border-radius: 0 0 3px 3px;
+ &-top {
+ border-radius: 0 0 $radius $radius;
}
- &.bottom {
- border-radius: 3px 3px 0 0;
+ &-bottom {
+ border-radius: $radius $radius 0 0;
}
- &.left {
- border-radius: 0 3px 3px 0;
+ &-left {
+ border-radius: 0 $radius $radius 0;
}
- &.right {
- border-radius: 3px 0 0 3px;
+ &-right {
+ border-radius: $radius 0 0 $radius;
}
}
.popup-sub-menu {
- background-color: $base_color;
+ background-color: $bg_color;
box-shadow: none;
- .popup-menu-item:ltr { padding-right: 1.75em; }
- .popup-menu-item:rtl { padding-left: 1.75em; }
+ .popup-menu-item:ltr { padding-left: 2.5em; }
+ .popup-menu-item:rtl { padding-right: 2.5em; }
StScrollBar {
padding: 4px;
@@ -305,14 +311,12 @@ StScrollBar {
.popup-menu-item {
padding: .4em 1.75em;
spacing: 1em;
- // border: 1px solid transparent;
border-left-width: 0;
border-right-width: 0;
&:active {
color: $noaccent_selected_fg_color;
- // border-color: transparentize($fg_color, 0.89);
- background-color: $noaccent_selected_bg_color;
+ background-color: $bg_color2;
}
&:insensitive {
color: transparentize($fg_color, 0.5);
@@ -326,71 +330,12 @@ StScrollBar {
&:insensitive { color: $insensitive_fg_color; }
}
-
-/* This is for popup menus in Cinnamon versions < 3.2 */
-.popup-menu {
- color: white;
- color: $fg_color;
-
- &-arrow { icon-size: 16px; }
-
- .popup-sub-menu {
- background-color: $base_color;
- box-shadow: none;
-
- .popup-menu-item:ltr { padding-right: 1.75em; }
- .popup-menu-item:rtl { padding-left: 1.75em; }
-
- StScrollBar {
- padding: 4px;
- StBin#trough, StBin#vhandle { border-width: 0; }
- }
- }
-
- .popup-menu-content { padding: 1em 0em 1em 0em; }
- .popup-menu-item {
- padding: .4em 1.75em;
- spacing: 1em;
- border: 1px solid transparent;
- border-left-width: 0;
- border-right-width: 0;
-
- &:active {
- color: $fg_color;
- border-color: transparentize($fg_color, 0.89);
- background-color: transparentize($fg_color, 0.92);
- }
- &:insensitive {
- color: transparentize($fg_color, 0.5);
- background: none;
- }
- }
-
- .popup-inactive-menu-item { //all icons and other graphical elements
- color: $fg_color;
-
- &:insensitive { color: $insensitive_fg_color; }
- }
-
- &-icon { icon-size: 16px; }
-}
-
-.popup-menu-boxpointer {
- -arrow-border-radius: 3px;
- -arrow-background-color: $bg_color;
- -arrow-border-width: 1px;
- -arrow-border-color: $borders_color;
- -arrow-base: 21px;
- -arrow-rise: 9px;
- -boxpointer-gap: 2px;
-}
-
/*Scale view context menu*/
.popup-combo-menu {
color: $fg_color;
border: 1px solid $borders_color;
border-radius: 3px;
- background-color: $base_color;
+ background-color: $bg_color2;
box-shadow: none;
padding: 1em 0em 1em 0em;
}
@@ -417,7 +362,19 @@ StScrollBar {
font-weight: normal;
}
-.popup-device-menu-item { spacing: .5em; }
+.popup-device-menu-item {
+ spacing: .5em;
+
+ font-weight: bold;
+ color: $fg_color;
+
+ &:insensitive { color: $fg_color; spacing: 1em;}
+
+ .popup-inactive-menu-item {
+ font-weight: normal;
+ color: $fg_color;
+ }
+}
.popup-subtitle-menu-item { font-weight: normal; }
@@ -546,19 +503,19 @@ StScrollBar {
}
&-top {
- box-shadow: 0 1px $borders_color;
+ box-shadow: 0 1px $bg_color;
}
&-bottom {
- box-shadow: 0 -1px $borders_color;
+ box-shadow: 0 -1px $bg_color;
}
&-left {
- box-shadow: 1px 0 $borders_color;
+ box-shadow: 1px 0 $bg_color;
}
&-right {
- box-shadow: -1px 0 $borders_color;
+ box-shadow: -1px 0 $bg_color;
}
&-dummy {
@@ -612,18 +569,18 @@ StScrollBar {
-cinnamon-caption-spacing: 8px;
&:focus {
- background-color: $selected_bg_color;
+ background-color: $accent_color;
color: $selected_fg_color;
- border: 1px solid $selected_bg_color;
+ border: 1px solid $accent_color;
}
}
.window-border {
- border: 3px $selected_bg_color;
+ border: 3px $accent_color;
border-radius: 2px;
background-color: rgba(255,255,255,.05);
/* Cover rounded corners and some bad adjustment gaps */
- box-shadow: 0 0 0 1px $selected_bg_color inset;
+ box-shadow: 0 0 0 1px $accent_color inset;
}
.overview-empty-placeholder {
@@ -641,13 +598,13 @@ StScrollBar {
@include entry(osd);
&:focus {
- border: 1px solid $selected_bg_color;
- background-color: $selected_bg_color;
+ border: 1px solid $accent_color;
+ background-color: $accent_color;
color: $selected_fg_color;
font-style: italic;
transition-duration: 300;
selection-background-color: $selected_fg_color;
- selected-color: $selected_bg_color;
+ selected-color: $accent_color;
}
}
@@ -657,7 +614,7 @@ StScrollBar {
border-radius: 2px;
&#active {
- border: 4px solid $selected_bg_color;
+ border: 4px solid $accent_color;
background-color: black;
border-radius: 2px;
}
@@ -748,8 +705,9 @@ StScrollBar {
margin-right: .5em;
padding: .5em;
min-width: 350px;
- border: 1px solid $borders_color;
- background-color: $base_color;
+ border: 1px solid $menus_border_color;
+ background-color: $bg_color2;
+ border-radius: $radius;
}
.calendar-events-no-events-box {
@@ -760,7 +718,8 @@ StScrollBar {
padding: 6px;
&:hover {
- background-color: $selected_bg_color;
+ background-color: $accent_color;
+ border-radius: $radius;
.calendar-events-no-events-icon,
.calendar-events-no-events-label {
@@ -789,6 +748,8 @@ StScrollBar {
.calendar-event-button {
border: 1px solid rgba(0,0,0,0);
+ border-radius-topright: $radius;
+ border-radius-bottomright: $radius;
.calendar-event-time-past {
color: transparentize($fg_color, 0.6);
@@ -803,7 +764,7 @@ StScrollBar {
margin-bottom: .2em;
&:all-day {
- color: $selected_bg_color;
+ color: $accent_color;
}
}
.calendar-event-time-future {
@@ -833,12 +794,12 @@ StScrollBar {
}
&:current {
font-weight: bold;
- color: $selected_bg_color;
+ color: $accent_color;
}
}
&:hover {
- background-color: $selected_bg_color;
+ background-color: $accent_color;
border: 1px solid $borders_color;
.calendar-event-time-past,
.calendar-event-time-present,
@@ -869,7 +830,7 @@ StScrollBar {
}
.calendar-event-color-strip {
- width: 2px;
+ width: 3px;
}
.calendar-today-home-button {
@@ -893,9 +854,10 @@ StScrollBar {
.calendar-today-home-button-enabled {
padding: 6px;
+ border-radius: $radius;
&:hover {
- background-color: $selected_bg_color;
+ background-color: $accent_color;
.calendar-today-day-label {
color: $selected_fg_color
@@ -974,7 +936,8 @@ StScrollBar {
&:hover {
font-weight: bold;
color: $selected_fg_color;
- background-color: $selected_bg_color;
+ background-color: $accent_color;
+ border-radius: $radius;
}
}
@@ -1005,8 +968,9 @@ StScrollBar {
.calendar-today {
color: $fg_color;
- background-color: if($variant == 'light', transparentize($selected_bg_color, 0.6), transparentize($selected_bg_color, 0.6));
+ background-color: if($variant == 'light', transparentize($accent_color, 0.6), transparentize($accent_color, 0.6));
border-width: 0;
+ border-radius: $radius;
&:selected {
font-weight: bold;
@@ -1015,6 +979,7 @@ StScrollBar {
.calendar-not-today {
color: $fg_color;
+ border-radius: $radius;
&:selected {
font-weight: bold;
@@ -1048,7 +1013,7 @@ StScrollBar {
//
#notification {
box-shadow: 0 1px 15px 4px $borders_color;
- border-top-color: $selected_bg_color;
+ border-top-color: $accent_color;
border-top: 4px;
border-radius: 5px;
background-color: $bg_color;
@@ -1117,8 +1082,8 @@ StScrollBar {
.switcher-list {
color: $fg_color;
border: 1px solid $borders_color;
- background-color: $bg_color;
- border-radius: 3px;
+ background-color: $panel_bg;
+ border-radius: $radius;
padding: 20px;
> StBoxLayout {
@@ -1129,17 +1094,16 @@ StScrollBar {
.item-box {
padding: 8px;
- border-radius: 2px;
+ border-radius: $radius;
&:outlined {
padding: 8px;
- border: 1px solid $selected_bg_color;
+ border: 1px solid $accent_color;
}
&:selected {
- color: $selected_fg_color;
- background-color: $selected_bg_color;
- border: 0px solid $selected_bg_color;
+ background-color: $bg_color4;
+ border: 0px solid $accent_color;
}
}
@@ -1195,161 +1159,6 @@ StScrollBar {
&:rtl { background-image: url("common-assets/misc/corner-ripple.svg"); }
}
-//
-// Modal dialogs
-//
-.lightbox { background-color: rgba(0, 0, 0, 0.4); }
-.flashspot { background-color: white; }
-
-.modal-dialog {
- background-color: $bg_color;
- border: 1px solid $borders_color;
- border-radius: 3px;
- padding: 5px 10px;
-
- > StBoxLayout:first-child {
- padding: 10px;
- }
-
- &-button-box {
- spacing: 0;
- margin: 0px;
- padding: 10px;
- border: none;
- background-color: $bg_color;
-
- .modal-dialog-button {
- padding-top: 0;
- padding-bottom: 0;
- height: 30px;
-
- @extend %button;
- }
- }
-
- .confirm-dialog-title {
- text-align: center;
- font-weight: bold;
- font-size: 1.3em;
- padding-bottom: 12px;
- }
-}
-
-//
-// Run dialog
-//
-.run-dialog {
- padding: 10px 15px 10px 15px;
- border: 1px solid $borders_color;
- border-radius: 3px;
- background-color: $bg_color;
-
- > * { padding: 0; }
-
- &-label {
- font-size: 1.3em;
- font-weight: bold;
- color: $fg_color;
- padding-bottom: 15px;
- text-align: center;
- }
-
- &-description {
- color: $fg_color;
- padding-top: 15px;
- text-align: center;
-
- &.error { color: $error_color; }
- }
-
- // &-error-label { color: $error_color; }
-
- // &-error-box {
- // padding-top: 15px;
- // spacing: 5px;
- // }
- &-completion-box {
- padding-top: 5px;
- padding-left: 15px;
- font-size: 1em;
- }
- &-entry {
- width: 21em;
- height: 1.2em;
- padding: 7px;
- border-radius: 3px;
- caret-color: $osd_fg_color;
- selected-color: $selected_fg_color;
- selection-background-color: $selected_bg_color;
-
- @include entry(osd);
-
- &:focus { @include entry(focus); }
- }
- .modal-dialog-button-box {
- border: none;
- box-shadow: none;
- background: none;
- }
-}
-
-/* CinnamonMountOperation Dialogs */
-.cinnamon-mount-operation-icon {
- icon-size: 48px;
-}
-
-.mount-password-reask {
- color: $warning_color;
-}
-
-.show-processes-dialog,
-.mount-question-dialog {
- spacing: 24px;
-
- &-subject {
- padding-top: 10px;
- padding-left: 17px;
- padding-bottom: 6px;
-
- &:rtl {
- padding-left: 0px;
- padding-right: 17px;
- }
- }
- &-description {
- padding-left: 17px;
- width: 28em;
-
- &:rtl { padding-right: 17px; }
- }
-}
-
-.show-processes-dialog-app-list {
- max-height: 200px;
- padding-top: 24px;
- padding-left: 49px;
- padding-right: 32px;
-
- &:rtl {
- padding-right: 49px;
- padding-left: 32px;
- }
-
- &-item {
- color: #ccc;
-
- &:hover { color: white }
-
- &:ltr { padding-right: 1em; }
- &:rtl { padding-left: 1em; }
-
- &-icon:ltr { padding-right: 17px; }
- &-icon:rtl { padding-left: 17px; }
-
- &-name { font-size: 1.1em; }
- }
-}
-
//
// Magnifier
//
@@ -1359,75 +1168,31 @@ StScrollBar {
.full-screen { border-width: 0px; }
}
-//
-// On-Screen Keyboard
-//
-#keyboard {
- background-color: $osd_bg_color;
- border-width: 0;
- border-top-width: 1px;
- border-color: transparentize(black, 0.6);
-}
-
-.keyboard-layout {
- spacing: 10px;
- padding: 10px;
-}
-
-.keyboard-row {
- spacing: 15px;
-}
-
-.keyboard-key {
- min-height: 2em;
- min-width: 2em;
- font-size: 1.4em;
- font-weight: bold;
- border-radius: 3px;
- box-shadow: none;
-
- @include button(osd);
-
- &:hover { @include button(osd-hover); }
- &:active, &:checked { @include button(osd-active); }
-
- &:grayed { @include button(osd-insensitive); }
-}
-
-.keyboard-subkeys { //long press on a key popup
- color: $osd_fg_color;
- padding: 5px;
- -arrow-border-radius: 2px;
- -arrow-background-color: $osd_bg_color;
- -arrow-border-width: 1px;
- -arrow-border-color: transparentize(black, 0.6);;
- -arrow-base: 20px;
- -arrow-rise: 10px;
- -boxpointer-gap: 5px;
-}
-
//
// Cinnamon Specific Section
//
//
-// Menu (menu.js)
+// Old Menu applet (deprecated since Cinnamon 6.6). Kept here temporarily
+// to support spices and old Cinnamon versions
//
.menu {
&-favorites-box {
padding: 10px;
transition-duration: 300;
- background-color: darken($base_color, 5%);
- border: 1px solid $borders_color;
+ background-color: $bg_color2;
+ border: 1px solid $menus_border_color;
+ border-radius: $radius;
}
&-favorites-button {
padding: .9em 1em;
border: 1px solid rgba(0,0,0,0);
- border-radius: 2px;
+ border-radius: $radius;
&:hover {
- background-color: $noaccent_selected_bg_color;
+ background-color: $bg_color3;
+ border: 1px solid $menus_border_color;
}
}
@@ -1456,8 +1221,9 @@ StScrollBar {
&-selected {
padding: 7px;
color: $noaccent_selected_fg_color;
- background-color: $noaccent_selected_bg_color;
- border: 1px solid $borders_color;
+ background-color: $bg_color2;
+ border: 1px solid $menus_border_color;
+ border-radius: $radius;
&:highlighted { font-weight: bold; }
}
@@ -1473,19 +1239,22 @@ StScrollBar {
&-selected {
padding: 7px;
color: $noaccent_selected_fg_color;
- background-color: $noaccent_selected_bg_color;
- border: 1px solid $borders_color;
- }
- &:hover {
- background-color: mix($noaccent_selected_bg_color, $bg_color, 40%);
- border: 1px solid mix($borders_color, $bg_color, 40%);
- border-radius: 0px;
+ background-color: $bg_color2;
+ border: 1px solid $menus_border_color;
+ border-radius: $radius;
}
&-greyed {
padding: 7px;
color: $insensitive_fg_color;
border: 1px solid rgba(0,0,0,0);
}
+ &:hover {
+ padding: 7px;
+ color: $noaccent_selected_fg_color;
+ background-color: $bg_color2;
+ border: 1px solid $menus_border_color;;
+ border-radius: $radius;
+ }
&-label:ltr { padding-left: 5px; }
&-label:rtl { padding-right: 5px; }
@@ -1518,6 +1287,7 @@ StScrollBar {
min-height: 16px;
font-weight: normal;
caret-color: $fg_color;
+ border-radius: $radius;
@extend %entry;
}
@@ -1531,52 +1301,174 @@ StScrollBar {
.menu-context-menu {
}
+// New menu (since Cinnamon 6.6)
//
-// OSD
-//
-.info-osd {
- text-align: center;
- font-weight: bold;
- spacing: 1em;
- padding: 16px;
- color: $fg_color;
- border: 1px solid $borders_color;
- border-radius: 5px;
- background-color: $bg_color;
-}
+// Class diagram:
+// appmenu-main-box
+// ├─ appmenu-right-box
+// | ├─ appmenu-search-box
+// | | └─ appmenu-system-box
+// | └─ appmenu-categories-applications-box
+// | ├─ appmenu-categories-scrollview
+// | | └─ appmenu-categories-box
+// | └─vfade appmenu-applications-scrollview
+// | └─ appmenu-applications-box
+// └─ appmenu-sidebar
+// ├─ appmenu-sidebar-user-box
+// | └─ user-widget user-widget-label
+// ├─ appmenu-sidebar-scrollview
+// | └─ appmenu-sidebar-scrollbox
+// | ├─ appmenu-places-box
+// | └─ appmenu-favs-box
+// └─ appmenu-system-box
-.restart-osd {
- font-size: 1.6em;
-}
+$appmenu_small_padding: 5px;
+$appmenu_padding: 10px;
+$appmenu_large_padding: 15px;
+$base_padding: 7px;
-.workspace-osd {
- font-size: 4em;
+%appmenu_button {
+ padding: $base_padding;
+ spacing: 5px;
+ border-radius: $radius;
}
+.appmenu {
-.osd-window {
- text-align: center;
- font-weight: bold;
- spacing: 1em;
- padding: 20px;
+ // this can be used to color the entire menu background but we aren't using it here
+ &-background {
+ // using this to override the default padding on menus so widgets can span edge
+ // to edge. The side effect is that some of our internal container widgets
+ // will need to have a border-radius added to them or the corners will poke out
+ // the edges of the menu.
+ .popup-menu-content { padding: 0; }
+ }
- color: $fg_color;
- background-color: $bg_color;
- border: 1px solid $borders_color;
- border-radius: 5px;
+ &-main-box {
+ spacing: $appmenu_padding;
+ }
- .osd-monitor-label { font-size: 3em; }
+ &-right-box {
+ spacing: $appmenu_small_padding;
+ padding: $appmenu_padding $appmenu_padding;
+ }
- .level {
- padding: 0;
- height: 0.7em;
- background-color: transparentize(black, 0.5);
- border-radius: 2px;
+ &-categories-applications-box {
+ spacing: $appmenu_large_padding;
+
+ &:top {
+ // Extra padding at the top of the categories/apps
+ // when the search box is at the bottom
+ padding-top: $appmenu_small_padding;
+ }
}
- .level-bar {
- border-radius: 2px;
- background-color: $selected_bg_color;
+ &-applications-box {
+ // Extra gap between the highlighted app and the scroll handle
+ padding-right: $appmenu_small_padding;
+ }
+
+ &-search-box {
+ spacing: $appmenu_padding;
+ }
+
+ &-sidebar {
+ padding: $appmenu_large_padding 0px;
+ background-color: $bg_color2;
+ border-radius: $radius 0 0 0;
+ @at-root .menu-top #{&} { border-radius: 0 0 0 $radius; }
+ @at-root .menu-bottom #{&} { border-radius: $radius 0 0 0; }
+ @at-root .menu-left #{&} { border-radius: 0; }
+ @at-root .menu-right #{&} { border-radius: 0; }
+ border-right-width: 1px;
+ border-color: $borders_color;
+ spacing: 5px;
+
+ &-user-box {}
+
+ .appmenu-system-button {
+ background-color: lighten($bg_color2, 10%);
+ &-lock:hover { background-color: lighten($bg_color2, 15%); }
+ &-logout:hover { background-color: lighten($bg_color2, 15%); }
+ &-shutdown { color: white; background-color: $osd_destructive_color; }
+ &-shutdown:hover { color: white; background-color: lighten($osd_destructive_color, 5%); }
+ }
+ }
+
+ &-system-box {
+ spacing: $appmenu_padding;
+ }
+
+ &-sidebar-button {
+ @extend %appmenu_button;
+
+ padding: 4px $base_padding;
+ margin: 0 $appmenu_padding;
+
+ &:hover {
+ background-color: $bg_color3;
+ border-color: $borders_color;
+ }
+ }
+
+ &-system-button {
+ padding: $base_padding * 1.2;
+ border: 1px solid $borders_color;
+ border-radius: 9999px;
+ background-color: lighten($bg_color2, 5%);
+ &-shutdown { color: white; background-color: $osd_destructive_color; }
+ &-lock:hover { background-color: lighten($bg_color2, 10%); }
+ &-logout:hover { background-color: lighten($bg_color2, 10%); }
+ &-shutdown:hover { color: white; background-color: lighten($osd_destructive_color, 5%); }
+ }
+
+ &-application-button {
+ @extend %appmenu_button;
+
+ &-label { padding: 0; }
+ &-description {
+ @extend %caption;
+ color: $dim_color;
+ }
+
+ &:highlighted { font-weight: bold; }
+
+ &-selected {
+ @extend %appmenu_button;
+ background-color: $bg_color2;
+
+ &:highlighted { font-weight: bold; }
+ }
}
+
+ &-category-button {
+ @extend %appmenu_button;
+
+ &-label { padding: 0; }
+
+ &:hover { background-color: $bg_color3; }
+
+ &-selected {
+ @extend %appmenu_button;
+
+ background-color: $bg_color2;
+ }
+
+ &-greyed {
+ @extend %appmenu_button;
+ color: $insensitive_fg_color;
+ font-style: italic;
+
+ StIcon { opacity: 0.5; }
+ }
+ }
+
+ &-search-entry-icon {
+ icon-size: 1em;
+ }
+}
+
+#appmenu-search-entry {
+ @extend %entry;
}
//
@@ -1651,12 +1543,12 @@ StScrollBar {
&:focus,
&:running {
color: $panel_fg;
- border-color: $selected_bg_color;
+ border-color: $accent_color;
background-color: transparentize($panel_fg, 0.8);
}
& .progress {
- background-color: transparentize($selected_bg_color, 0.2);
+ background-color: transparentize($accent_color, 0.2);
}
}
@@ -1669,7 +1561,7 @@ StScrollBar {
&-preview {
spacing: 6px;
color: $fg_color;
- border: 1px solid $borders_color;
+ border: 1px solid $menus_border_color;
background-color: $bg_color;
border-radius: 3px;
padding: 6px 12px 12px 12px;
@@ -1702,8 +1594,6 @@ StScrollBar {
&.top,
&.bottom {
border-bottom-width: 2px;
-
- & StLabel { padding-left: 2px; }
}
&.right {
@@ -1725,17 +1615,17 @@ StScrollBar {
&:hover,
&:focus {
color: $panel_fg;
- background-color: transparentize($panel_fg, 0.7);
+ background-color: $panel_active_bg;
}
&:active,
&:checked {
color: $panel_fg;
- border-color: $selected_bg_color;
+ border-color: $accent_color;
}
& .progress {
- background-color: transparentize($selected_bg_color, 0.2);
+ background-color: transparentize($accent_color, 0.2);
}
}
@@ -1750,17 +1640,20 @@ StScrollBar {
}
&-number-label {
- font-size: 0.8em;
- z-index: 99;
+ font-size: 12px;
color: $selected_fg_color;
}
&-badge {
- border-radius: 9999px;
- background-color: $selected_bg_color;
+ border-radius: 99px;
+ background-color: $accent_color;
margin: 0;
}
+ &-notifications-badge-label {
+ font-size: 12px;
+ }
+
&-button-label {
padding-left: 4px;
}
@@ -1771,7 +1664,7 @@ StScrollBar {
&-thumbnail-menu {
color: $fg_color;
- border: 1px solid $borders_color;
+ border: 1px solid $menus_border_color;
background-color: $bg_color;
border-radius: 3px;
padding: 0px;
@@ -1787,11 +1680,11 @@ StScrollBar {
&:outlined {
padding: 8px;
- border: 1px solid $selected_bg_color;
+ border: 1px solid $accent_color;
}
&:selected {
- border: 1px solid $selected_bg_color;
+ border: 1px solid $accent_color;
}
}
@@ -1927,93 +1820,71 @@ StScrollBar {
-slider-height: 0.5em;
-slider-background-color: if($variant == 'light', $button_border, darken($bg_color, 5%));
-slider-border-color: rgba(0,0,0,0);
- -slider-active-background-color: $selected_bg_color;
+ -slider-active-background-color: $accent_color;
-slider-active-border-color: rgba(0,0,0,0);
-slider-border-width: 0px;
-slider-handle-radius: 0px;
}
}
-//
-// Workspace Switcher applet (workspaceSwitcher.js)
-//
-#workspaceSwitcher {
- spacing: 0px;
- padding: 3px;
-}
+// workspace switcher applet
-/* Controls the styling when using the "Simple buttons" option */
-.workspace-switcher {
- padding-left: 3px;
- padding-right: 3px;
+.panel-top,
+.panel-bottom {
- .panel-left &,
- .panel-right & {
- padding: 0;
- }
+ .workspace-switcher { padding: 0 4px;}
}
.workspace-button {
- border: 1px solid transparentize(black, 0.6);
- background-color: transparentize(black, 0.8);
- width: 20px;
- height: 14px;
- color: transparentize($selected_fg_color, 0.55);
- padding: 3px;
- padding-top: 4px;
- transition-duration: 200;
+ border: 1px solid $borders_color;
+ width: 2em;
+ color: $insensitive_fg_color;
+ background-color: transparentize($fg_color, 0.95);
- &.vertical {
- height: 1.5em;
- width: 24px;
- padding: 0;
- padding-top: 3px;
- padding-bottom: 3px;
- }
+ &.vertical { height: 2em; }
&:outlined {
- background-color: $selected_bg_color;
- color: $selected_fg_color;
+ background-color: $bg_color2;
+ color: $fg_color;
- &:hover {
- background-color: transparentize($selected_bg_color, 0.3);
- color: $selected_fg_color;
- }
+ &:hover { background-color: $bg_color3; }
}
- &:hover {
- background-color: transparentize($fg_color, 0.8);
- color: $selected_fg_color;
+ &:hover { background-color: $bg_color2; }
+
+ &:shaded { // this is a workspace with no open windows
+ background-color: darken($bg_color, 5%);
}
}
-/* Controls the style when using the "Visual representation" option */
+$workspace_window_color: if($variant == 'light', black, white);
+
.workspace-graph {
- padding: 3px;
- spacing: 6px;
-}
+ padding: 4px;
+ spacing: 4px;
-.workspace-graph .workspace {
- border: 1px solid transparentize(black, 0.6);
- background-color: transparentize(black, 0.8);
-}
+ .workspace {
+ border: 1px solid transparentize($fg_color, 0.8);
+ background-color: $bg_color;
-.workspace-graph .workspace:active {
- border: 1px solid $selected_bg_color;
-}
+ &:active {
+ border-color: $accent_color;
-.workspace-graph .workspace .windows {
- -active-window-background: lighten($panel_bg, 15%);
- -active-window-border: rgba(0, 0, 0, 0.8);
- -inactive-window-background: lighten($panel_bg, 15%);
- -inactive-window-border: rgba(0, 0, 0, 0.8);
-}
+ .windows {
+ -active-window-background: transparentize($workspace_window_color, 0.7);
+ -active-window-border: transparentize($workspace_window_color, 0.65);
+ -inactive-window-background: transparentize($workspace_window_color, 0.9);
+ -inactive-window-border: transparentize($workspace_window_color, 0.85);
+ }
+ }
-.workspace-graph .workspace:active .windows {
- -active-window-background: lighten($panel_bg, 25%);
- -active-window-border: rgba(0, 0, 0, 0.8);
- -inactive-window-background: lighten($panel_bg, 5%);
- -inactive-window-border: rgba(0, 0, 0, 0.8);
+ .windows {
+ -active-window-background: transparentize($workspace_window_color, 0.7);
+ -active-window-border: transparentize($workspace_window_color, 0.65);
+ -inactive-window-background: transparentize($workspace_window_color, 0.9);
+ -inactive-window-border: transparentize($workspace_window_color, 0.85);
+ }
+ }
}
//
@@ -2029,7 +1900,9 @@ StScrollBar {
padding-bottom: 2px;
// border-bottom-width: 1px;
transition-duration: 200;
- &:hover { background-color: $noaccent_selected_bg_color; }
+ &:hover {
+ background-color: $bg_color2;
+ }
}
&.vertical {
@@ -2058,6 +1931,10 @@ StScrollBar {
//
// Applets (applet.js)
//
+
+//padding and spacing for applets
+$applet_padding: 5px;
+
.applet {
&-separator {
padding: 1px 4px;
@@ -2067,34 +1944,30 @@ StScrollBar {
&-separator-line {
width: 1px;
- background: $applet_separator_color;
+ background: $borders_color;
&-vertical {
height: 1px;
- background: $applet_separator_color;
+ background: $borders_color;
}
}
&-box {
- padding-left: 4px;
- padding-right: 4px;
- spacing: 4px;
+ padding: 0 $applet_padding;
+ spacing: $applet_padding;
color: $panel_fg;
text-shadow: none;
transition-duration: 100;
text-align: center;
&.vertical {
- padding-left: 0px;
- padding-right: 0px;
- padding-top: 3px;
- padding-bottom: 3px;
+ padding: $applet_padding 0;
}
&:hover,
&:checked {
color: $noaccent_selected_fg_color;
- background-color: $noaccent_selected_bg_color;
+ background-color: $panel_active_bg;
}
&:highlight {
@@ -2136,11 +2009,27 @@ StScrollBar {
// User Applet
//
.user-icon {
- width: 32px;
- height: 32px;
- background-color: transparent;
- border: none;
- border-radius: 0;
+ background-size: contain;
+ border-radius: 99px;
+ color: $fg_color;
+ border-color: transparent;
+
+ & StIcon {
+ border: 1px solid transparent;
+ border-radius: 99px;
+ padding: 14px;
+ }
+
+ & StIcon.highlighted {
+ border: 1px solid $fg_color;
+ border-radius: 99px;
+ padding: 14px;
+ }
+
+ &.user-avatar {
+ border: 1px solid transparent;
+ border-radius: 99px;
+ }
}
.user-label {
@@ -2150,26 +2039,34 @@ StScrollBar {
margin: 0px;
}
-//
-// Cornerbar Applet
-//
+.user-widget-label {}
+
+.user-widget.horizontal { spacing: 7px; }
+
+.user-widget.vertical { spacing: $appmenu_padding; }
+
+.user-widget.vertical .user-widget-label {
+ @extend %title_4;
+ color: $fg_color;
+ text-align: center;
+}
+
+// cornerbar applet
+
.applet-cornerbar {
width: 8px;
background-color: $corner_bar_unhighlighted;
+ border: 1px solid $borders_color;
- &-box {
- padding: 4px 4px;
-
- &:hover > .applet-cornerbar {
- background-color: $corner_bar_highlighted;
- }
- }
+ &.vertical { height: 8px; }
- &.vertical {
- height: 8px;
+ &-box {
+ background: none;
}
}
+.applet-cornerbar-box:hover > .applet-cornerbar { background-color: $corner_bar_highlighted; }
+
//
// Desklets (desklet.js)
//
@@ -2221,8 +2118,8 @@ StScrollBar {
}
&-drag-placeholder {
- border: 2px solid $selected_bg_color;
- background-color: transparentize($selected_bg_color, 0.7);
+ border: 2px solid $accent_color;
+ background-color: transparentize($accent_color, 0.7);
}
}
@@ -2246,17 +2143,17 @@ StScrollBar {
// Tile Preview
//
.tile-preview {
- background-color: transparentize($selected_bg_color, 0.7);
- border: 1px solid $selected_bg_color;
+ background-color: transparentize($accent_color, 0.7);
+ border: 1px solid $accent_color;
- &.snap { background-color: transparentize($selected_bg_color, 0.4); }
+ &.snap { background-color: transparentize($accent_color, 0.4); }
}
.tile-hud {
- background-color: transparentize($selected_bg_color, 0.7);
- border: 1px solid $selected_bg_color;
+ background-color: transparentize($accent_color, 0.7);
+ border: 1px solid $accent_color;
- &.snap { background-color: transparentize($selected_bg_color, 0.4); }
+ &.snap { background-color: transparentize($accent_color, 0.4); }
&:top { border-top-width: 0px; }
&:bottom { border-bottom-width: 0px; }
diff --git a/cinnamon-shell/upstream/sass/_deprecated.scss b/cinnamon-shell/upstream/sass/_deprecated.scss
new file mode 100644
index 0000000000..e55950bfe9
--- /dev/null
+++ b/cinnamon-shell/upstream/sass/_deprecated.scss
@@ -0,0 +1,52 @@
+
+/*
+****** DEPRECATED
+
+On-Screen Keyboard (<= Cinnamon 6.4)
+*/
+
+#keyboard {
+ background-color: $osd_bg_color;
+ border-width: 0;
+ border-top-width: 1px;
+ border-color: transparentize(black, 0.6);
+}
+
+.keyboard-layout {
+ spacing: 10px;
+ padding: 10px;
+}
+
+.keyboard-row {
+ spacing: 15px;
+}
+
+.keyboard-key {
+ min-height: 2em;
+ min-width: 2em;
+ font-size: 1.4em;
+ font-weight: bold;
+ border-radius: 3px;
+ box-shadow: none;
+
+ @include button(osd);
+
+ &:hover { @include button(osd-hover); }
+ &:active, &:checked { @include button(osd-active); }
+
+ &:grayed { @include button(osd-insensitive); }
+}
+
+.keyboard-subkeys { //long press on a key popup
+ color: $osd_fg_color;
+ padding: 5px;
+ -arrow-border-radius: 2px;
+ -arrow-background-color: $osd_bg_color;
+ -arrow-border-width: 1px;
+ -arrow-border-color: transparentize(black, 0.6);;
+ -arrow-base: 20px;
+ -arrow-rise: 10px;
+ -boxpointer-gap: 5px;
+}
+
+/* ****** DEPRECATED */
\ No newline at end of file
diff --git a/cinnamon-shell/upstream/sass/_dialogs.scss b/cinnamon-shell/upstream/sass/_dialogs.scss
new file mode 100644
index 0000000000..1bc84af5ff
--- /dev/null
+++ b/cinnamon-shell/upstream/sass/_dialogs.scss
@@ -0,0 +1,467 @@
+// Modal dialogs
+
+$base_padding: 6px;
+$base_margin: 4px;
+$dialog_radius: 18px;
+$osd_radius: 20px;
+
+// Mixin to convert provided font size in pt to em units
+@mixin fontsize($size, $base: 16px, $unit: pt) {
+ // if pt, convert into unitless value with the assumption: 1pt = 1.091px
+ $adjusted_size: if($unit == pt, $size * 1.091, $size) * 1000;
+ $rounded_size: round($adjusted_size / $base) / 1000;
+ font-size: $rounded_size * 1em;
+}
+
+// Button drawing function
+@mixin styled_button($type, $tc:$fg_color, $c:$bg_color, $style: null) {
+ //
+ // $type: button type, possible values:
+ // - normal, focus, hover, active, checked, insensitive, default, undecorated
+ // $c: button bg color, derived from bg_color
+ // $tc: button text color, derived from fg_color
+ // $style: button style, possible values: flat, default
+ //
+
+ // mix input colors to get button background color
+ $button_bg_color: $button_bg;
+
+ // background color mix override for flat style; the button bg color is the background color input
+ @if $style == 'flat' { $button_bg_color: $c;}
+ // background color mix override for default button style
+ @if $style == 'default' { $button_bg_color: $c;}
+
+ // button base state background colors
+ $hover_button_bg_color: if($variant =='light', darken($button_bg_color, 10%), lighten($button_bg_color, 10%));
+ $active_button_bg_color: if($variant =='light', lighten($hover_button_bg_color, 5%), darken($hover_button_bg_color, 5%));
+ $checked_button_bg_color: if($variant =='light', lighten($hover_button_bg_color, 5%), darken($hover_button_bg_color, 5%));
+ $insensitive_button_bg_color: if($variant =='light', lighten($button_bg_color, 3%), darken($button_bg_color, 3%));
+ $focus_button_bg_border_color: if($variant =='light', darken($button_bg_color, 30%), lighten($button_bg_color, 30%));
+
+ border: 1px solid $button_bg_color;
+
+ // flat style overrides
+ @if $style == 'flat' {
+ $insensitive_button_bg_color: $button_bg_color;
+ }
+
+ // normal style
+ @if $type == 'normal' {
+ color: $tc;
+ background-color: $button_bg_color;
+ }
+
+ @if $type == 'focus' {
+ color: $tc;
+ background-color: $button_bg_color;
+ border: 1px solid $focus_button_bg_border_color;
+ }
+
+ // hover button
+ @else if $type == 'hover' {
+ color: $tc;
+ background-color: $hover_button_bg_color;
+ }
+
+ // active button
+ @else if $type == 'active' {
+ color: $tc;
+ background-color: $active_button_bg_color;
+ }
+
+ // checked button
+ @else if $type == 'checked' {
+ color: $tc;
+ background-color: $checked_button_bg_color;
+ }
+
+ // insensitive button
+ @else if $type == 'insensitive' {
+ $insensitive_button_fg_color: transparentize($tc, .5);
+ color: $insensitive_button_fg_color;
+ background-color: $insensitive_button_bg_color;
+ }
+
+ // reset (unstyled button)
+ @else if $type == 'undecorated' {
+ background-color: transparent;
+ border-color: transparent;
+ box-shadow: none;
+
+ &:insensitive {
+ background-color: transparent !important;
+ }
+ }
+}
+
+%caption_heading {
+ font-weight: 700;
+ @include fontsize(9pt);
+}
+
+%caption {
+ font-weight: 400;
+ @include fontsize(9pt);
+}
+
+%title_2 {
+ font-weight: 800;
+ @include fontsize(15pt);
+}
+
+%title_4 {
+ font-weight: 700;
+ @include fontsize(13pt);
+}
+
+%heading {
+ font-weight: 700;
+ @include fontsize(11pt);
+}
+
+%flat_styled_button {
+ @include styled_button(normal, $style: flat);
+ &:focus { @include styled_button(focus, $style: flat); }
+ &:hover { @include styled_button(hover, $style: flat); }
+ &:insensitive { @include styled_button(insensitive, $style: flat); }
+ &:selected,
+ &:active { @include styled_button(active, $style: flat); }
+ &:checked { @include styled_button(checked, $style: flat); }
+}
+
+%dialog_button {
+ font-weight: bold;
+ padding: $base_padding * 2;
+ border-radius: $dialog_radius;
+
+ @include styled_button(normal);
+ &:focus { @include styled_button(focus); }
+ &:hover { @include styled_button(hover); }
+ &:active { @include styled_button(active); }
+ &:checked { @include styled_button(checked); }
+ &:insensitive { @include styled_button(insensitive); }
+}
+
+%dialog_button_default {
+ @extend %dialog_button;
+
+ @include styled_button(normal, $c: $accent_color, $style: default);
+ &:focus { @include styled_button(focus, $c: $accent_color, $style: default); }
+ &:hover { @include styled_button(hover, $c: $accent_color, $style: default); }
+ &:active { @include styled_button(active, $c: $accent_color, $style: default); }
+ &:checked { @include styled_button(checked, $c: $accent_color, $style: default); }
+ &:insensitive {
+ border-color: $borders_color;
+
+ @include styled_button(insensitive);
+ }
+}
+
+%dialog_button_destructive {
+ @extend %dialog_button;
+
+ @include styled_button(normal, $c: $osd_destructive_color, $style: default);
+ &:focus { @include styled_button(focus, $c: $osd_destructive_color, $style: default); }
+ &:hover { @include styled_button(hover, $c: $osd_destructive_color, $style: default); }
+ &:active { @include styled_button(active, $c: $osd_destructive_color, $style: default); }
+ &:checked { @include styled_button(checked, $c: $osd_destructive_color, $style: default); }
+ &:insensitive {
+ border-color: $borders_color;
+
+ @include styled_button(insensitive);
+ }
+}
+
+.dialog {
+ background-color: $bg_color;
+ border-radius: $dialog_radius;
+ border: 1px solid $borders_color;
+ padding: $base_padding * 3;
+
+ .dialog-content-box {
+ margin-top: $base_margin * 2;
+ margin-bottom: $base_margin * 4;
+ spacing: $base_margin * 8;
+ max-width: 28em;
+ }
+
+ .dialog-button {
+ @extend %dialog_button;
+
+ &:default { @extend %dialog_button_default; }
+ &:destructive-action { @extend %dialog_button_destructive; }
+ }
+
+ .confirm-dialog-title {
+ @extend %title_2;
+ text-align: center;
+ }
+}
+
+// Lists in dialogs
+
+.dialog-list {
+ spacing: $base_padding * 3;
+
+ .dialog-list-title {
+ @extend %heading;
+ text-align: center;
+ }
+
+ .dialog-list-scrollview { max-height: 200px; }
+ .dialog-list-box {
+ spacing: 1em;
+
+ .dialog-list-item {
+ spacing: 1em;
+
+ .dialog-list-item-title { font-weight: bold; }
+ .dialog-list-item-description {
+ @extend %caption;
+ color: darken($fg_color, 5%);
+ }
+ }
+ }
+}
+
+// End session dialog
+
+.end-session-dialog {
+ min-width: 40em;
+
+ .dialog-content-box { spacing: 0; }
+
+ .dialog-list {
+ spacing: 0;
+
+ .dialog-list-title {
+ color: $warning_color;
+ background-color: tranparentize($warning_color, 0.9);
+ padding: $base_padding * 1.5;
+ border-radius: $osd_radius;
+ margin: $base_margin 0;
+ }
+ }
+}
+
+// message dialog
+
+.message-dialog-content {
+ spacing: $base_padding * 3;
+
+ .message-dialog-title {
+ text-align: center;
+ @extend %title_2;
+
+ &.lightweight { @extend %title_4; }
+ }
+
+ .message-dialog-description { text-align: center; }
+
+ .message-dialog-caption {
+ @extend %caption;
+ text-align: center;
+ }
+}
+
+// run dialog
+
+.run-dialog {
+
+ .dialog-content-box {
+ margin: $base_margin;
+ }
+
+ &-description {
+ @extend %caption;
+
+ text-align: center;
+ color: darken($fg_color, 20%);
+
+ &.error { color: $error_color; }
+ }
+
+ &-completion-box {
+ padding-top: $base_padding;
+ padding-left: $base_padding * 2;
+ }
+
+ &-entry {
+ @extend %entry;
+
+ width: 20em;
+ height: 1.2em;
+ }
+}
+
+// password or authentication dialog
+
+.prompt-dialog {
+ width: 28em;
+
+ .dialog-content-box {
+ spacing: $base_margin * 4;
+ margin-bottom: $base_margin * 3;
+ }
+
+ &-password-entry {
+ @extend %entry;
+ width: 20em;
+ }
+
+ &-password-layout { spacing: $base_margin * 2;}
+
+ &-error-label,
+ &-info-label,
+ &-null-label {
+ text-align: center;
+ @extend %caption;
+ }
+
+ &-error-label { color: $error_color; }
+}
+
+// polkit dialog
+
+.polkit-dialog {
+
+ &-user-layout {
+ text-align: center;
+ spacing: 2px;
+ }
+
+ &-user-combo {
+ @extend %flat_styled_button;
+ @extend %heading;
+
+ border-radius: $radius;
+ padding: $base_padding $base_padding * 6;
+
+ // special case the :insensitive button sinc we want
+ // the label to be the normal color when there are
+ // not multiple users
+ &:insensitive { color: $fg_color; }
+ }
+}
+
+// Audio selection dialog
+
+.audio-device-selection-dialog {
+ min-width: 24em;
+
+ .audio-selection-box {
+ spacing: $base_padding *2;
+
+ .audio-selection-device {
+ @extend %flat_styled_button;
+ border-radius: $osd_radius;
+
+ .audio-selection-device-box {
+ padding: $base_padding * 2;
+ spacing: $base_padding * 2;
+ }
+
+ .audio-selection-device-icon { icon-size: 64px;}
+ }
+ }
+}
+
+// various on screen popups
+
+%osd_base {
+ background-color: $bg_color;
+ border: 1px solid $borders_color;
+ border-radius: $osd_radius;
+ text-align: center;
+ padding: $base_padding * 4;
+}
+
+// media keys osd
+
+.media-keys-osd {
+ @extend %osd_base;
+ @extend %title_4;
+
+ margin-bottom: 1em;
+ border-radius: $osd_radius;
+ font-weight: bold;
+ spacing: $base_padding * 2;
+ padding: $base_padding * 2 $base_padding * 4;
+ & > * { spacing: $base_padding * 2; }
+
+ StIcon {
+ icon-size: 32px;
+ }
+
+ StLabel {
+ &:ltr { margin-right: $base_padding; }
+ &:rtl { margin-left: $base_padding; }
+ }
+
+ .level {
+ min-width: 160px;
+ -barlevel-height: 6px;
+ -barlevel-background-color: $bg_color2;
+ -barlevel-active-background-color: $fg_color;
+ -barlevel-amplify-color: $warning_color;
+ -barlevel-amplify-separator-width: $base_padding * 0.5;
+
+ &:ltr { margin-right: $base_padding; }
+ &:rtl { margin-left: $base_padding; }
+ }
+
+ .level-bar {
+ border-radius: $osd_radius;
+ background-color: $fg_color;
+ }
+}
+
+.info-osd {
+ @extend %osd_base;
+
+ font-size: 1.2em;
+ font-weight: 700;
+ text-align: center;
+}
+
+.workspace-switch-osd {
+ @extend %osd_base;
+ @extend %title_4;
+
+ min-width: 140px;
+ margin-bottom: 1em;
+ border-radius: $osd_radius;
+ font-weight: bold;
+ padding: $base_padding * 2 $base_padding * 6 0 $base_padding * 6;
+
+ &-indicator-box { spacing: $base_padding * 2; }
+
+ &-indicator {
+ background-color: transparentize($fg_color, 0.5);
+ padding: 3px;
+ margin: 15px;
+ border-radius: 36px;
+
+ &:active {
+ background-color: $accent_color;
+ padding: 6px;
+ margin: 12px;
+ }
+ }
+}
+
+.monitor-label {
+ border-radius: 0;
+ color: black;
+ padding: $base_padding * 2;
+ text-align: center;
+}
+
+// resize popup
+
+.resize-popup {
+ color: $fg_color;
+ background-color: $bg_color;
+ border-radius: $radius;
+ padding: $base_padding * 2;
+}
\ No newline at end of file
diff --git a/cinnamon-shell/upstream/sass/_drawing.scss b/cinnamon-shell/upstream/sass/_drawing.scss
index a3114af4ff..8ccb82a19e 100644
--- a/cinnamon-shell/upstream/sass/_drawing.scss
+++ b/cinnamon-shell/upstream/sass/_drawing.scss
@@ -9,15 +9,15 @@
@if $t==normal {
color: $text_color;
- background-color: $base_color;
+ background-color: $entry_bg;
border: 1px solid $entry_border;
box-shadow: inset 0 2px 4px transparentize($entry_bg, 0.95);
}
@if $t==focus {
color: $fg_color;
- background-color: $base_color;
- border: 1px solid $selected_bg_color;
+ background-color: $entry_bg;
+ border: 1px solid $accent_color;
box-shadow: inset 0 2px 4px transparentize($entry_bg, 0.95);
}
@@ -37,8 +37,8 @@
@if $t==osd-focus {
color: $selected_fg_color;
- background-color: $selected_bg_color;
- border: 1px solid $selected_bg_color;
+ background-color: $accent_color;
+ border: 1px solid $accent_color;
box-shadow: inset 0 2px 4px transparentize(black, 0.95);
}
@@ -73,7 +73,7 @@
//
color: $fg_color;
background-color: $button_bg;
- border: 1px solid $selected_bg_color;
+ border: 1px solid $accent_color;
box-shadow: inset 0 2px 4px transparentize($button_bg, 0.95);
}
@@ -83,7 +83,7 @@
//
color: $fg_color;
background-color: lighten($button_bg, 5%);
- border: 1px solid $selected_bg_color;
+ border: 1px solid $accent_color;
box-shadow: inset 0 2px 4px transparentize($button_bg, 0.95);
}
@@ -102,9 +102,9 @@
// pushed button
//
color: $selected_fg_color;
- background-color: $selected_bg_color;
- border: 1px solid $selected_bg_color;
- box-shadow: inset 0 2px 4px $selected_bg_color;
+ background-color: $accent_color;
+ border: 1px solid $accent_color;
+ box-shadow: inset 0 2px 4px $accent_color;
}
@else if $t==insensitive {
@@ -140,8 +140,8 @@
// active osd button
//
color: $selected_fg_color;
- border: 1px solid $selected_bg_color;
- background-color: $selected_bg_color;
+ border: 1px solid $accent_color;
+ background-color: $accent_color;
}
@else if $t==osd-insensitive {
diff --git a/cinnamon-shell/upstream/sass/_ibus-popup.scss b/cinnamon-shell/upstream/sass/_ibus-popup.scss
new file mode 100644
index 0000000000..21ce5cdec5
--- /dev/null
+++ b/cinnamon-shell/upstream/sass/_ibus-popup.scss
@@ -0,0 +1,44 @@
+// IBus Candidate Popup
+
+$popover_arrow_height: 6px;
+
+.candidate-popup-boxpointer {
+ -arrow-border-radius: $radius + 2px;
+ -arrow-background-color: $bg_color;
+ -arrow-border-width: 1px;
+ -arrow-border-color: $borders_color;
+ -arrow-base: $popover_arrow_height * 2;
+ -arrow-rise: $popover_arrow_height;
+ -arrow-box-shadow: 0 1px 3px rgba(0,0,0,0.5); // dreaming bugzilla #689995
+}
+
+.candidate-popup-content {
+ padding: 0.5em;
+ spacing: 0.3em;
+}
+
+.candidate-index {
+ padding: 0 0.5em 0 0;
+ color: darken($fg_color,10%);
+}
+
+.candidate-box {
+ padding: 0.3em 0.5em 0.3em 0.5em;
+ border-radius: $radius;
+ color: $fg_color;
+ &:selected,&:hover { background-color: $bg_color4; }
+}
+
+.candidate-page-button-box {
+ height: 2em;
+ .vertical & { padding-top: 0.5em; }
+ .horizontal & { padding-left: 0.5em; }
+}
+
+.candidate-page-button {
+ padding: 4px;
+}
+
+.candidate-page-button-previous { border-radius: $radius 0px 0px $radius; border-right-width: 0; }
+.candidate-page-button-next { border-radius: 0px $radius $radius 0px; }
+.candidate-page-button-icon { icon-size: 1em; }
\ No newline at end of file
diff --git a/cinnamon-shell/upstream/sass/_keyboard.scss b/cinnamon-shell/upstream/sass/_keyboard.scss
new file mode 100644
index 0000000000..1f4662b08f
--- /dev/null
+++ b/cinnamon-shell/upstream/sass/_keyboard.scss
@@ -0,0 +1,84 @@
+/*
+On-Screen Keyboard (>= Cinnamon 6.6)
+*/
+
+$key_border_radius: $radius;
+$default_key_bg_color: $bg_color2;
+$non_alpha_key_color: $bg_color4;
+$shifted_key_color: if($variant == 'light', darken($bg_color, 30%), lighten($bg_color, 25%));
+
+#virtual-keyboard {
+ background-color: $panel_bg;
+ box-shadow: inset 0 1px 0 0 $borders_color;
+}
+
+// the container for individual keys
+.vkeyboard-key-container {
+ padding: $base_margin;
+ spacing: $base_margin;
+}
+
+// the keys
+.vkeyboard-key {
+
+ @include button(normal);
+
+ &:focus { @include button(focus);}
+ &:hover, &:checked { @include button(hover);}
+ &:active { @include button(active); }
+
+ @include fontsize(20px);
+ border-width: 1px;
+ border-style: solid;
+ border-radius: $key_border_radius;
+
+ background-color: $default_key_bg_color;
+
+ &.shift-key-uppercase { background-color: $shifted_key_color }
+ &.enter-key {
+ @if $variant == 'light' {
+ border-color: $accent_color;
+ background-color: $non_alpha_key_color;
+ border-width: 3px;
+ } @else {
+ background-color: $accent_color;
+ }
+ }
+
+ &.shift-key-lowercase, &.escape-key, &.hide-key, &.non-alpha-key {
+ background-color: $non_alpha_key_color;
+ &:focus { @include button(focus);}
+ &:hover, &:checked { @include button(hover);}
+ &:active { @include button(active); }
+ }
+
+ &.modifier-key {
+ background-color: $non_alpha_key_color;
+
+ &:hover, &:checked { @include button(hover); }
+ &:latched {
+ background-color: $shifted_key_color;
+ }
+ }
+
+ StIcon { icon-size: 1.125em; }
+}
+
+// long press on a key popup
+.vkeyboard-subkeys {
+ color: $fg_color;
+ -arrow-border-radius: $radius + 2px;
+ -arrow-background-color: $bg_color;
+ -arrow-border-width: 1px;
+ -arrow-border-color: lighten($bg_color, 9%);
+ -arrow-base: 20px;
+ -arrow-rise: 10px;
+ -boxpointer-gap: $base_padding;
+}
+
+// suggestions
+.word-suggestions {
+ @include fontsize(18px);
+ spacing: 20px;
+ min-height: 20pt;
+}
diff --git a/cinnamon-shell/upstream/sass/cinnamon-dark.scss b/cinnamon-shell/upstream/sass/cinnamon-dark.scss
index 6e75827de5..e2d703c816 100644
--- a/cinnamon-shell/upstream/sass/cinnamon-dark.scss
+++ b/cinnamon-shell/upstream/sass/cinnamon-dark.scss
@@ -3,3 +3,7 @@ $variant: 'dark';
@import "_colors"; //use gtk colors
@import "_drawing";
@import "_common";
+@import "_dialogs"; // new in Cinnamon 6.4
+@import "_keyboard"; // new in Cinnamon 6.6
+@import "_ibus-popup"; // 6.6
+@import "_deprecated";
diff --git a/cinnamon-shell/upstream/sass/cinnamon.scss b/cinnamon-shell/upstream/sass/cinnamon.scss
index 83092862c0..89d571c714 100644
--- a/cinnamon-shell/upstream/sass/cinnamon.scss
+++ b/cinnamon-shell/upstream/sass/cinnamon.scss
@@ -3,3 +3,7 @@ $variant: 'light';
@import "_colors"; //use gtk colors
@import "_drawing";
@import "_common";
+@import "_dialogs"; // new in Cinnamon 6.4
+@import "_keyboard"; // new in Cinnamon 6.6
+@import "_ibus-popup"; // 6.6
+@import "_deprecated";