[gnome-themes-standard: 5/26] adwaita: render focus ring according to mockups

[Cosimo Cecchi <cosimoc src gnome org>]

commit 0a67536fe00f124c1ce7edec5a37df163d32e866
Author: Cosimo Cecchi <cosimoc gnome org>
Date:   Wed Mar 2 13:54:26 2011 -0500

    adwaita: render focus ring according to mockups

 src/adwaita_engine.c           |   89 +++++++++++++++++++++++++++++++++++----
 themes/Adwaita/gtk-3.0/gtk.css |   18 ++++++--
 2 files changed, 92 insertions(+), 15 deletions(-)
---
diff --git a/src/adwaita_engine.c b/src/adwaita_engine.c
index b0abc99..ce950ae 100644
--- a/src/adwaita_engine.c
+++ b/src/adwaita_engine.c
@@ -132,30 +132,89 @@ adwaita_engine_render_focus (GtkThemingEngine *engine,
 			     gdouble	       width,
 			     gdouble	       height)
 {
-	GdkRGBA *fill_color, *border_color;
+	GdkRGBA *fill_color, *border_color = NULL;
+	GdkRGBA *border_gradient_a = NULL, *border_gradient_b = NULL;
+	cairo_matrix_t matrix;
+	cairo_pattern_t *pattern = NULL;
 	GtkStateFlags state;
+	gint line_width, radius;
 
 	state = gtk_theming_engine_get_state (engine);
 	gtk_theming_engine_get (engine, state,
-				"-adwaita-focus-fill-color", &fill_color,
 				"-adwaita-focus-border-color", &border_color,
+				"-adwaita-focus-fill-color", &fill_color,
+				"-adwaita-focus-border-gradient-a", &border_gradient_a,
+				"-adwaita-focus-border-gradient-b", &border_gradient_b,
 				NULL);
 
+	gtk_theming_engine_get_style (engine,
+				      "focus-line-width", &line_width,
+				      NULL);
+
 	cairo_save (cr);
-	cairo_set_line_width (cr, 1);
+	cairo_set_line_width (cr, line_width);
+
+	if (line_width > 1) {
+		_cairo_round_rectangle (cr, x, y,
+					width, height, 1);
+	} else {
+		_cairo_round_rectangle (cr, x + 0.5, y + 0.5,
+					width - 1, height - 1, 2);
+	}
 
-	_cairo_round_rectangle (cr, x + 0.5, y + 0.5, width - 1, height - 1, 3);
+	/* if we have a fill color, draw the fill */
+	if (fill_color != NULL) {
+		gdk_cairo_set_source_rgba (cr, fill_color);
+		cairo_fill_preserve (cr);
+	}
 
-	gdk_cairo_set_source_rgba (cr, fill_color);
-	cairo_fill_preserve (cr);
+	/* if we have a gradient, draw the gradient, otherwise
+	 * draw the line if we have a color for it.
+	 */
+	if (border_gradient_a != NULL &&
+	    border_gradient_b != NULL) {
+		pattern = cairo_pattern_create_linear (x, y, x, y + height);
+
+		cairo_pattern_add_color_stop_rgba (pattern,
+						   0.0,
+						   border_gradient_a->red,
+						   border_gradient_a->green,
+						   border_gradient_a->blue,
+						   border_gradient_a->alpha);
+
+		cairo_pattern_add_color_stop_rgba (pattern,
+						   1.0,
+						   border_gradient_b->red,
+						   border_gradient_b->green,
+						   border_gradient_b->blue,
+						   border_gradient_b->alpha);
 
-	gdk_cairo_set_source_rgba (cr, border_color);
-	cairo_stroke (cr);
+		cairo_set_source (cr, pattern);
+		cairo_stroke (cr);
+
+		cairo_pattern_destroy (pattern);
+	} else if (border_color != NULL) {
+		gdk_cairo_set_source_rgba (cr, border_color);
+		cairo_stroke (cr);
+	}
 
 	cairo_restore (cr);
 
-	gdk_rgba_free (fill_color);
-	gdk_rgba_free (border_color);
+	if (border_gradient_a != NULL) {
+		gdk_rgba_free (border_gradient_a);
+	}
+
+	if (border_gradient_b != NULL) {
+		gdk_rgba_free (border_gradient_b);
+	}
+
+	if (border_color != NULL) {
+		gdk_rgba_free (border_color);
+	}
+
+	if (fill_color != NULL) {
+		gdk_rgba_free (fill_color);
+	}
 }
 
 static gboolean
@@ -975,6 +1034,16 @@ adwaita_engine_class_init (AdwaitaEngineClass *klass)
 								  "Focus border color",
 								  GDK_TYPE_RGBA, 0));
 	gtk_theming_engine_register_property (ADWAITA_NAMESPACE, NULL,
+					      g_param_spec_boxed ("focus-border-gradient-a",
+								  "Focus border gradient A",
+								  "Focus border gradient A",
+								  GDK_TYPE_RGBA, 0));
+	gtk_theming_engine_register_property (ADWAITA_NAMESPACE, NULL,
+					      g_param_spec_boxed ("focus-border-gradient-b",
+								  "Focus border gradient B",
+								  "Focus border gradient B",
+								  GDK_TYPE_RGBA, 0));
+	gtk_theming_engine_register_property (ADWAITA_NAMESPACE, NULL,
 					      g_param_spec_boxed ("focus-fill-color",
 								  "Focus fill color",
 								  "Focus fill color",
diff --git a/themes/Adwaita/gtk-3.0/gtk.css b/themes/Adwaita/gtk-3.0/gtk.css
index e28e3a4..0722e1e 100644
--- a/themes/Adwaita/gtk-3.0/gtk.css
+++ b/themes/Adwaita/gtk-3.0/gtk.css
@@ -35,7 +35,8 @@
 @define-color error_fg_color rgb (166, 38, 38);
 @define-color error_bg_color rgb (237, 54, 54);
 
- define-color keyboard_focus_color #71acea;
+ define-color keyboard_focus_border_a #a2c9f1;
+ define-color keyboard_focus_border_b #6794cf;
 
 @define-color chrome_bg_color #1e1a17;
 @define-color chrome_fg_color #fff;
@@ -132,9 +133,11 @@
     color: @theme_fg_color;
     border-radius: 3;
 
-    /* Engine settings */
-    -adwaita-focus-fill-color: alpha (@keyboard_focus_color, 0.165);
-    -adwaita-focus-border-color: @keyboard_focus_color;
+    -GtkWidget-focus-line-width: 1;
+    -adwaita-focus-border-color: @keyboard_focus_border_a;
+    -adwaita-focus-fill-color: none;
+    -adwaita-focus-border-gradient-a: none;
+    -adwaita-focus-border-gradient-b: none;
 }
 
 *:hover {
@@ -305,7 +308,12 @@ GtkScrollbar.button:insensitive {
 .button {
     padding: 3;
 
-    border-radius: 3;
+    -adwaita-focus-fill-color: alpha (@theme_base_color, 0.35);
+    -adwaita-focus-border-gradient-a: alpha (@keyboard_focus_border_a, 0.62);
+    -adwaita-focus-border-gradient-b: alpha (@keyboard_focus_border_b, 0.62);
+    -GtkWidget-focus-line-width: 2;
+
+    border-radius: 2;
     border-width: 1;
     border-color: @button_border;
     border-style: solid;