Merge lp:~christhehorton/salience/fix_titlebar_blending into lp:salience

[Christopher Kyle Horton]

This branch makes the bottoms of titlebars integrate more smoothly into the tops of windows which don't have toolbars, and it also darkens toolbars/sidebars a bit to work with the change. Also, there are some improvements to theming for toolbar buttons.

[lp:~christhehorton/salience/fix_titlebar_blending]

109. By Christopher Kyle Horton on 2012-09-07

Move more Nautilus-specific code into nautilus.css and darken the browsing background in Nautilus.

110. By Christopher Kyle Horton on 2012-09-07

Merge from trunk.

[Aditya V (kroq-gar78)]

Looks good!

Also, I don't think you need to merge from trunk unless you just want to make sure it's still working. I think bzr will do that for us :)

review: Approve

=== modified file 'gtk-2.0/Button/toolbar.png'
Binary files gtk-2.0/Button/toolbar.png	2012-06-10 03:32:54 +0000 and gtk-2.0/Button/toolbar.png	2012-09-07 19:56:22 +0000 differ
=== modified file 'gtk-2.0/gtkrc'
--- gtk-2.0/gtkrc	2012-09-07 19:47:04 +0000
+++ gtk-2.0/gtkrc	2012-09-07 19:56:22 +0000
@@ -563,13 +563,21 @@
 			function		= BOX
 			recolorable		= TRUE
 			file			= "Button/toolbar.png"
-			border			= { 0, 0, 0, 0}
+			border			= {2, 0, 0, 1}
 			stretch			= TRUE
 			orientation		= HORIZONTAL
 		}
 	}	
 }
 
+style "murrine-toolbar-button" = "murrine-button"
+{
+  engine "murrine"
+  {
+    gradient_shades         = {1.00,0.90,0.80,0.60}
+  }
+}
+
 style "murrine-tooltips"
 {
 	xthickness				= 6
@@ -729,6 +737,7 @@
 widget_class "*<GtkCheckButton>*"               style "murrine-default"
 
 widget_class "*<GtkButton>"                     style "murrine-button"
+widget_class "*<GtkToolbar>*<GtkButton>"           style "murrine-toolbar-button"
 
 # Treeview header
 widget_class "*.<GtkTreeView>.<GtkButton>"      style "murrine-treeview-header"

=== modified file 'gtk-3.0/apps/nautilus.css'
--- gtk-3.0/apps/nautilus.css	2012-09-06 00:45:21 +0000
+++ gtk-3.0/apps/nautilus.css	2012-09-07 19:56:22 +0000
@@ -1,4 +1,10 @@
-/* Nautilus window item theming */
+/****************************
+* Nautilus-specific theming *
+*****************************/
+
+NautilusWindow *.view {
+  background-color: shade (@bg_color, 0.8);
+}
 
 .nautilus-canvas-item:active {
     color: @theme_text_color;
@@ -86,3 +92,57 @@
     -GtkButton-image-spacing: 0;
     -GtkButton-inner-border: 0;
 }
+
+/* Nautilus Sidebar */
+
+NautilusWindow .sidebar,
+NautilusWindow .sidebar .view,
+NautilusWindow .sidebar .frame,
+NautilusWindow > GtkTable > .pane-separator,
+NautilusWindow > GtkList > .pane-separator {
+    padding:		      0;
+    background-color: @bg_color;
+    color: 		        @fg_color;
+    background-image: none;
+    
+    border-color: 	  shade (@bg_dark_color, 0.52);
+    border-width: 	  0 1px 0 0;
+    border-style: 	  solid;
+
+    -unico-inner-stroke-width: 0 1px 0 0;
+    -unico-inner-stroke-gradient: -gtk-gradient (linear,
+                    right top, left top,
+                    from (@bg_dark_color),
+                    to (transparent));
+
+}
+
+NautilusWindow .sidebar .view:selected {
+    color: 			@selected_fg_color;
+    border-style: 		solid;
+    border-width: 		1px 1px 1px 0;
+
+    -unico-inner-stroke-width: 	1px 1px 1px 0;
+
+    background-image: -gtk-gradient (linear,
+                    left top,
+                    left bottom,
+                    from (shade (@selected_bg_color, 1.25)),
+                    to (shade (@selected_bg_color, 0.98)));
+
+    -unico-border-gradient: -gtk-gradient (linear,
+                    left top, left bottom,
+	            from (shade (@bg_color, 0.8)),
+		    to (shade (@bg_dark_color, 0.66)));		    
+
+    -unico-inner-stroke-gradient: -gtk-gradient (linear,
+                    left top, left bottom,
+                    from (alpha (#fff, 0.20)),
+                    to (alpha (#fff, 0.10)));
+}
+
+NautilusWindow .sidebar .view:selected:backdrop {
+    color: @insensitive_color;
+    background-image: 	none;
+    background-color: 	shade (@bg_dark_color, 0.78);
+}

=== modified file 'gtk-3.0/button.css'
--- gtk-3.0/button.css	2012-09-05 05:13:58 +0000
+++ gtk-3.0/button.css	2012-09-07 19:56:22 +0000
@@ -9,7 +9,6 @@
 }
 
 .button {
-
     -GtkButton-child-displacement-x:             0;
     -GtkButton-child-displacement-y:             0;
     -GtkButton-default-border:                 0;
@@ -31,7 +30,6 @@
 }
 
 .button:hover {
-
     background-image: -gtk-gradient (linear,
 		     left top,
 		     left bottom,
@@ -48,7 +46,6 @@
 .button:active:focused,
 .button:hover:active,
 .button:hover:active:focused {
-
     background-image: -gtk-gradient (linear,
 		     left top,
 		     left bottom,
@@ -73,7 +70,12 @@
 .button:active,
 .button:active:focused,
 .button:hover:active,
-.button:hover:active:focused {
+.button:hover:active:focused,
+.toolbar .button:hover,
+.toolbar .button:active,
+.toolbar .button:active:focused,
+.toolbar .button:hover:active,
+.toolbar .button:hover:active:focused {
   color:        @selected_fg_color;
   text-shadow:  0 1 alpha (#000, 0.5),
                 -1 -1 alpha (@selected_fg_color, 0.2),
@@ -109,7 +111,6 @@
 .button:active:focused:backdrop,
 .button:hover:active:backdrop,
 .button:hover:active:focused:backdrop {
-
     background-image: -gtk-gradient (linear,
 		    left top,
 		    left bottom,
@@ -130,11 +131,43 @@
     
 }
 
+/******************
+* Toolbar buttons *
+*******************/
 
 .toolbar .button {
-    padding:       2.5px;
-    text-shadow:   0 1 alpha (#000, 0.75);
-    icon-shadow:   none;
+  padding:       2.5px;
+  text-shadow:   0 1 alpha (#000, 0.5);
+  icon-shadow:   0 1 alpha (#000, 0.5);
+  
+  background-image: -gtk-gradient (linear,
+      left top,
+      left bottom,
+      color-stop (0.00, shade (@bg_color, 1.00)),
+      color-stop (0.33, shade (@bg_color, 0.90)),
+      color-stop (0.66, shade (@bg_color, 0.80)),
+      color-stop (1.00, shade (@bg_color, 0.60)));
+}
+
+.toolbar .button:hover {
+  background-image: -gtk-gradient (linear,
+      left top,
+      left bottom,
+      color-stop (0.00, shade (@bg_color, 1.10)),
+      color-stop (0.33, shade (@bg_color, 1.00)),
+      color-stop (0.66, shade (@bg_color, 0.90)),
+      color-stop (1.00, shade (@bg_color, 0.70)));
+}
+
+.toolbar .button:active,
+.toolbar .button:active:focused,
+.toolbar .button:hover:active,
+.toolbar .button:hover:active:focused {
+    background-image: -gtk-gradient (linear,
+		     left top,
+		     left bottom,
+         from (shade (@selected_bg_color, 0.75)),
+         to (shade (@selected_bg_color, 1.24)));
 }
 
 /*************************** 

=== modified file 'gtk-3.0/sidebar.css'
--- gtk-3.0/sidebar.css	2012-09-05 04:19:45 +0000
+++ gtk-3.0/sidebar.css	2012-09-07 19:56:22 +0000
@@ -10,8 +10,8 @@
 .sidebar.view,
 .sidebar .view {
     padding:		0;
-    background-color: 	shade (@bg_dark_color, 0.80);
-    color: 		@fg_color;
+    background-color: 	@bg_color;
+    color: 		          @fg_color;
     text-shadow:	      0 1 alpha(#000, 0.5);
     icon-shadow: 	      0 1 alpha(#000, 0.5);
     
@@ -102,56 +102,3 @@
     background-image: 	none;
     background-color: 	shade (@bg_dark_color, 0.78);
 }
-
-/* Nautilus Sidebar */
-
-NautilusWindow .sidebar,
-NautilusWindow .sidebar .view,
-NautilusWindow .sidebar .frame,
-NautilusWindow > GtkTable > .pane-separator,
-NautilusWindow > GtkList > .pane-separator {
-    padding:		0;
-    background-color: 	shade (@bg_dark_color, 0.80);
-    color: 		@fg_color;
-    
-    border-color: 	shade (@bg_dark_color, 0.52);
-    border-width: 	0 1px 0 0;
-    border-style: 	solid;
-
-    -unico-inner-stroke-width: 0 1px 0 0;
-    -unico-inner-stroke-gradient: -gtk-gradient (linear,
-                    right top, left top,
-                    from (@bg_dark_color),
-                    to (transparent));
-
-}
-
-NautilusWindow .sidebar .view:selected {
-    color: 			@selected_fg_color;
-    border-style: 		solid;
-    border-width: 		1px 1px 1px 0;
-
-    -unico-inner-stroke-width: 	1px 1px 1px 0;
-
-    background-image: -gtk-gradient (linear,
-                    left top,
-                    left bottom,
-                    from (shade (@selected_bg_color, 1.25)),
-                    to (shade (@selected_bg_color, 0.98)));
-
-    -unico-border-gradient: -gtk-gradient (linear,
-                    left top, left bottom,
-	            from (shade (@bg_color, 0.8)),
-		    to (shade (@bg_dark_color, 0.66)));		    
-
-    -unico-inner-stroke-gradient: -gtk-gradient (linear,
-                    left top, left bottom,
-                    from (alpha (#fff, 0.20)),
-                    to (alpha (#fff, 0.10)));
-}
-
-NautilusWindow .sidebar .view:selected:backdrop {
-    color: @insensitive_color;
-    background-image: 	none;
-    background-color: 	shade (@bg_dark_color, 0.78);
-}

=== modified file 'gtk-3.0/toolbar.css'
--- gtk-3.0/toolbar.css	2012-09-06 00:23:59 +0000
+++ gtk-3.0/toolbar.css	2012-09-07 19:56:22 +0000
@@ -18,8 +18,10 @@
     background-image: -gtk-gradient (linear,
 				     left top,
 				     left bottom,
-				     from (shade (@bg_dark_color, 0.80)),
-				     to (shade (@bg_dark_color, 0.62)));
+				     color-stop (0.00, shade (@bg_color, 1.00)),
+			       color-stop (0.33, shade (@bg_color, 0.90)),
+				     color-stop (0.66, shade (@bg_color, 0.80)),
+			       color-stop (1.00, shade (@bg_color, 0.60)));
 }
 
 .secondary-toolbar.toolbar {
@@ -28,7 +30,7 @@
     -unico-inner-stroke-color: @bg_dark_color;
 
     background-image: none;
-    background-color: shade (@bg_dark_color, 0.62);
+    background-color: shade (@bg_color, 0.80);
 
 }
 
@@ -46,8 +48,10 @@
     background-image: -gtk-gradient (linear,
 				     left top,
 				     left bottom,
-				     from (shade (@bg_dark_color, 0.80)),
-				     to (shade (@bg_dark_color, 0.62)));
+				     color-stop (0.00, shade (@bg_color, 1.00)),
+			       color-stop (0.33, shade (@bg_color, 0.90)),
+				     color-stop (0.66, shade (@bg_color, 0.80)),
+			       color-stop (1.00, shade (@bg_color, 0.60)));
 }
 
 /********************

=== modified file 'gtk-3.0/unity.css'
--- gtk-3.0/unity.css	2012-09-07 17:33:38 +0000
+++ gtk-3.0/unity.css	2012-09-07 19:56:22 +0000
@@ -8,12 +8,10 @@
     background-image: -gtk-gradient (linear,
 				     left top,
 				     left bottom,
-				     from (@bg_dark_color),
-			             color-stop (0.06, shade (@bg_dark_color, 1.18)),
-			             color-stop (0.06, shade (@bg_dark_color, 1.09)),
-				     color-stop (0.94, shade (@bg_dark_color, 0.80)),
-			             color-stop (0.94, shade (@bg_dark_color, 0.80)),
-                                     to (shade (@bg_dark_color, 0.80)));
+				     color-stop (0.00, shade (@bg_color, 1.40)),
+			       color-stop (0.33, shade (@bg_color, 1.20)),
+				     color-stop (0.66, shade (@bg_color, 1.10)),
+			       color-stop (1.00, shade (@bg_color, 1.00)));
     border-image: none;
     border-style: solid;
     border-width: 0;

=== modified file 'metacity-1/metacity-theme-2.xml'
--- metacity-1/metacity-theme-2.xml	2012-09-06 05:34:31 +0000
+++ metacity-1/metacity-theme-2.xml	2012-09-07 19:56:22 +0000
@@ -111,7 +111,7 @@
 	<!-- window decorations -->
 
 <draw_ops name="entire_background_focused">
-	<rectangle color="shade/gtk:bg[NORMAL]/1.29" x="0" y="0" width="width" height="height" filled="true" />
+	<rectangle color="gtk:bg[NORMAL]" x="0" y="0" width="width" height="height" filled="true" />
 </draw_ops>
 
 <draw_ops name="entire_background_unfocused">
@@ -120,28 +120,28 @@
 
 <draw_ops name="titlebar_fill_focused">
 	<gradient type="vertical" x="0" y="0" width="width" height="height">
-		<color value="shade/gtk:bg[NORMAL]/1.66"/>
-		<color value="shade/gtk:bg[NORMAL]/1.49"/>
-		<color value="shade/gtk:bg[NORMAL]/1.36"/>
-		<color value="shade/gtk:bg[NORMAL]/1.29"/>
+		<color value="shade/gtk:bg[NORMAL]/1.40"/>
+		<color value="shade/gtk:bg[NORMAL]/1.20"/>
+		<color value="shade/gtk:bg[NORMAL]/1.10"/>
+		<color value="shade/gtk:bg[NORMAL]/1.00"/>
 	</gradient>
 </draw_ops>
 
 <draw_ops name="titlebar_fill_focused_alt">
 	<gradient type="vertical" x="0" y="0" width="width" height="height">
-		<color value="shade/gtk:bg[NORMAL]/1.66"/>
-		<color value="shade/gtk:bg[NORMAL]/1.49"/>
-		<color value="shade/gtk:bg[NORMAL]/1.36"/>
-		<color value="shade/gtk:bg[NORMAL]/1.29"/>
+		<color value="shade/gtk:bg[NORMAL]/1.40"/>
+		<color value="shade/gtk:bg[NORMAL]/1.20"/>
+		<color value="shade/gtk:bg[NORMAL]/1.10"/>
+		<color value="shade/gtk:bg[NORMAL]/1.00"/>
 	</gradient>
 </draw_ops>
 
 <draw_ops name="titlebar_fill_unfocused">
 	<gradient type="vertical" x="0" y="0" width="width" height="height">
-		<color value="shade/gtk:bg[NORMAL]/1.66"/>
-		<color value="shade/gtk:bg[NORMAL]/1.49"/>
-		<color value="shade/gtk:bg[NORMAL]/1.36"/>
-		<color value="shade/gtk:bg[NORMAL]/1.29"/>
+		<color value="shade/gtk:bg[NORMAL]/1.40"/>
+		<color value="shade/gtk:bg[NORMAL]/1.20"/>
+		<color value="shade/gtk:bg[NORMAL]/1.10"/>
+		<color value="shade/gtk:bg[NORMAL]/1.00"/>
 	</gradient>
 </draw_ops>
 

=== modified file 'metacity-1/metacity-theme-3.xml'
--- metacity-1/metacity-theme-3.xml	2012-09-06 05:34:31 +0000
+++ metacity-1/metacity-theme-3.xml	2012-09-07 19:56:22 +0000
@@ -151,7 +151,7 @@
 	<!-- window decorations -->
 
 <draw_ops name="entire_background_focused">
-	<rectangle color="shade/gtk:bg[NORMAL]/1.29" x="0" y="0" width="width" height="height" filled="true" />
+	<rectangle color="gtk:bg[NORMAL]" x="0" y="0" width="width" height="height" filled="true" />
 </draw_ops>
 
 <draw_ops name="entire_background_unfocused">
@@ -160,29 +160,29 @@
 
 <draw_ops name="titlebar_fill_focused">
 	<gradient type="vertical" x="0" y="0" width="width" height="height">
-		<color value="shade/gtk:bg[NORMAL]/1.66"/>
-		<color value="shade/gtk:bg[NORMAL]/1.49"/>
-		<color value="shade/gtk:bg[NORMAL]/1.36"/>
-		<color value="shade/gtk:bg[NORMAL]/1.29"/>
+		<color value="shade/gtk:bg[NORMAL]/1.40"/>
+		<color value="shade/gtk:bg[NORMAL]/1.20"/>
+		<color value="shade/gtk:bg[NORMAL]/1.10"/>
+		<color value="shade/gtk:bg[NORMAL]/1.00"/>
 	</gradient>
 </draw_ops>
 
 
 <draw_ops name="titlebar_fill_attached_focused"> <!-- gradient for attached and modal dialogs titlebar-->
 	<gradient type="vertical" x="0" y="0" width="width" height="height">
-		<color value="shade/gtk:bg[NORMAL]/1.29"/>
+		<color value="shade/gtk:bg[NORMAL]/1.40"/>
 		<color value="shade/gtk:bg[NORMAL]/1.20"/>
-		<color value="shade/gtk:bg[NORMAL]/1.07"/>
-		<color value="gtk:bg[NORMAL]"/>
+		<color value="shade/gtk:bg[NORMAL]/1.10"/>
+		<color value="shade/gtk:bg[NORMAL]/1.00"/>
 	</gradient>
 </draw_ops>
 
 <draw_ops name="titlebar_fill_unfocused">
 	<gradient type="vertical" x="0" y="0" width="width" height="height">
-		<color value="shade/gtk:bg[NORMAL]/1.66"/>
-		<color value="shade/gtk:bg[NORMAL]/1.49"/>
-		<color value="shade/gtk:bg[NORMAL]/1.36"/>
-		<color value="shade/gtk:bg[NORMAL]/1.29"/>
+		<color value="shade/gtk:bg[NORMAL]/1.40"/>
+		<color value="shade/gtk:bg[NORMAL]/1.20"/>
+		<color value="shade/gtk:bg[NORMAL]/1.10"/>
+		<color value="shade/gtk:bg[NORMAL]/1.00"/>
 	</gradient>
 </draw_ops>