BUGfix: GTK3&4 - calendar padding

thekomer · Feb 10, 2022 · 932c8b9 · 932c8b9
1 parent 3f94d17
commit 932c8b9
Show file tree

Hide file tree

Showing 6 changed files with 64 additions and 60 deletions.
diff --git a/gtk-3.0/gtk-dark.css b/gtk-3.0/gtk-dark.css
@@ -1188,7 +1188,7 @@ popover.background radiobutton,
 popover.background radiobutton:backdrop, modelbutton.flat:backdrop:hover, popover.background checkbutton:backdrop:hover,
 popover.background radiobutton:backdrop:hover,
 .menuitem.button.flat:backdrop,
-.menuitem.button.flat:backdrop:hover, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:disabled, button:link,
+.menuitem.button.flat:backdrop:hover, calendar.button, button:link,
 button:visited, button:link:hover, button:link:active, button:link:checked,
 button:visited:hover,
 button:visited:active,
@@ -1254,8 +1254,12 @@ notebook .linked > button, list .linked > button, .view .linked > button, iconvi
 * Calendar *
 ***********/
 calendar {
+  padding-left: 4px;
+  padding-right: 4px;
   color: #BFC3CD;
   border: 1px solid rgba(255, 255, 255, 0.05); }
+  calendar:disabled {
+    color: #676a75; }
   calendar:selected {
     color: white;
     border-radius: 1em;
@@ -1273,20 +1277,18 @@ calendar {
       box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98);
       color: inherit; }
   calendar.header {
-    border-bottom: 1px solid rgba(255, 255, 255, 0);
-    border-radius: 1px; }
-    calendar.header:backdrop {
-      border-color: rgba(255, 255, 255, 0); }
+    border-style: none none solid;
+    border-color: rgba(255, 255, 255, 0.05); }
   calendar.button {
-    color: rgba(191, 195, 205, 0.45); }
+    color: rgba(191, 195, 205, 0.7); }
     calendar.button:hover {
       color: #BFC3CD; }
     calendar.button:backdrop {
-      color: rgba(103, 106, 117, 0.45); }
+      color: rgba(103, 106, 117, 0.7); }
     calendar.button:disabled {
-      color: rgba(103, 106, 117, 0.45); }
+      color: rgba(103, 106, 117, 0.7); }
   calendar:indeterminate, calendar:indeterminate:backdrop {
-    color: alpha(currentColor,0.55); }
+    color: alpha(currentColor,0.7); }
   calendar.highlight, calendar.highlight:backdrop {
     font-size: smaller;
     color: #BFC3CD; }

diff --git a/gtk-3.0/gtk.css b/gtk-3.0/gtk.css
@@ -1188,7 +1188,7 @@ popover.background radiobutton,
 popover.background radiobutton:backdrop, modelbutton.flat:backdrop:hover, popover.background checkbutton:backdrop:hover,
 popover.background radiobutton:backdrop:hover,
 .menuitem.button.flat:backdrop,
-.menuitem.button.flat:backdrop:hover, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:disabled, button:link,
+.menuitem.button.flat:backdrop:hover, calendar.button, button:link,
 button:visited, button:link:hover, button:link:active, button:link:checked,
 button:visited:hover,
 button:visited:active,
@@ -1254,8 +1254,12 @@ notebook .linked > button, list .linked > button, .view .linked > button, iconvi
 * Calendar *
 ***********/
 calendar {
+  padding-left: 4px;
+  padding-right: 4px;
   color: #BFC3CD;
   border: 1px solid rgba(255, 255, 255, 0.05); }
+  calendar:disabled {
+    color: #676a75; }
   calendar:selected {
     color: white;
     border-radius: 1em;
@@ -1273,20 +1277,18 @@ calendar {
       box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98);
       color: inherit; }
   calendar.header {
-    border-bottom: 1px solid rgba(255, 255, 255, 0);
-    border-radius: 1px; }
-    calendar.header:backdrop {
-      border-color: rgba(255, 255, 255, 0); }
+    border-style: none none solid;
+    border-color: rgba(255, 255, 255, 0.05); }
   calendar.button {
-    color: rgba(191, 195, 205, 0.45); }
+    color: rgba(191, 195, 205, 0.7); }
     calendar.button:hover {
       color: #BFC3CD; }
     calendar.button:backdrop {
-      color: rgba(103, 106, 117, 0.45); }
+      color: rgba(103, 106, 117, 0.7); }
     calendar.button:disabled {
-      color: rgba(103, 106, 117, 0.45); }
+      color: rgba(103, 106, 117, 0.7); }
   calendar:indeterminate, calendar:indeterminate:backdrop {
-    color: alpha(currentColor,0.55); }
+    color: alpha(currentColor,0.7); }
   calendar.highlight, calendar.highlight:backdrop {
     font-size: smaller;
     color: #BFC3CD; }

diff --git a/gtk-3.0/widgets/_calendar.scss b/gtk-3.0/widgets/_calendar.scss
@@ -2,12 +2,14 @@
 * Calendar *
 ***********/
 calendar {
-	//padding: 0.2rem;
+	padding-left: 4px;
+	padding-right: 4px;
 	color: $text_color;
 	border: 1px solid $borders_color;
 
+	&:disabled { color: $insensitive_fg_color; }
+
 	&:selected {
-		//@extend %selected_items;
 		@include button(active-header);
 		font-weight: bold;
 		&:backdrop {
@@ -17,30 +19,26 @@ calendar {
 	}
 
 	&.header {
-		border-bottom: 1px solid transparentize($borders_color, 0.9);
-		border-radius: 1px;
-		&:backdrop { border-color: transparentize($borders_color, 0.9); }
+		border-style: none none solid;
+    border-color: $borders_color;
 	}
 
 	&.button {
 		@extend %undecorated_button;
-		color: transparentize($fg_color, 0.55);
+		color: transparentize($fg_color, 0.3);
 		&:hover {
-			@extend %undecorated_button;
 			color: $fg_color;
 		}
 		&:backdrop {
-			@extend %undecorated_button;
-			color: transparentize($backdrop_fg_color,0.55);
+			color: transparentize($backdrop_fg_color,0.3);
 		}
 		&:disabled {
-			@extend %undecorated_button;
-			color:  transparentize($insensitive_fg_color,0.55);
+			color:  transparentize($insensitive_fg_color,0.3);
 		}
 	}
 
 	&:indeterminate,
-	&:indeterminate:backdrop { color: gtkalpha(currentColor, 0.55); }
+	&:indeterminate:backdrop { color: gtkalpha(currentColor, 0.7); }
 
 	&.highlight,
 	&.highlight:backdrop {

diff --git a/gtk-4.0/gtk-dark.css b/gtk-4.0/gtk-dark.css
@@ -1173,7 +1173,7 @@ toolbar.inline-toolbar toolbutton:backdrop > button.flat:backdrop {
 modelbutton.flat,
 .menuitem.button.flat, modelbutton.flat:backdrop, modelbutton.flat:backdrop:hover,
 .menuitem.button.flat:backdrop,
-.menuitem.button.flat:backdrop:hover, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:disabled, button:link,
+.menuitem.button.flat:backdrop:hover, calendar.button, button:link,
 button:visited, button:link:hover, button:link:active, button:link:checked,
 button:visited:hover,
 button:visited:active,
@@ -1233,8 +1233,12 @@ notebook .linked > button, list .linked > button, .view .linked > button, iconvi
 * Calendar *
 ***********/
 calendar {
+  padding-left: 4px;
+  padding-right: 4px;
   color: #BFC3CD;
   border: 1px solid rgba(255, 255, 255, 0.05); }
+  calendar:disabled {
+    color: #676a75; }
   calendar:selected {
     border-radius: 1em;
     background: linear-gradient(to right, #ff3300, #ffa100);
@@ -1248,20 +1252,18 @@ calendar {
       box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98);
       color: inherit; }
   calendar.header {
-    border-bottom: 1px solid rgba(255, 255, 255, 0);
-    border-radius: 1px; }
-    calendar.header:backdrop {
-      border-color: rgba(255, 255, 255, 0); }
+    border-style: none none solid;
+    border-color: rgba(255, 255, 255, 0.05); }
   calendar.button {
-    color: rgba(191, 195, 205, 0.45); }
+    color: rgba(191, 195, 205, 0.7); }
     calendar.button:hover {
       color: #BFC3CD; }
     calendar.button:backdrop {
-      color: rgba(103, 106, 117, 0.45); }
+      color: rgba(103, 106, 117, 0.7); }
     calendar.button:disabled {
-      color: rgba(103, 106, 117, 0.45); }
+      color: rgba(103, 106, 117, 0.7); }
   calendar:indeterminate, calendar:indeterminate:backdrop {
-    color: alpha(currentColor,0.55); }
+    color: alpha(currentColor,0.7); }
   calendar.highlight, calendar.highlight:backdrop {
     font-size: smaller;
     color: #BFC3CD; }

diff --git a/gtk-4.0/gtk.css b/gtk-4.0/gtk.css
@@ -1173,7 +1173,7 @@ toolbar.inline-toolbar toolbutton:backdrop > button.flat:backdrop {
 modelbutton.flat,
 .menuitem.button.flat, modelbutton.flat:backdrop, modelbutton.flat:backdrop:hover,
 .menuitem.button.flat:backdrop,
-.menuitem.button.flat:backdrop:hover, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:disabled, button:link,
+.menuitem.button.flat:backdrop:hover, calendar.button, button:link,
 button:visited, button:link:hover, button:link:active, button:link:checked,
 button:visited:hover,
 button:visited:active,
@@ -1233,8 +1233,12 @@ notebook .linked > button, list .linked > button, .view .linked > button, iconvi
 * Calendar *
 ***********/
 calendar {
+  padding-left: 4px;
+  padding-right: 4px;
   color: #BFC3CD;
   border: 1px solid rgba(255, 255, 255, 0.05); }
+  calendar:disabled {
+    color: #676a75; }
   calendar:selected {
     border-radius: 1em;
     background: linear-gradient(to right, #ff3300, #ffa100);
@@ -1248,20 +1252,18 @@ calendar {
       box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98);
       color: inherit; }
   calendar.header {
-    border-bottom: 1px solid rgba(255, 255, 255, 0);
-    border-radius: 1px; }
-    calendar.header:backdrop {
-      border-color: rgba(255, 255, 255, 0); }
+    border-style: none none solid;
+    border-color: rgba(255, 255, 255, 0.05); }
   calendar.button {
-    color: rgba(191, 195, 205, 0.45); }
+    color: rgba(191, 195, 205, 0.7); }
     calendar.button:hover {
       color: #BFC3CD; }
     calendar.button:backdrop {
-      color: rgba(103, 106, 117, 0.45); }
+      color: rgba(103, 106, 117, 0.7); }
     calendar.button:disabled {
-      color: rgba(103, 106, 117, 0.45); }
+      color: rgba(103, 106, 117, 0.7); }
   calendar:indeterminate, calendar:indeterminate:backdrop {
-    color: alpha(currentColor,0.55); }
+    color: alpha(currentColor,0.7); }
   calendar.highlight, calendar.highlight:backdrop {
     font-size: smaller;
     color: #BFC3CD; }

diff --git a/gtk-4.0/widgets/_calendar.scss b/gtk-4.0/widgets/_calendar.scss
@@ -2,12 +2,14 @@
 * Calendar *
 ***********/
 calendar {
-	//padding: 0.2rem;
+	padding-left: 4px;
+	padding-right: 4px;
 	color: $text_color;
 	border: 1px solid $borders_color;
 
+	&:disabled { color: $insensitive_fg_color; }
+
 	&:selected {
-		//@extend %selected_items;
 		@include button(active-header);
 		font-weight: bold;
 		&:backdrop {
@@ -17,30 +19,26 @@ calendar {
 	}
 
 	&.header {
-		border-bottom: 1px solid transparentize($borders_color, 0.9);
-		border-radius: 1px;
-		&:backdrop { border-color: transparentize($borders_color, 0.9); }
+		border-style: none none solid;
+    border-color: $borders_color;
 	}
 
 	&.button {
 		@extend %undecorated_button;
-			color: transparentize($fg_color, 0.55);
+		color: transparentize($fg_color, 0.3);
 		&:hover {
-			@extend %undecorated_button;
 			color: $fg_color;
 		}
 		&:backdrop {
-			@extend %undecorated_button;
-			color: transparentize($backdrop_fg_color,0.55);
+			color: transparentize($backdrop_fg_color,0.3);
 		}
 		&:disabled {
-			@extend %undecorated_button;
-			color:  transparentize($insensitive_fg_color,0.55);
+			color:  transparentize($insensitive_fg_color,0.3);
 		}
 	}
 
 	&:indeterminate,
-	&:indeterminate:backdrop { color: gtkalpha(currentColor, 0.55); }
+	&:indeterminate:backdrop { color: gtkalpha(currentColor, 0.7); }
 
 	&.highlight,
 	&.highlight:backdrop {