Improvement: Cinnamon - Use em for spacing of the calendar dots

thekomer · Jan 9, 2022 · aba64e1 · aba64e1
1 parent ac62a7f
commit aba64e1
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 18 deletions.
diff --git a/cinnamon/cinnamon.css b/cinnamon/cinnamon.css
@@ -19,37 +19,37 @@ stage {
 /* * * * * *
  * Buttons *
  * * * * * */
-.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 {
+.popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button, .notification-button, .notification-icon-button, .modal-dialog-button-box .modal-dialog-button, .sound-button {
   min-height: 20px;
   padding: 5px 32px;
   transition-duration: 0;
   color: #BFC3CD;
   background-color: #161b2e;
   border: 1px solid #040508;
   box-shadow: inset 0 2px 4px rgba(22, 27, 46, 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 {
+  .popup-menu #notification .notification-button, .popup-menu #notification .notification-icon-button, .notification-button, .notification-icon-button, .modal-dialog-button-box .modal-dialog-button, .sound-button, .popup-menu #notification .notification-button:focus, .popup-menu #notification .notification-icon-button:focus, .notification-button:focus, .notification-icon-button:focus, .modal-dialog-button-box .modal-dialog-button:focus, .sound-button:focus, .popup-menu #notification .notification-button:hover, .popup-menu #notification .notification-icon-button:hover, .notification-button:hover, .notification-icon-button:hover, .modal-dialog-button-box .modal-dialog-button:hover, .sound-button:hover, .popup-menu #notification .notification-button:hover:focus, .popup-menu #notification .notification-icon-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, .modal-dialog-button-box .modal-dialog-button:hover:focus, .sound-button:hover:focus, .popup-menu #notification .notification-button:active, .popup-menu #notification .notification-icon-button:active, .notification-button:active, .notification-icon-button:active, .modal-dialog-button-box .modal-dialog-button:active, .sound-button:active, .popup-menu #notification .notification-button:active:focus, .popup-menu #notification .notification-icon-button:active:focus, .notification-button:active:focus, .notification-icon-button:active:focus, .modal-dialog-button-box .modal-dialog-button:active:focus, .sound-button:active:focus, .popup-menu #notification .notification-button:insensitive, .popup-menu #notification .notification-icon-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, .modal-dialog-button-box .modal-dialog-button:insensitive, .sound-button:insensitive {
     border-radius: 0.5em; }
-  .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 {
+  .popup-menu #notification .notification-button:focus, .popup-menu #notification .notification-icon-button:focus, .notification-button:focus, .notification-icon-button:focus, .modal-dialog-button-box .modal-dialog-button:focus, .sound-button:focus {
     color: #BFC3CD;
     background-color: #161b2e;
     border: 1px solid #ff6a00;
     box-shadow: inset 0 2px 4px rgba(22, 27, 46, 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 {
+  .popup-menu #notification .notification-button:hover, .popup-menu #notification .notification-icon-button:hover, .notification-button:hover, .notification-icon-button:hover, .modal-dialog-button-box .modal-dialog-button:hover, .sound-button:hover {
     color: #BFC3CD;
     background-color: #1f253f;
     border: 1px solid #040508;
     box-shadow: inset 0 2px 4px rgba(31, 37, 63, 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 {
+  .popup-menu #notification .notification-button:hover:focus, .popup-menu #notification .notification-icon-button:hover:focus, .notification-button:hover:focus, .notification-icon-button:hover:focus, .modal-dialog-button-box .modal-dialog-button:hover:focus, .sound-button:hover:focus {
     color: #BFC3CD;
     background-color: #1f253f;
     border: 1px solid #ff6a00;
     box-shadow: inset 0 2px 4px rgba(22, 27, 46, 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 {
+  .popup-menu #notification .notification-button:active, .popup-menu #notification .notification-icon-button:active, .notification-button:active, .notification-icon-button:active, .modal-dialog-button-box .modal-dialog-button:active, .sound-button:active, .popup-menu #notification .notification-button:active:focus, .popup-menu #notification .notification-icon-button:active:focus, .notification-button:active:focus, .notification-icon-button:active:focus, .modal-dialog-button-box .modal-dialog-button:active:focus, .sound-button:active:focus {
     color: #fefefe;
     background-color: #ff6a00;
     border: 1px solid #ff6a00;
     box-shadow: inset 0 2px 4px #ff6a00; }
-  .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 {
+  .popup-menu #notification .notification-button:insensitive, .popup-menu #notification .notification-icon-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, .modal-dialog-button-box .modal-dialog-button:insensitive, .sound-button:insensitive {
     color: rgba(191, 195, 205, 0.45);
     border: 1px solid rgba(4, 5, 8, 0.55);
     background-color: rgba(22, 27, 46, 0.55);
@@ -58,7 +58,7 @@ stage {
 /* * * * * *
  * Entries *
  * * * * * */
-#menu-search-entry, .popup-menu #notification StEntry {
+.popup-menu #notification StEntry, #menu-search-entry {
   padding: 7px;
   caret-size: 1px;
   selection-background-color: #ff6a00;
@@ -69,17 +69,17 @@ stage {
   background-color: #131727;
   border: 1px solid #040508;
   box-shadow: inset 0 2px 4px rgba(19, 23, 39, 0.05); }
-  #menu-search-entry:focus, .popup-menu #notification StEntry:focus, #menu-search-entry:hover, .popup-menu #notification StEntry:hover {
+  .popup-menu #notification StEntry:focus, #menu-search-entry:focus, .popup-menu #notification StEntry:hover, #menu-search-entry:hover {
     color: #BFC3CD;
     background-color: #131727;
     border: 1px solid #ff6a00;
     box-shadow: inset 0 2px 4px rgba(19, 23, 39, 0.05); }
-  #menu-search-entry:insensitive, .popup-menu #notification StEntry:insensitive {
+  .popup-menu #notification StEntry:insensitive, #menu-search-entry:insensitive {
     color: rgba(191, 195, 205, 0.45);
     background-color: #111423;
     border-color: 1px solid #090a12;
     box-shadow: inset 0 2px 4px rgba(17, 20, 35, 0.05); }
-  #menu-search-entry StIcon.capslock-warning, .popup-menu #notification StEntry StIcon.capslock-warning {
+  .popup-menu #notification StEntry StIcon.capslock-warning, #menu-search-entry StIcon.capslock-warning {
     icon-size: 16px;
     warning-color: #cc5500;
     padding: 0 4px; }
@@ -798,7 +798,7 @@ StScrollBar {
       background-image: url("common-assets/misc/calendar-arrow-left.svg"); }
 
 .calendar-day-event-dot-box {
-  margin-top: 22px;
+  margin-top: 1.7em;
   max-rows: 1; }
 
 .calendar-day-event-dot {
@@ -1631,7 +1631,8 @@ StScrollBar {
 .workspace-switcher {
   padding-left: 3px;
   padding-right: 3px; }
-  .panel-left .workspace-switcher, .panel-right .workspace-switcher {
+  .panel-left .workspace-switcher,
+  .panel-right .workspace-switcher {
     padding: 0; }
 
 .workspace-button {
@@ -1770,14 +1771,18 @@ StScrollBar {
 .applet-label {
   font-weight: bold;
   color: #BFC3CD; }
-  .applet-label:hover, .applet-label:checked, .applet-box:hover > .applet-label, .applet-box:checked > .applet-label {
+  .applet-label:hover, .applet-label:checked,
+  .applet-box:hover > .applet-label,
+  .applet-box:checked > .applet-label {
     color: #fefefe;
     text-shadow: none; }
 
 .applet-icon {
   color: #BFC3CD;
   icon-size: 22px; }
-  .applet-icon:hover, .applet-icon:checked, .applet-box:hover > .applet-icon, .applet-box:checked > .applet-icon {
+  .applet-icon:hover, .applet-icon:checked,
+  .applet-box:hover > .applet-icon,
+  .applet-box:checked > .applet-icon {
     color: #fefefe;
     text-shadow: none; }
 

diff --git a/cinnamon/sass/_common.scss b/cinnamon/sass/_common.scss
@@ -947,7 +947,7 @@ StScrollBar {
 }
 
 .calendar-day-event-dot-box {
-	margin-top: 22px;
+	margin-top: 1.7em;
 	max-rows: 1;
 }
 

diff --git a/gtk-3.0/gtk-dark.css b/gtk-3.0/gtk-dark.css
@@ -3104,7 +3104,8 @@ menuitem radio {
 .content-view {
   background-color: #020305; }
   .content-view:hover {
-    -gtk-icon-effect: highlight; }
+    -gtk-icon-effect: highlight;
+    color: #ff6a00; }
   .content-view:backdrop {
     background-color: #020305; }
 

diff --git a/gtk-3.0/gtk.css b/gtk-3.0/gtk.css
@@ -3104,7 +3104,8 @@ menuitem radio {
 .content-view {
   background-color: #020305; }
   .content-view:hover {
-    -gtk-icon-effect: highlight; }
+    -gtk-icon-effect: highlight;
+    color: #ff6a00; }
   .content-view:backdrop {
     background-color: #020305; }