adwaita: Add some spacing to the scale value

So the slider does not overlap the value label. Since the value label is
allocated at the widget edge in gtk3, the correct fix here would
probably be to remove the 12px padding we apply to the entire scale and
instead apply it only to the trough.

diff --git a/gtk/gtkscale.c b/gtk/gtkscale.c
index 94165151b67c8c389476741c244d2d1a8b157936..1cf336154b40b6aa1ba8c241e0fe1e9973aed777 100644 (file)
--- a/gtk/gtkscale.c
+++ b/gtk/gtkscale.c
@@ -124,7 +124,8 @@
  * added depending on what marks are present.
  *
  * If the scale is displaying the value (see #GtkScale:draw-value), there is
- * subnode with name value.
+ * subnode with name value. This node will get the .top or .bottom style classes
+ * similar to the marks node.
  */
 
 

diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index db730b7eb4905dd849272519692f1d55b2f33364..a73a025925fda6feb45813a77a763295ee629731 100644 (file)
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -3055,6 +3055,9 @@ scale {
       }
     }
 
+    >value.top    { margin-bottom: 9px; }
+    >value.bottom { margin-top: 9px; }
+
     &.fine-tune indicator { min-height: ($_marks_length - 3px); }
   }
 
@@ -3071,6 +3074,9 @@ scale {
       }
     }
 
+    >value.top    { margin-bottom: 9px; }
+    >value.bottom { margin-top: 9px; }
+
     &.fine-tune indicator { min-width: ($_marks_length - 3px); }
   }
 

diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index f69cf9fae711dec1e71595a529a096cb10c823a1..a62e67840bd2e4e28104a7d81527b3658b366696 100644 (file)
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -1281,6 +1281,10 @@ scale.horizontal > marks.bottom { margin-top: 6px; }
 
 scale.horizontal > marks indicator { background-color: currentColor; min-height: 6px; min-width: 1px; }
 
+scale.horizontal > value.top { margin-bottom: 9px; }
+
+scale.horizontal > value.bottom { margin-top: 9px; }
+
 scale.horizontal.fine-tune indicator { min-height: 3px; }
 
 scale.vertical > marks { color: alpha(currentColor,0.55); }
@@ -1291,6 +1295,10 @@ scale.vertical > marks.bottom { margin-left: 6px; }
 
 scale.vertical > marks indicator { background-color: currentColor; min-height: 1px; min-width: 6px; }
 
+scale.vertical > value.top { margin-bottom: 9px; }
+
+scale.vertical > value.bottom { margin-top: 9px; }
+
 scale.vertical.fine-tune indicator { min-width: 3px; }
 
 scale.horizontal.marks-before:not(.marks-after) slider { margin: -10px; border-style: none; border-radius: 0; background-color: transparent; background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-dark.png"), url("assets/slider-horz-scale-has-marks-above-dark@2.png")); min-height: 26px; min-width: 22px; margin-top: -14px; background-position: top; background-repeat: no-repeat; box-shadow: none; }

diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index f1834931fb3d7258bc6b993316d35a2a24363f48..32ece88c2b38b92d783a641d30fef2381643ac12 100644 (file)
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -1301,6 +1301,10 @@ scale.horizontal > marks.bottom { margin-top: 6px; }
 
 scale.horizontal > marks indicator { background-color: currentColor; min-height: 6px; min-width: 1px; }
 
+scale.horizontal > value.top { margin-bottom: 9px; }
+
+scale.horizontal > value.bottom { margin-top: 9px; }
+
 scale.horizontal.fine-tune indicator { min-height: 3px; }
 
 scale.vertical > marks { color: alpha(currentColor,0.55); }
@@ -1311,6 +1315,10 @@ scale.vertical > marks.bottom { margin-left: 6px; }
 
 scale.vertical > marks indicator { background-color: currentColor; min-height: 1px; min-width: 6px; }
 
+scale.vertical > value.top { margin-bottom: 9px; }
+
+scale.vertical > value.bottom { margin-top: 9px; }
+
 scale.vertical.fine-tune indicator { min-width: 3px; }
 
 scale.horizontal.marks-before:not(.marks-after) slider { margin: -10px; border-style: none; border-radius: 0; background-color: transparent; background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above.png"), url("assets/slider-horz-scale-has-marks-above@2.png")); min-height: 26px; min-width: 22px; margin-top: -14px; background-position: top; background-repeat: no-repeat; box-shadow: none; }