[gtk+] Adwaita: correctly style arrows wrt tab position

[Lapo Calamandrei <lapo src gnome org>]

commit d26801c92309ea9bf9dfb4e755ae5e8db80b4cce
Author: Lapo Calamandrei <calamandrei gmail com>
Date:   Mon Feb 15 18:39:50 2016 +0100

    Adwaita: correctly style arrows wrt tab position

 gtk/theme/Adwaita/_common.scss           |   55 ++++++++++++++++++++++++------
 gtk/theme/Adwaita/gtk-contained-dark.css |   39 +++++++++++++++------
 gtk/theme/Adwaita/gtk-contained.css      |   39 +++++++++++++++------
 3 files changed, 100 insertions(+), 33 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 7eb7b20..781f2c5 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -1854,24 +1854,61 @@ notebook {
       }
     }
 
+    &.top > tabs > arrow {
+      @extend %notebook_vert_arrows;
+      border-top-style: none;
+    }
+
+    &.bottom > tabs > arrow {
+      @extend %notebook_vert_arrows;
+      border-bottom-style: none;
+    }
+
+    @at-root %notebook_vert_arrows {
+      margin-left: -5px;
+      margin-right: -5px;
+      padding-left: 4px;
+      padding-right: 4px;
+
+      &.down { -gtk-icon-source: -gtk-icontheme('pan-start-symbolic'); }
+
+      &.up { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic'); }
+    }
+
+    &.left > tabs > arrow {
+      @extend %notebook_horz_arrows;
+      border-left-style: none;
+    }
+
+    &.right > tabs > arrow {
+      @extend %notebook_horz_arrows;
+      border-right-style: none;
+    }
+
+    @at-root %notebook_horz_arrows {
+      margin-top: -5px;
+      margin-bottom: -5px;
+      padding-top: 4px;
+      padding-bottom: 4px;
+
+      &.down { -gtk-icon-source: -gtk-icontheme('pan-up-symbolic'); }
+
+      &.up { -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); }
+    }
+
     > tabs > arrow {
       @extend %button_basic;
       @extend button.flat;
 
       min-height: 16px;
       min-width: 16px;
-      margin-left: -5px;
-      margin-right: -5px;
-      padding-left: 4px;
-      padding-right: 4px;
-      border-top-style: none;
       border-radius: 0;
 
       &:hover:not(:active):not(:backdrop) {
+        background-clip: padding-box;
         background-image: none;
         background-color: transparentize(white, 0.7);
-        border-left-color: transparent;
-        border-right-color: transparent;
+        border-color: transparent;
         box-shadow: none;
       }
 
@@ -1880,10 +1917,6 @@ notebook {
         background-color: transparent;
         border-color: transparent;
       }
-
-      &.down { -gtk-icon-source: -gtk-icontheme('pan-start-symbolic'); }
-
-      &.up { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic'); }
     }
 
     tab {
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index 3bde8fd..c422186 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -2192,29 +2192,46 @@ notebook > header {
         box-shadow: none; }
       notebook > header.right > tabs > tab:active {
         box-shadow: inset 3px 0 #215d9c; }
-  notebook > header > tabs > arrow {
-    min-height: 16px;
-    min-width: 16px;
+  notebook > header.top > tabs > arrow {
+    border-top-style: none; }
+  notebook > header.bottom > tabs > arrow {
+    border-bottom-style: none; }
+  notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
     margin-left: -5px;
     margin-right: -5px;
     padding-left: 4px;
-    padding-right: 4px;
-    border-top-style: none;
+    padding-right: 4px; }
+    notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
+      -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); }
+    notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
+      -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
+  notebook > header.left > tabs > arrow {
+    border-left-style: none; }
+  notebook > header.right > tabs > arrow {
+    border-right-style: none; }
+  notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
+    margin-top: -5px;
+    margin-bottom: -5px;
+    padding-top: 4px;
+    padding-bottom: 4px; }
+    notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
+      -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
+    notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
+      -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
+  notebook > header > tabs > arrow {
+    min-height: 16px;
+    min-width: 16px;
     border-radius: 0; }
     notebook > header > tabs > arrow:hover:not(:active):not(:backdrop) {
+      background-clip: padding-box;
       background-image: none;
       background-color: rgba(255, 255, 255, 0.3);
-      border-left-color: transparent;
-      border-right-color: transparent;
+      border-color: transparent;
       box-shadow: none; }
     notebook > header > tabs > arrow:disabled {
       background-image: none;
       background-color: transparent;
       border-color: transparent; }
-    notebook > header > tabs > arrow.down {
-      -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); }
-    notebook > header > tabs > arrow.up {
-      -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
   notebook > header tab {
     font-weight: bold;
     min-height: 36px;
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index fced938..fbeade6 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -2202,29 +2202,46 @@ notebook > header {
         box-shadow: none; }
       notebook > header.right > tabs > tab:active {
         box-shadow: inset 3px 0 #4a90d9; }
-  notebook > header > tabs > arrow {
-    min-height: 16px;
-    min-width: 16px;
+  notebook > header.top > tabs > arrow {
+    border-top-style: none; }
+  notebook > header.bottom > tabs > arrow {
+    border-bottom-style: none; }
+  notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
     margin-left: -5px;
     margin-right: -5px;
     padding-left: 4px;
-    padding-right: 4px;
-    border-top-style: none;
+    padding-right: 4px; }
+    notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
+      -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); }
+    notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
+      -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
+  notebook > header.left > tabs > arrow {
+    border-left-style: none; }
+  notebook > header.right > tabs > arrow {
+    border-right-style: none; }
+  notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
+    margin-top: -5px;
+    margin-bottom: -5px;
+    padding-top: 4px;
+    padding-bottom: 4px; }
+    notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
+      -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
+    notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
+      -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
+  notebook > header > tabs > arrow {
+    min-height: 16px;
+    min-width: 16px;
     border-radius: 0; }
     notebook > header > tabs > arrow:hover:not(:active):not(:backdrop) {
+      background-clip: padding-box;
       background-image: none;
       background-color: rgba(255, 255, 255, 0.3);
-      border-left-color: transparent;
-      border-right-color: transparent;
+      border-color: transparent;
       box-shadow: none; }
     notebook > header > tabs > arrow:disabled {
       background-image: none;
       background-color: transparent;
       border-color: transparent; }
-    notebook > header > tabs > arrow.down {
-      -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); }
-    notebook > header > tabs > arrow.up {
-      -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
   notebook > header tab {
     font-weight: bold;
     min-height: 36px;