From: Matthias Clasen <mclasen@redhat.com>
Date: Sat, 26 May 2012 02:03:47 +0000 (-0400)
Subject: Add a custom css example
X-Git-Url: http://pileus.org/git/?a=commitdiff_plain;h=46cc815829639deaa8b027508fb1054821127c83;p=~andy%2Fgtk

Add a custom css example
---

diff --git a/demos/gtk-demo/Makefile.am b/demos/gtk-demo/Makefile.am
index 7e90f2d21..97fe9dbc1 100644
--- a/demos/gtk-demo/Makefile.am
+++ b/demos/gtk-demo/Makefile.am
@@ -44,6 +44,7 @@ demos =						\
 	textview.c				\
 	textscroll.c				\
 	theming_style_classes.c			\
+	theming_custom_css.c			\
 	toolpalette.c				\
 	transparent.c				\
 	tree_store.c				\
@@ -78,6 +79,7 @@ EXTRA_DIST += 				\
 	application.ui			\
 	menus.ui			\
 	theming.ui			\
+	fancy.css			\
 	gtk-logo-24.png			\
 	gtk-logo-48.png			\
 	org.gtk.Demo.gschema.xml
@@ -130,7 +132,8 @@ democode_DATA = \
 	demo.ui			\
 	menus.ui		\
 	application.ui		\
-	theming.ui
+	theming.ui		\
+	fancy.css
 
 DISTCLEANFILES = demos.h
 
diff --git a/demos/gtk-demo/fancy.css b/demos/gtk-demo/fancy.css
new file mode 100644
index 000000000..a3d2ac3cb
--- /dev/null
+++ b/demos/gtk-demo/fancy.css
@@ -0,0 +1,24 @@
+GtkButton#fancy {
+  font-weight: bold;
+  background-image: linear-gradient(135deg, yellow, blue);
+  border-radius: 20px;
+  color: white;
+}
+
+GtkButton#fancy:hover {
+  font-weight: bold;
+  background-image: linear-gradient(135deg, blue, yellow);
+  border-radius: 20px;
+  color: white;
+}
+
+GtkButton#fancy:active {
+  font-weight: bold;
+  background-image: linear-gradient(yellow, yellow);
+  border-radius: 20px;
+  color: black;
+}
+
+GtkButton#fancy * {
+  color: inherit;
+}
diff --git a/demos/gtk-demo/theming_custom_css.c b/demos/gtk-demo/theming_custom_css.c
new file mode 100644
index 000000000..00cb22ac3
--- /dev/null
+++ b/demos/gtk-demo/theming_custom_css.c
@@ -0,0 +1,65 @@
+/* Theming/Custom CSS :: fancy.css
+ *
+ * GTK+ uses CSS for theming. If required, applications can
+ * install their own custom CSS style provider to achieve
+ * special effects.
+ *
+ * Doing this has the downside that your application will no
+ * longer react to the users theme preferences, so this should
+ * be used sparingly.
+ */
+
+#include <gtk/gtk.h>
+#include "demo-common.h"
+
+static GtkWidget *window = NULL;
+
+GtkWidget *
+do_theming_custom_css (GtkWidget *do_widget)
+{
+  GtkWidget *box;
+  GtkWidget *button;
+  GtkCssProvider *provider;
+  gchar *filename;
+
+  if (!window)
+    {
+      window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
+      gtk_window_set_screen (GTK_WINDOW (window),
+                             gtk_widget_get_screen (do_widget));
+      gtk_window_set_title (GTK_WINDOW (window), "Custom CSS");
+      gtk_container_set_border_width (GTK_CONTAINER (window), 18);
+      g_signal_connect (window, "destroy",
+                        G_CALLBACK (gtk_widget_destroyed), &window);
+      box = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 6);
+      gtk_container_add (GTK_CONTAINER (window), box);
+      button = gtk_button_new_with_label ("Plain");
+      gtk_box_pack_start (GTK_BOX (box), button, TRUE, TRUE, 0);
+      button = gtk_button_new_with_label ("Fancy");
+      gtk_box_pack_start (GTK_BOX (box), button, TRUE, TRUE, 0);
+      gtk_widget_set_name (button, "fancy");
+
+      provider = gtk_css_provider_new ();
+      filename = demo_find_file ("fancy.css", NULL);
+      gtk_css_provider_load_from_path (provider, filename, NULL);
+      gtk_style_context_add_provider_for_screen (gtk_widget_get_screen (do_widget),
+                                                 GTK_STYLE_PROVIDER (provider),
+                                                 GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
+      g_object_unref (provider);
+      g_free (filename);
+
+      gtk_widget_show_all (box);
+    }
+
+  if (!gtk_widget_get_visible (window))
+    {
+      gtk_widget_show (window);
+    }
+  else
+    {
+      gtk_widget_destroy (window);
+      window = NULL;
+    }
+
+  return window;
+}