[gtk/wip/jimmac/larger-scrollbars: 1180/1180] Adwaita: make scrollbars larger




commit d13b9f797ae1389655391224e4e4af9c5d93ed73
Author: Jakub Steiner <jimmac gmail com>
Date:   Tue May 14 15:30:55 2019 +0200

    Adwaita: make scrollbars larger
    
    When using scrollbars as active controls, rather than their primary role as indicators,
    increase their size as click targets.
    
    Fixes https://gitlab.gnome.org/GNOME/gtk/issues/1886

 gtk/theme/Adwaita/_common.scss           | 14 +++++++-------
 gtk/theme/Adwaita/gtk-contained-dark.css |  8 ++++----
 gtk/theme/Adwaita/gtk-contained.css      |  8 ++++----
 3 files changed, 15 insertions(+), 15 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index fd993fc088..01d1dc9324 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -2664,11 +2664,11 @@ scrollbar {
 
   // slider
   slider {
-    min-width: 6px;
-    min-height: 6px;
+    min-width: 10px;
+    min-height: 10px;
     margin: -1px;
     border: 4px solid transparent;
-    border-radius: 8px;
+    border-radius: 10px;
     background-clip: padding-box;
     background-color: $scrollbar_slider_color;
 
@@ -2683,12 +2683,12 @@ scrollbar {
 
   &.fine-tune {
     slider {
-      min-width: 4px;
-      min-height: 4px;
+      min-width: 6px;
+      min-height: 6px;
     }
 
-    &.horizontal slider { border-width: 5px 4px; }
-    &.vertical slider { border-width: 4px 5px; }
+    &.horizontal slider { border-width: 6px 4px; }
+    &.vertical slider { border-width: 4px 6px; }
   }
 
   &.overlay-indicator {
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index 00b0f57dbe..c10e35b9a2 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -984,7 +984,7 @@ scrollbar.right { border-left: 1px solid #1b1b1b; }
 
 scrollbar:backdrop { background-color: #2d2d2d; border-color: #202020; transition: 200ms ease-out; }
 
-scrollbar slider { min-width: 6px; min-height: 6px; margin: -1px; border: 4px solid transparent; 
border-radius: 8px; background-clip: padding-box; background-color: #a4a4a3; }
+scrollbar slider { min-width: 10px; min-height: 10px; margin: -1px; border: 4px solid transparent; 
border-radius: 10px; background-clip: padding-box; background-color: #a4a4a3; }
 
 scrollbar slider:hover { background-color: #c9c9c7; }
 
@@ -994,11 +994,11 @@ scrollbar slider:backdrop { background-color: #5a5a59; }
 
 scrollbar slider:disabled { background-color: transparent; }
 
-scrollbar.fine-tune slider { min-width: 4px; min-height: 4px; }
+scrollbar.fine-tune slider { min-width: 6px; min-height: 6px; }
 
-scrollbar.fine-tune.horizontal slider { border-width: 5px 4px; }
+scrollbar.fine-tune.horizontal slider { border-width: 6px 4px; }
 
-scrollbar.fine-tune.vertical slider { border-width: 4px 5px; }
+scrollbar.fine-tune.vertical slider { border-width: 4px 6px; }
 
 scrollbar.overlay-indicator:not(.dragging):not(.hovering) { border-color: transparent; opacity: 0.4; 
background-color: transparent; }
 
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index e7098f5bcb..3b4f3dd966 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -992,7 +992,7 @@ scrollbar.right { border-left: 1px solid #cdc7c2; }
 
 scrollbar:backdrop { background-color: #efedec; border-color: #d5d0cc; transition: 200ms ease-out; }
 
-scrollbar slider { min-width: 6px; min-height: 6px; margin: -1px; border: 4px solid transparent; 
border-radius: 8px; background-clip: padding-box; background-color: #7e8182; }
+scrollbar slider { min-width: 10px; min-height: 10px; margin: -1px; border: 4px solid transparent; 
border-radius: 10px; background-clip: padding-box; background-color: #7e8182; }
 
 scrollbar slider:hover { background-color: #565b5c; }
 
@@ -1002,11 +1002,11 @@ scrollbar slider:backdrop { background-color: #cecfce; }
 
 scrollbar slider:disabled { background-color: transparent; }
 
-scrollbar.fine-tune slider { min-width: 4px; min-height: 4px; }
+scrollbar.fine-tune slider { min-width: 6px; min-height: 6px; }
 
-scrollbar.fine-tune.horizontal slider { border-width: 5px 4px; }
+scrollbar.fine-tune.horizontal slider { border-width: 6px 4px; }
 
-scrollbar.fine-tune.vertical slider { border-width: 4px 5px; }
+scrollbar.fine-tune.vertical slider { border-width: 4px 6px; }
 
 scrollbar.overlay-indicator:not(.dragging):not(.hovering) { border-color: transparent; opacity: 0.4; 
background-color: transparent; }
 


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