[gtk+] adwaita: Add some spacing to the scale value



commit 77769a52b3cc0b836b226457963d7b5fe92ee115
Author: Timm Bäder <mail baedert org>
Date:   Wed Jan 10 10:10:11 2018 +0100

    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.

 gtk/gtkscale.c                           |    3 ++-
 gtk/theme/Adwaita/_common.scss           |    6 ++++++
 gtk/theme/Adwaita/gtk-contained-dark.css |    8 ++++++++
 gtk/theme/Adwaita/gtk-contained.css      |    8 ++++++++
 4 files changed, 24 insertions(+), 1 deletions(-)
---
diff --git a/gtk/gtkscale.c b/gtk/gtkscale.c
index 9416515..1cf3361 100644
--- 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 db730b7..a73a025 100644
--- 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 f69cf9f..a62e678 100644
--- 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 f183493..32ece88 100644
--- 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; }


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]