Show category icon in project previews

5 files changed, 25 insertions, 6 deletions

diff --git a/assets/css/components/_project.scss b/assets/css/components/_project.scss
index 62a7118..4f4cd1b 100644
--- a/assets/css/components/_project.scss
+++ b/assets/css/components/_project.scss
@@ -23,6 +23,9 @@
 
         &:link,
         &:visited {
+            color:           currentColor;
+            text-decoration: none;
+            
             &:hover {
                 @include element('picture') {
                     opacity: .75;
diff --git a/metadata/metadata.yaml b/metadata/metadata.yaml
index 8716b43..226401d 100644
--- a/metadata/metadata.yaml
+++ b/metadata/metadata.yaml
@@ -22,9 +22,12 @@ feeds:
 
 categories:
   personal:
-    dre: Dreams
+    dre:
+      name: Dreams
   projects:
-    emj: Emojis
+    emj:
+      name: Emojis
+      icon: smile
 
 rewrites:
   path:
diff --git a/scripts/metadata_filter.lua b/scripts/metadata_filter.lua
index ad2bb83..8eedc63 100644
--- a/scripts/metadata_filter.lua
+++ b/scripts/metadata_filter.lua
@@ -155,10 +155,9 @@ end
 function resolve_category(categories, category)
     if categories and category then
         category = pandoc.utils.stringify(category)
-        return pandoc.MetaMap({
-            id = pandoc.MetaString(category),
-            name = pandoc.MetaString(categories[category] or category)
-        })
+        data = pandoc.MetaMap(categories[category])
+        data.id = pandoc.MetaString(category)
+        return data
     end
 end
 
diff --git a/templates/layouts/index.html b/templates/layouts/index.html
index c9c695a..1099d27 100644
--- a/templates/layouts/index.html
+++ b/templates/layouts/index.html
@@ -71,6 +71,11 @@ $body$
                     <img class="c-project__picture" src="$it.preview.rel$" />
                 $endif$
                 <div class="c-project__card c-card">
+                    $if(it.category.icon)$
+                        <svg class="c-card__icon o-icon">
+                            <use href="#icon-$it.category.icon$"></use>
+                        </svg>
+                    $endif$
                     <div class="c-card__content">
                         <small class="u-db">$it.category.name$</small>
                         <strong class="u-db">$it.title$</strong>
diff --git a/templates/symbols.svg b/templates/symbols.svg
index e96fd50..acc7f4f 100644
--- a/templates/symbols.svg
+++ b/templates/symbols.svg
@@ -60,5 +60,14 @@
             d="m12.25 5.75c0 3.5899-2.9101 6.5-6.5 6.5m3e-7 0c0 1.1046-0.89543 2-2 2s-2-0.89543-2-2 0.89543-2 2-2 2 0.89543 2 2zm8.5-8.5c0 1.1046-0.89543 2-2 2s-2-0.89543-2-2 0.89543-2 2-2 2 0.89543 2 2zm-10.5 6.4998v-7.9998"
             fill="none" stroke="currentColor" />
       </symbol>
+
+      <symbol id="icon-smile" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
+         <path d="m11.309 9.7658c-0.63143 1.1808-1.8764 1.9842-3.3091 1.9842-1.4381 0-2.6872-0.80955-3.3163-1.9978"
+            fill="none" stroke="currentColor" />
+         <circle cx="8" cy="8" r="6.75" fill="none" stroke="currentColor" />
+         <path d="m10.25 5.75v1.5" fill="none" stroke="currentColor" />
+         <path d="m5.75 5.75v1.5" fill="none" stroke="currentColor" />
+      </symbol>
+
    </defs>
 </svg>