Merge lp:~snwh/egtk/matching-notebook-styles into lp:~elementary-design/egtk/trunk

[Sam Hewitt]

Match style of .notebook and .dynamic-notebook match

Update to make the style of .notebook and .dynamic-notebook match.

[lp:~snwh/egtk/matching-notebook-styles]

452. By Sam Hewitt on 2015-04-21

Tweaked legacy notebook headers.

453. By Sam Hewitt on 2015-04-21

Refined notebook style.

454. By Sam Hewitt on 2015-04-21

Marginally improved the notebook header some more

Unmerged revisions

454. By Sam Hewitt on 2015-04-21

Marginally improved the notebook header some more

453. By Sam Hewitt on 2015-04-21

Refined notebook style.

452. By Sam Hewitt on 2015-04-21

Tweaked legacy notebook headers.

451. By Sam Hewitt on 2015-04-21

Matched .notebook & .dynamic-notebook styles.

=== modified file 'gtk-3.0/gtk-widgets.css'
--- gtk-3.0/gtk-widgets.css	2015-04-20 18:02:27 +0000
+++ gtk-3.0/gtk-widgets.css	2015-04-21 19:44:00 +0000
@@ -1327,7 +1327,7 @@
 ********************/
 
 .notebook {
-    border-radius: 2.5px;
+    border-radius: 0 0 2.5px 2.5px;
 
     background-clip: border-box;
     background-color: shade (@titlebar_color, 1.06);
@@ -1335,14 +1335,13 @@
     text-shadow: 0 1px alpha (#fff, 0.4);
     icon-shadow: 0 1px alpha (#fff, 0.4);
     border: 1px solid shade (@titlebar_color, 0.60);
-}
-
-.notebook.header {
-    border: none;
-    background-color: transparent;
-}
-
+    border-top-width: 0px;
+}
+
+
+.notebook.header,
 .dynamic-notebook .notebook.header {
+    background-color: transparent;
     background-image: linear-gradient(to bottom,
                                   alpha (#000, 0.10),
                                   alpha (#000, 0.00) 3px
@@ -1355,8 +1354,15 @@
     border-width: 0 0 1px 0;
     border-color: shade (@titlebar_color, 0.56);
     border-radius: 0;
-}
-
+    box-shadow: none;
+}
+
+.notebook.header {
+    border: none;
+    box-shadow: inset 0 0 0 1px shade (@titlebar_color, 0.56)
+}
+
+.notebook.header:backdrop,
 .dynamic-notebook .notebook.header:backdrop {
     background-color: shade (@titlebar_color, 0.96);
     background-image: linear-gradient(to bottom,
@@ -1372,18 +1378,22 @@
     border-width: 0;
 }
 
+.notebook .button,
 .dynamic-notebook .notebook .button {
     color: shade (@text_color, 1.20);
 }
 
+.notebook GtkImage,
 .dynamic-notebook GtkImage {
     color: shade (@title_color, 0.75);
 }
 
+.notebook GtkImage:insensitive,
 .dynamic-notebook GtkImage:insensitive {
     color: @insensitive_color;
 }
 
+.notebook .button:hover,
 .dynamic-notebook .notebook .button:hover {
     background-color: alpha (#000, 0.05);
     border-color: alpha (#000, 0.25);
@@ -1391,24 +1401,14 @@
     color: shade (@text_color, 1.10);
 }
 
+.notebook .button:hover:active,
 .dynamic-notebook .notebook .button:hover:active {
     background-color: alpha (#000, 0.10);
 }
 
-.notebook tab {
-    background-image: linear-gradient(to bottom,
-                                  shade (@titlebar_color, 0.75),
-                                  shade (@titlebar_color, 0.80)
-                                  );
-
-    border-radius: 2.5px;
-
-    padding: 2px 3px 0;
-}
-
+
+.notebook tab,
 .dynamic-notebook .notebook tab {
-    padding: 3px;
-
     border-radius: 0;
 
     background-image: none;
@@ -1422,10 +1422,20 @@
                                   ) 0 1 0 0;
 }
 
+.notebook tab {  
+    padding: 0 3px;
+}
+
+.dynamic-notebook .notebook tab {
+    padding: 3px;
+}
+
+.notebook tab > GtkImage,
 .dynamic-notebook .notebook tab > GtkImage {
     color: shade (@titlebar_color, 0.35);
 }
 
+.notebook tab:nth-child(first),
 .dynamic-notebook .notebook tab:nth-child(first) {
     border-width: 0 1px 0 1px;
     border-image: linear-gradient(to bottom,
@@ -1434,14 +1444,7 @@
                                   ) 0 1 0 1;
 }
 
-.notebook tab:active {
-    background-image: linear-gradient(to bottom,
-                                  shade (@titlebar_color, 1.24),
-                                  shade (@titlebar_color, 1.06)
-                                  );
-    color: @text_color;
-}
-
+.notebook tab:active,
 .dynamic-notebook .notebook tab:active {
     background-image: linear-gradient(to bottom,
                                   shade (@titlebar_color, 0.88),
@@ -1463,31 +1466,38 @@
     color: @text_color;
 }
 
+.notebook tab:active {
+    border-width: 1px;
+    box-shadow: inset 0 1px 0 0 alpha (#fff, 0.40);
+}
+
+.notebook tab:active:backdrop,
 .dynamic-notebook .notebook tab:active:backdrop {
     background-image: linear-gradient(to bottom,
                                   shade (@titlebar_color, 0.98),
                                   shade (@titlebar_color, 0.96)
                                   );
     border-color: shade (@titlebar_color, 0.70);
-    box-shadow: inset 0 0 0 1px alpha (#fff, 0.20),
-                0 0 0 1px alpha (#000, 0.10);
+    border-radius: 4px;
+    border-style: solid;
+    border-width: 0 1px 1px;
+
+    text-shadow: 0 1px alpha (#fff, 0.2);
+    icon-shadow: 0 1px alpha (#fff, 0.2);
+
+    box-shadow: inset 0 0 0 1px alpha (#fff, 0.20);
 }
 
-.notebook.header {
+.notebook tab:active:backdrop {
     border: none;
-    background-color: transparent;
-}
-
-.notebook {
-    border-radius: 2.5px;
-
-    background-clip: border-box;
-    background-color: shade (@titlebar_color, 1.06);
-
-    text-shadow: 0 1px alpha (#fff, 0.4);
-    icon-shadow: 0 1px alpha (#fff, 0.4);
-
-    border: 1px solid shade (@titlebar_color, 0.60);
+    box-shadow: inset 0 0 0 1px alpha (#000, 0.20),
+                inset 0 1px 0 0 alpha (#fff, 0.20),
+                inset 0 -1px 0 0 alpha (#fff, 0.20),
+                inset 2px 0 0 0 alpha (#fff, 0.20),
+                inset -2px 0 0 0 alpha (#fff, 0.20),
+                inset 1px 0 0 0 shade (@titlebar_color, 0.70),
+                inset -1px 0 0 0 shade (@titlebar_color, 0.70),
+                0 0 1px 1px alpha (#000, 0.10);
 }
 
 .notebook.frame {
@@ -2446,6 +2456,7 @@
 .popover GtkTreeView.view row:selected {
     background-color: shade (@base_color, 0.80);
     color: @text_color;
+    text-shadow:none;
 }
 
 .cell:selected:focus,
@@ -2453,6 +2464,7 @@
 .view:selected:focus {
     background-color: @selected_bg_color;
     color: @selected_fg_color;
+    text-shadow:none;
 }
 
 /* FIXME: This doesn't work with only-child