[recipes] Redo the category coloring

[Matthias Clasen <matthiasc src gnome org>]

commit 066db48504d94c270caa11d408fd0ebc2be0942d
Author: Matthias Clasen <mclasen redhat com>
Date:   Wed Mar 29 06:05:01 2017 -0400

    Redo the category coloring
    
    Instead of setting a custom style provider on each tile,
    predefine style classes for the colors we have and use
    them on the tiles.

 src/category.css          |   13 ++++++++++++
 src/gr-category-tile.c    |   48 ++++++++++++++------------------------------
 src/gr-cuisine.c          |    2 +
 src/recipes.gresource.xml |    1 +
 4 files changed, 31 insertions(+), 33 deletions(-)
---
diff --git a/src/category.css b/src/category.css
new file mode 100644
index 0000000..c6cd9b6
--- /dev/null
+++ b/src/category.css
@@ -0,0 +1,13 @@
+.tile.view.color-tile0 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #215d9c; 
}
+.tile.view.color-tile1 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #297bcc; 
}
+.tile.view.color-tile2 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #c4a000; 
}
+.tile.view.color-tile3 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #75505b; 
}
+.tile.view.color-tile4 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #cc0000; 
}
+.tile.view.color-tile5 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #4e9a06; 
}
+.tile.view.color-tile6 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #9c29ca; 
}
+.tile.view.color-tile7 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #729fcf; 
}
+.tile.view.color-tile8 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #ac5500; 
}
+.tile.view.color-tile9 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #2944cc; 
}
+.tile.view.color-tile10 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: 
#44cc29; }
+.tile.view.color-tile11 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: 
#00cc00; }
+.tile.view.color-tile12 { border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: 
#a000c4; }
diff --git a/src/gr-category-tile.c b/src/gr-category-tile.c
index 630030d..d8416eb 100644
--- a/src/gr-category-tile.c
+++ b/src/gr-category-tile.c
@@ -42,40 +42,23 @@ struct _GrCategoryTile
 
 G_DEFINE_TYPE (GrCategoryTile, gr_category_tile, GTK_TYPE_BUTTON)
 
-static const char *colors[] = {
-        "#215d9c",
-        "#297bcc",
-        "#29cc5d",
-        "#c4a000",
-        "#75505b",
-        "#cc0000",
-        "#4e9a06",
-        "#9c29ca",
-        "#729fcf",
-        "#ac5500",
-        "#2944cc",
-        "#44cc29",
-        "#00cc00",
-        "#a000c4"
-};
-
-static const char *
+static char *
 get_category_color (GrDiets diets)
 {
         switch (diets) {
-        case GR_DIET_GLUTEN_FREE: return colors[0];
-        case GR_DIET_NUT_FREE:    return colors[1];
-        case GR_DIET_VEGAN:       return colors[2];
-        case GR_DIET_VEGETARIAN:  return colors[3];
-        case GR_DIET_MILK_FREE:   return colors[4];
-        default:                  return colors[5];
+        case GR_DIET_GLUTEN_FREE: return g_strdup_printf ("color-tile%d", 0);
+        case GR_DIET_NUT_FREE:    return g_strdup_printf ("color-tile%d", 1);
+        case GR_DIET_VEGAN:       return g_strdup_printf ("color-tile%d", 2);
+        case GR_DIET_VEGETARIAN:  return g_strdup_printf ("color-tile%d", 3);
+        case GR_DIET_MILK_FREE:   return g_strdup_printf ("color-tile%d", 4);
+        default:                  return g_strdup_printf ("color-tile%d", 5);
         }
 }
 
-static const char *
+static char *
 get_category_color_for_label (const char *label)
 {
-        return colors[g_str_hash (label) % G_N_ELEMENTS (colors)];
+        return g_strdup_printf ("color-tile%d", g_str_hash (label) % 13);
 }
 
 static void
@@ -122,13 +105,12 @@ GtkWidget *
 gr_category_tile_new (GrDiets diet)
 {
         GrCategoryTile *tile;
-        g_autofree char *css;
+        g_autofree char *color = NULL;
 
         tile = g_object_new (GR_TYPE_CATEGORY_TILE, NULL);
         category_tile_set_category (tile, diet);
-
-        css = g_strdup_printf ("border-bottom: 3px solid %s", get_category_color (diet));
-        gr_utils_widget_set_css_simple (GTK_WIDGET (tile), css);
+        color = get_category_color (diet);
+        gtk_style_context_add_class (gtk_widget_get_style_context (GTK_WIDGET (tile)), color);
 
         return GTK_WIDGET (tile);
 }
@@ -138,14 +120,14 @@ gr_category_tile_new_with_label (const char *category,
                                  const char *label)
 {
         GrCategoryTile *tile;
-        g_autofree char *css;
+        g_autofree char *color = NULL;
 
         tile = g_object_new (GR_TYPE_CATEGORY_TILE, NULL);
         gtk_label_set_label (GTK_LABEL (tile->label), label);
         tile->category = g_strdup (category);
 
-        css = g_strdup_printf ("border-bottom: 3px solid %s", get_category_color_for_label (label));
-        gr_utils_widget_set_css_simple (GTK_WIDGET (tile), css);
+        color = get_category_color_for_label (label);
+        gtk_style_context_add_class (gtk_widget_get_style_context (GTK_WIDGET (tile)), color);
 
         return GTK_WIDGET (tile);
 }
diff --git a/src/gr-cuisine.c b/src/gr-cuisine.c
index 485872f..1a4870c 100644
--- a/src/gr-cuisine.c
+++ b/src/gr-cuisine.c
@@ -171,6 +171,8 @@ gr_cuisine_get_css (const char *import_url)
 
         s = g_string_new ("");
 
+        g_string_append (s, "@import url(\"resource:///org/gnome/Recipes/category.css\");\n");
+
         g_string_append_printf (s, "@import url(\"%s\");\n", import_url);
 
         p = css;
diff --git a/src/recipes.gresource.xml b/src/recipes.gresource.xml
index 218ad60..b33e1fc 100644
--- a/src/recipes.gresource.xml
+++ b/src/recipes.gresource.xml
@@ -35,6 +35,7 @@
     <file>recipes-light.css</file>
     <file>recipes-dark.css</file>
     <file>cuisine.css</file>
+    <file>category.css</file>
     <file>icons/16x16/apps/garlic-content-symbolic.symbolic.png</file>
     <file>icons/24x24/apps/garlic-content-symbolic.symbolic.png</file>
     <file>icons/32x32/apps/garlic-content-symbolic.symbolic.png</file>