[gtk+] gtk3-demo: Simplify the blendmodes example a bit

[Matthias Clasen <matthiasc src gnome org>]

commit 93f20315d159463b0b8f8cb2a445b807cf6dfd45
Author: Matthias Clasen <mclasen redhat com>
Date:   Mon Jul 4 09:58:15 2016 -0400

    gtk3-demo: Simplify the blendmodes example a bit
    
    Just put all of the template into the resource.

 demos/gtk-demo/css_blendmodes.c   |   37 +------------------------------------
 demos/gtk-demo/css_blendmodes.css |   28 +++++++++++++++++++++++++++-
 2 files changed, 28 insertions(+), 37 deletions(-)
---
diff --git a/demos/gtk-demo/css_blendmodes.c b/demos/gtk-demo/css_blendmodes.c
index 4c4e673..4ce3836 100644
--- a/demos/gtk-demo/css_blendmodes.c
+++ b/demos/gtk-demo/css_blendmodes.c
@@ -34,40 +34,6 @@ struct {
   { NULL }
 };
 
-/*
- * The CSS class to be applied in the blended image. Notice that the first %s
- * is replaced by the content of css_blendmodes.css and the second %s is
- * replaced by the blend mode.
- */
-static const gchar *CSS_TEMPLATE =
-"%s\n"
-"\n"
-"image.blend0 {\n"
-"  background-image: url('resource://css_blendmodes/ducky.png'),\n"
-"                    linear-gradient(to right, red 0%, green 50%, blue 100%);\n"
-"  background-size: cover;\n"
-"  background-blend-mode: %s;\n"
-"  min-width: 200px;\n"
-"  min-height: 200px;\n"
-"}\n"
-"\n"
-"image.blend1 {\n"
-"  background: url('resource://css_blendmodes/blends.png') top center,\n"
-"              url('resource://css_blendmodes/blends.png') bottom center;\n"
-"  background-blend-mode: %s;\n"
-"  min-width: 200px;\n"
-"  min-height: 200px;\n"
-"}\n"
-"\n"
-"image.blend2 {\n"
-"  background: url('resource://css_blendmodes/cmy.jpg') top center,\n"
-"              url('resource://css_blendmodes/cmy.jpg') center center,\n"
-"              url('resource://css_blendmodes/cmy.jpg') bottom center;\n"
-"  background-blend-mode: %s;\n"
-"  min-width: 200px;\n"
-"  min-height: 200px;\n"
-"}\n";
-
 static void
 update_css_for_blend_mode (GtkCssProvider *provider,
                            const gchar    *blend_mode)
@@ -77,8 +43,7 @@ update_css_for_blend_mode (GtkCssProvider *provider,
 
   bytes = g_resources_lookup_data ("/css_blendmodes/css_blendmodes.css", 0, NULL);
 
-  css = g_strdup_printf (CSS_TEMPLATE,
-                         (gchar*) g_bytes_get_data (bytes, NULL),
+  css = g_strdup_printf ((gchar*) g_bytes_get_data (bytes, NULL),
                          blend_mode,
                          blend_mode,
                          blend_mode);
diff --git a/demos/gtk-demo/css_blendmodes.css b/demos/gtk-demo/css_blendmodes.css
index b212e50..fb93282 100644
--- a/demos/gtk-demo/css_blendmodes.css
+++ b/demos/gtk-demo/css_blendmodes.css
@@ -9,7 +9,7 @@ image.duck {
 }
 
 image.gradient {
-    background-image: linear-gradient(to right, red 0%, green 50%, blue 100%);
+    background-image: linear-gradient(to right, red 0%%, green 50%%, blue 100%%);
     min-width: 200px;
     min-height: 200px;
 }
@@ -49,3 +49,29 @@ image.yellow {
     min-width: 200px;
     min-height: 200px;
 }
+
+image.blend0 {
+  background-image: url('resource://css_blendmodes/ducky.png'),
+                    linear-gradient(to right, red 0%%, green 50%%, blue 100%%);
+  background-size: cover;
+  background-blend-mode: %s;
+  min-width: 200px;
+  min-height: 200px;
+}
+
+image.blend1 {
+  background: url('resource://css_blendmodes/blends.png') top center,
+              url('resource://css_blendmodes/blends.png') bottom center;
+  background-blend-mode: %s;
+  min-width: 200px;
+  min-height: 200px;
+}
+
+image.blend2 {
+  background: url('resource://css_blendmodes/cmy.jpg') top center,
+              url('resource://css_blendmodes/cmy.jpg') center center,
+              url('resource://css_blendmodes/cmy.jpg') bottom center;
+  background-blend-mode: %s;
+  min-width: 200px;
+  min-height: 200px;
+}