[gtk/gtk-3-24: 1/2] themes: Optimize code for marks margins on scales

[Matthias Clasen <matthiasc src gnome org>]

commit deba92f7293e794753fb64a1698c68f67917d965
Author: Alex Monday <monday15 gmx com>
Date:   Sat Mar 2 14:08:11 2019 +0500

    themes: Optimize code for marks margins on scales
    
    Separate marks margins for horizontal/vertical scales. Prevents
    generation of unused margins.
    
    Closes https://gitlab.gnome.org/GNOME/gtk/issues/1703

 gtk/theme/Adwaita/_common.scss                   | 21 ++++++++-------------
 gtk/theme/Adwaita/gtk-contained-dark.css         | 20 +++++++++-----------
 gtk/theme/Adwaita/gtk-contained.css              | 20 +++++++++-----------
 gtk/theme/HighContrast/_common.scss              | 22 +++++++++-------------
 gtk/theme/HighContrast/gtk-contained-inverse.css | 20 +++++++++-----------
 gtk/theme/HighContrast/gtk-contained.css         | 20 +++++++++-----------
 6 files changed, 53 insertions(+), 70 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 1cb2c7da66..3b280b54a9 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -3229,27 +3229,22 @@ scale {
     }
   }
 
+  marks,
   value { color: gtkalpha(currentColor, 0.55); }
 
-  marks {
-    color: gtkalpha(currentColor, 0.55);
-
-    @each $marks_class, $marks_pos, $marks_margin in (top, top, bottom),
-                                                     (bottom, bottom, top),
-                                                     (top, left, right),
-                                                     (bottom, right, left) {
+  //marks margins
+  @each $scale_orient, $marks_class, $marks_pos, $marks_margin in (horizontal, top, top, bottom),
+                                                                  (horizontal, bottom, bottom, top),
+                                                                  (vertical, top, left, right),
+                                                                  (vertical, bottom, right, left) {
+    &.#{$scale_orient} marks {
       &.#{$marks_class} {
         margin-#{$marks_margin}: $_marks_distance;
         margin-#{$marks_pos}: -($_marks_distance + $_marks_length);
       }
     }
-  }
 
-  &.fine-tune marks {
-    @each $marks_class, $marks_pos, $marks_margin in (top, top, bottom),
-                                                     (bottom, bottom, top),
-                                                     (top, left, right),
-                                                     (bottom, right, left) {
+    &.#{$scale_orient}.fine-tune marks {
       &.#{$marks_class} {
         margin-#{$marks_margin}: $_marks_distance;
         margin-#{$marks_pos}: -($_marks_distance + $_marks_length - 3px);
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index c2d39a52c9..31420f164b 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -1293,25 +1293,23 @@ row:selected scale slider:disabled, row:selected scale slider { border-color: #0
 
 .osd scale slider:backdrop:disabled { background-color: #24212a; }
 
-scale value { color: alpha(currentColor,0.55); }
+scale marks, scale value { color: alpha(currentColor,0.55); }
 
-scale marks { color: alpha(currentColor,0.55); }
+scale.horizontal marks.top { margin-bottom: 6px; margin-top: -12px; }
 
-scale marks.top { margin-bottom: 6px; margin-top: -12px; }
+scale.horizontal.fine-tune marks.top { margin-bottom: 6px; margin-top: -9px; }
 
-scale marks.bottom { margin-top: 6px; margin-bottom: -12px; }
+scale.horizontal marks.bottom { margin-top: 6px; margin-bottom: -12px; }
 
-scale marks.top { margin-right: 6px; margin-left: -12px; }
+scale.horizontal.fine-tune marks.bottom { margin-top: 6px; margin-bottom: -9px; }
 
-scale marks.bottom { margin-left: 6px; margin-right: -12px; }
+scale.vertical marks.top { margin-right: 6px; margin-left: -12px; }
 
-scale.fine-tune marks.top { margin-bottom: 6px; margin-top: -9px; }
+scale.vertical.fine-tune marks.top { margin-right: 6px; margin-left: -9px; }
 
-scale.fine-tune marks.bottom { margin-top: 6px; margin-bottom: -9px; }
+scale.vertical marks.bottom { margin-left: 6px; margin-right: -12px; }
 
-scale.fine-tune marks.top { margin-right: 6px; margin-left: -9px; }
-
-scale.fine-tune marks.bottom { margin-left: 6px; margin-right: -9px; }
+scale.vertical.fine-tune marks.bottom { margin-left: 6px; margin-right: -9px; }
 
 scale.horizontal indicator { min-height: 6px; min-width: 1px; }
 
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index 1b20d3812f..e8392bda34 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -1313,25 +1313,23 @@ row:selected scale slider:disabled, row:selected scale slider { border-color: #1
 
 .osd scale slider:backdrop:disabled { background-color: #24212a; }
 
-scale value { color: alpha(currentColor,0.55); }
+scale marks, scale value { color: alpha(currentColor,0.55); }
 
-scale marks { color: alpha(currentColor,0.55); }
+scale.horizontal marks.top { margin-bottom: 6px; margin-top: -12px; }
 
-scale marks.top { margin-bottom: 6px; margin-top: -12px; }
+scale.horizontal.fine-tune marks.top { margin-bottom: 6px; margin-top: -9px; }
 
-scale marks.bottom { margin-top: 6px; margin-bottom: -12px; }
+scale.horizontal marks.bottom { margin-top: 6px; margin-bottom: -12px; }
 
-scale marks.top { margin-right: 6px; margin-left: -12px; }
+scale.horizontal.fine-tune marks.bottom { margin-top: 6px; margin-bottom: -9px; }
 
-scale marks.bottom { margin-left: 6px; margin-right: -12px; }
+scale.vertical marks.top { margin-right: 6px; margin-left: -12px; }
 
-scale.fine-tune marks.top { margin-bottom: 6px; margin-top: -9px; }
+scale.vertical.fine-tune marks.top { margin-right: 6px; margin-left: -9px; }
 
-scale.fine-tune marks.bottom { margin-top: 6px; margin-bottom: -9px; }
+scale.vertical marks.bottom { margin-left: 6px; margin-right: -12px; }
 
-scale.fine-tune marks.top { margin-right: 6px; margin-left: -9px; }
-
-scale.fine-tune marks.bottom { margin-left: 6px; margin-right: -9px; }
+scale.vertical.fine-tune marks.bottom { margin-left: 6px; margin-right: -9px; }
 
 scale.horizontal indicator { min-height: 6px; min-width: 1px; }
 
diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss
index dc60321644..57fb694411 100644
--- a/gtk/theme/HighContrast/_common.scss
+++ b/gtk/theme/HighContrast/_common.scss
@@ -2509,33 +2509,29 @@ scale {
     }
   }
 
+  marks,
   value { color: gtkalpha(currentColor, 0.4); }
 
-  marks {
-    color: gtkalpha(currentColor, 0.4);
-
-    @each $marks_class, $marks_pos, $marks_margin in (top, top, bottom),
-                                                     (bottom, bottom, top),
-                                                     (top, left, right),
-                                                     (bottom, right, left) {
+  //marks margins
+  @each $scale_orient, $marks_class, $marks_pos, $marks_margin in (horizontal, top, top, bottom),
+                                                                  (horizontal, bottom, bottom, top),
+                                                                  (vertical, top, left, right),
+                                                                  (vertical, bottom, right, left) {
+    &.#{$scale_orient} marks {
       &.#{$marks_class} {
         margin-#{$marks_margin}: $_marks_distance;
         margin-#{$marks_pos}: -($_marks_distance + $_marks_length);
       }
     }
-  }
 
-  &.fine-tune marks {
-    @each $marks_class, $marks_pos, $marks_margin in (top, top, bottom),
-                                                     (bottom, bottom, top),
-                                                     (top, left, right),
-                                                     (bottom, right, left) {
+    &.#{$scale_orient}.fine-tune marks {
       &.#{$marks_class} {
         margin-#{$marks_margin}: $_marks_distance;
         margin-#{$marks_pos}: -($_marks_distance + $_marks_length - 3px);
       }
     }
   }
+
   &.horizontal {
     indicator {
       min-height: $_marks_length;
diff --git a/gtk/theme/HighContrast/gtk-contained-inverse.css 
b/gtk/theme/HighContrast/gtk-contained-inverse.css
index 2eed2934bd..e2d4b6ef40 100644
--- a/gtk/theme/HighContrast/gtk-contained-inverse.css
+++ b/gtk/theme/HighContrast/gtk-contained-inverse.css
@@ -1080,25 +1080,23 @@ row:selected scale slider, row:selected scale slider:disabled { border-color: #a
 
 .osd scale slider:backdrop:disabled { border-width: 2px; border-style: solid; }
 
-scale value { color: alpha(currentColor,0.4); }
+scale marks, scale value { color: alpha(currentColor,0.4); }
 
-scale marks { color: alpha(currentColor,0.4); }
+scale.horizontal marks.top { margin-bottom: 6px; margin-top: -12px; }
 
-scale marks.top { margin-bottom: 6px; margin-top: -12px; }
+scale.horizontal.fine-tune marks.top { margin-bottom: 6px; margin-top: -9px; }
 
-scale marks.bottom { margin-top: 6px; margin-bottom: -12px; }
+scale.horizontal marks.bottom { margin-top: 6px; margin-bottom: -12px; }
 
-scale marks.top { margin-right: 6px; margin-left: -12px; }
+scale.horizontal.fine-tune marks.bottom { margin-top: 6px; margin-bottom: -9px; }
 
-scale marks.bottom { margin-left: 6px; margin-right: -12px; }
+scale.vertical marks.top { margin-right: 6px; margin-left: -12px; }
 
-scale.fine-tune marks.top { margin-bottom: 6px; margin-top: -9px; }
+scale.vertical.fine-tune marks.top { margin-right: 6px; margin-left: -9px; }
 
-scale.fine-tune marks.bottom { margin-top: 6px; margin-bottom: -9px; }
+scale.vertical marks.bottom { margin-left: 6px; margin-right: -12px; }
 
-scale.fine-tune marks.top { margin-right: 6px; margin-left: -9px; }
-
-scale.fine-tune marks.bottom { margin-left: 6px; margin-right: -9px; }
+scale.vertical.fine-tune marks.bottom { margin-left: 6px; margin-right: -9px; }
 
 scale.horizontal indicator { min-height: 6px; min-width: 1px; }
 
diff --git a/gtk/theme/HighContrast/gtk-contained.css b/gtk/theme/HighContrast/gtk-contained.css
index e6552a5f46..c204aab0c9 100644
--- a/gtk/theme/HighContrast/gtk-contained.css
+++ b/gtk/theme/HighContrast/gtk-contained.css
@@ -1086,25 +1086,23 @@ row:selected scale slider, row:selected scale slider:disabled { border-color: #0
 
 .osd scale slider:backdrop:disabled { border-width: 2px; border-style: solid; }
 
-scale value { color: alpha(currentColor,0.4); }
+scale marks, scale value { color: alpha(currentColor,0.4); }
 
-scale marks { color: alpha(currentColor,0.4); }
+scale.horizontal marks.top { margin-bottom: 6px; margin-top: -12px; }
 
-scale marks.top { margin-bottom: 6px; margin-top: -12px; }
+scale.horizontal.fine-tune marks.top { margin-bottom: 6px; margin-top: -9px; }
 
-scale marks.bottom { margin-top: 6px; margin-bottom: -12px; }
+scale.horizontal marks.bottom { margin-top: 6px; margin-bottom: -12px; }
 
-scale marks.top { margin-right: 6px; margin-left: -12px; }
+scale.horizontal.fine-tune marks.bottom { margin-top: 6px; margin-bottom: -9px; }
 
-scale marks.bottom { margin-left: 6px; margin-right: -12px; }
+scale.vertical marks.top { margin-right: 6px; margin-left: -12px; }
 
-scale.fine-tune marks.top { margin-bottom: 6px; margin-top: -9px; }
+scale.vertical.fine-tune marks.top { margin-right: 6px; margin-left: -9px; }
 
-scale.fine-tune marks.bottom { margin-top: 6px; margin-bottom: -9px; }
+scale.vertical marks.bottom { margin-left: 6px; margin-right: -12px; }
 
-scale.fine-tune marks.top { margin-right: 6px; margin-left: -9px; }
-
-scale.fine-tune marks.bottom { margin-left: 6px; margin-right: -9px; }
+scale.vertical.fine-tune marks.bottom { margin-left: 6px; margin-right: -9px; }
 
 scale.horizontal indicator { min-height: 6px; min-width: 1px; }