[gtk/wip/jimmac/adwaita-3-32] Adwaita: Improve dropdown menu buttons



commit 7395160e5b43640f0ab6a0ef77568ebc948c0db0
Author: Alex Monday <monday15 gmx com>
Date:   Sat Dec 22 14:04:13 2018 +0500

    Adwaita: Improve dropdown menu buttons
    
    Improve overflow arrow buttons drawing on a scrollable dropdown menu:
    reduce top button's margin-top to match size of a bottom button, add
    margin-top for bottom button to compensate bottom margin (otherwise
    button overlaps with menu content).
    
    Closes https://gitlab.gnome.org/GNOME/gtk/issues/1539

 gtk/theme/Adwaita/_common.scss           | 3 ++-
 gtk/theme/Adwaita/gtk-contained-dark.css | 4 ++--
 gtk/theme/Adwaita/gtk-contained.css      | 4 ++--
 3 files changed, 6 insertions(+), 5 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 92897033ab..0b9ec56986 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -2204,7 +2204,7 @@ menu,
     border-radius: 0;
 
     &.top {
-      margin-top: -6px;
+      margin-top: -2px;
       border-bottom: 1px solid mix($fg_color, $base_color, 10%);
       border-top-right-radius: $menu_radius;
       border-top-left-radius: $menu_radius;
@@ -2212,6 +2212,7 @@ menu,
     }
 
     &.bottom {
+      margin-top: 4px;
       margin-bottom: -6px;
       border-top: 1px solid mix($fg_color, $base_color, 10%);
       border-bottom-right-radius: $menu_radius;
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index 42e8410100..11c49fd227 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -839,9 +839,9 @@ menu menuitem label:dir(rtl), menu menuitem label:dir(ltr), .menu menuitem label
 
 menu > arrow, .menu > arrow, .context-menu > arrow { border-color: transparent; background-color: 
transparent; background-image: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0); text-shadow: none; 
-gtk-icon-shadow: none; min-height: 16px; min-width: 16px; padding: 4px; background-color: #2f2f2f; 
border-radius: 0; }
 
-menu > arrow.top, .menu > arrow.top, .context-menu > arrow.top { margin-top: -6px; border-bottom: 1px solid 
#404040; border-top-right-radius: 5px; border-top-left-radius: 5px; -gtk-icon-source: 
-gtk-icontheme("pan-up-symbolic"); }
+menu > arrow.top, .menu > arrow.top, .context-menu > arrow.top { margin-top: -2px; border-bottom: 1px solid 
#404040; border-top-right-radius: 5px; border-top-left-radius: 5px; -gtk-icon-source: 
-gtk-icontheme("pan-up-symbolic"); }
 
-menu > arrow.bottom, .menu > arrow.bottom, .context-menu > arrow.bottom { margin-bottom: -6px; border-top: 
1px solid #404040; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -gtk-icon-source: 
-gtk-icontheme("pan-down-symbolic"); }
+menu > arrow.bottom, .menu > arrow.bottom, .context-menu > arrow.bottom { margin-top: 4px; margin-bottom: 
-6px; border-top: 1px solid #404040; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; 
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
 
 menu > arrow:hover, .menu > arrow:hover, .context-menu > arrow:hover { background-color: #404040; }
 
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index 38f369a118..b16ddb7520 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -847,9 +847,9 @@ menu menuitem label:dir(rtl), menu menuitem label:dir(ltr), .menu menuitem label
 
 menu > arrow, .menu > arrow, .context-menu > arrow { border-color: transparent; background-color: 
transparent; background-image: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0); text-shadow: none; 
-gtk-icon-shadow: none; min-height: 16px; min-width: 16px; padding: 4px; background-color: #ffffff; 
border-radius: 0; }
 
-menu > arrow.top, .menu > arrow.top, .context-menu > arrow.top { margin-top: -6px; border-bottom: 1px solid 
#eaebeb; border-top-right-radius: 5px; border-top-left-radius: 5px; -gtk-icon-source: 
-gtk-icontheme("pan-up-symbolic"); }
+menu > arrow.top, .menu > arrow.top, .context-menu > arrow.top { margin-top: -2px; border-bottom: 1px solid 
#eaebeb; border-top-right-radius: 5px; border-top-left-radius: 5px; -gtk-icon-source: 
-gtk-icontheme("pan-up-symbolic"); }
 
-menu > arrow.bottom, .menu > arrow.bottom, .context-menu > arrow.bottom { margin-bottom: -6px; border-top: 
1px solid #eaebeb; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -gtk-icon-source: 
-gtk-icontheme("pan-down-symbolic"); }
+menu > arrow.bottom, .menu > arrow.bottom, .context-menu > arrow.bottom { margin-top: 4px; margin-bottom: 
-6px; border-top: 1px solid #eaebeb; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; 
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
 
 menu > arrow:hover, .menu > arrow:hover, .context-menu > arrow:hover { background-color: #eaebeb; }
 


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