[gtk+] Adwaita: wide paned separator style

[Lapo Calamandrei <lapo src gnome org>]

commit 01b4720ec825dca96e55a3a61e45f07f54fcd38e
Author: Lapo Calamandrei <calamandrei gmail com>
Date:   Tue Oct 21 13:25:17 2014 +0200

    Adwaita: wide paned separator style
    
    ...paned separator decoration fixed in the process.

 gtk/resources/theme/Adwaita/_common.scss           |   35 ++++++++++++++------
 gtk/resources/theme/Adwaita/gtk-contained-dark.css |   25 +++++++++++---
 gtk/resources/theme/Adwaita/gtk-contained.css      |   25 +++++++++++---
 3 files changed, 63 insertions(+), 22 deletions(-)
---
diff --git a/gtk/resources/theme/Adwaita/_common.scss b/gtk/resources/theme/Adwaita/_common.scss
index 564521e..f387f91 100644
--- a/gtk/resources/theme/Adwaita/_common.scss
+++ b/gtk/resources/theme/Adwaita/_common.scss
@@ -8,7 +8,6 @@ $ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
   padding: 0;
   -GtkToolButton-icon-spacing: 4;
   -GtkTextView-error-underline-color: $error_color;
-  -GtkPaned-handle-size: 1;
 
   -GtkCheckButton-indicator-size: 16;
   -GtkCheckMenuItem-indicator-size: 16;
@@ -2749,24 +2748,40 @@ GtkPlacesSidebar.sidebar .view {
   }
 }
 
-GtkPaned {
-  // This is actually the invisible area of the paned separator, not a margin...
-  margin: 0 8px 8px 0; //drag area of the separator
+GtkPaned { // this is for the standard paned separator
+
+  -GtkPaned-handle-size: 1; // sets separator width
+
+  margin: 0 8px 8px 0; // drag area of the separator, not a real margin
   &:dir(rtl) {
     margin-right: 0;
     margin-left: 8px;
   }
+  .pane-separator {
+    //FIXME abusing a background-image to get rid of the handle decoration
+    //I'd like something better...
+    background-image: linear-gradient(to bottom, $borders_color);
+    background-color: transparent; // transparent background color to gets rid of the decoration.
+    &:backdrop {
+      background-image: linear-gradient(to bottom, $backdrop_borders_color);
+    }
+  }
 }
 
-.pane-separator {
-  //FIXME abusing a background-image to get rid of the handle decoration
-  //I'd like something better...
-  background-image: linear-gradient(to bottom, $borders_color);
-  &:backdrop {
-    background-image: linear-gradient(to bottom, $backdrop_borders_color);
+GtkPaned.wide { // this is for the paned with wide separator
+  -GtkPaned-handle-size: 5; // wider separator here
+  margin: 0; // no need of the invisible drag area so, reset margin
+  .pane-separator {
+    border-style: none solid;
+    border-color: $borders_color;
+    background-image: none;
+    border-width: 1px;
   }
+  &.vertical .pane-separator { border-style: solid none;}
+  .pane-separator:backdrop { border-color: $backdrop_borders_color; }
 }
 
+
 /**************
  * GtkInfoBar *
  **************/
diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css 
b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
index 6348c60..191cb65 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
@@ -2,7 +2,6 @@
   padding: 0;
   -GtkToolButton-icon-spacing: 4;
   -GtkTextView-error-underline-color: #cc0000;
-  -GtkPaned-handle-size: 1;
   -GtkCheckButton-indicator-size: 16;
   -GtkCheckMenuItem-indicator-size: 16;
   -GtkScrolledWindow-scrollbar-spacing: 0;
@@ -4070,15 +4069,29 @@ GtkPlacesSidebar.sidebar .view {
     background-size: 6px 6px, 0 0; }
 
 GtkPaned {
+  -GtkPaned-handle-size: 1;
   margin: 0 8px 8px 0; }
   GtkPaned:dir(rtl) {
     margin-right: 0;
     margin-left: 8px; }
-
-.pane-separator {
-  background-image: linear-gradient(to bottom, #1c1f1f); }
-  .pane-separator:backdrop {
-    background-image: linear-gradient(to bottom, #1e2222); }
+  GtkPaned .pane-separator {
+    background-image: linear-gradient(to bottom, #1c1f1f);
+    background-color: transparent; }
+    GtkPaned .pane-separator:backdrop {
+      background-image: linear-gradient(to bottom, #1e2222); }
+
+GtkPaned.wide {
+  -GtkPaned-handle-size: 5;
+  margin: 0; }
+  GtkPaned.wide .pane-separator {
+    border-style: none solid;
+    border-color: #1c1f1f;
+    background-image: none;
+    border-width: 1px; }
+  GtkPaned.wide.vertical .pane-separator {
+    border-style: solid none; }
+  GtkPaned.wide .pane-separator:backdrop {
+    border-color: #1e2222; }
 
 /**************
  * GtkInfoBar *
diff --git a/gtk/resources/theme/Adwaita/gtk-contained.css b/gtk/resources/theme/Adwaita/gtk-contained.css
index 9545fe5..fa6e203 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained.css
@@ -2,7 +2,6 @@
   padding: 0;
   -GtkToolButton-icon-spacing: 4;
   -GtkTextView-error-underline-color: #cc0000;
-  -GtkPaned-handle-size: 1;
   -GtkCheckButton-indicator-size: 16;
   -GtkCheckMenuItem-indicator-size: 16;
   -GtkScrolledWindow-scrollbar-spacing: 0;
@@ -4231,15 +4230,29 @@ GtkPlacesSidebar.sidebar .view {
     background-size: 6px 6px, 0 0; }
 
 GtkPaned {
+  -GtkPaned-handle-size: 1;
   margin: 0 8px 8px 0; }
   GtkPaned:dir(rtl) {
     margin-right: 0;
     margin-left: 8px; }
-
-.pane-separator {
-  background-image: linear-gradient(to bottom, #a1a1a1); }
-  .pane-separator:backdrop {
-    background-image: linear-gradient(to bottom, #a8a8a8); }
+  GtkPaned .pane-separator {
+    background-image: linear-gradient(to bottom, #a1a1a1);
+    background-color: transparent; }
+    GtkPaned .pane-separator:backdrop {
+      background-image: linear-gradient(to bottom, #a8a8a8); }
+
+GtkPaned.wide {
+  -GtkPaned-handle-size: 5;
+  margin: 0; }
+  GtkPaned.wide .pane-separator {
+    border-style: none solid;
+    border-color: #a1a1a1;
+    background-image: none;
+    border-width: 1px; }
+  GtkPaned.wide.vertical .pane-separator {
+    border-style: solid none; }
+  GtkPaned.wide .pane-separator:backdrop {
+    border-color: #a8a8a8; }
 
 /**************
  * GtkInfoBar *