_includes/card_recipe.html

@@ -5,11 +5,11 @@ description:
   type: 'string'
 image:
   type: 'hash'
-  default: 
-    path: 'public/59c6b7ef75334ab1dd8d9a1c9bf/default.png'
 star:
   type: 'integer'
   default: 0
+url:
+  type: 'string'
 ---
 <div class="card mb-3">
   <div class="d-flex align-items-center justify-content-center g-0">
@@ -23,11 +23,14 @@ star:
     </div>
     <div class="d-flex w-100 ps-4">
       <div class="card-body d-flex flex-column justify-content-between h-100">
-        <p class="card-title fw-bold fs-3">{{- title -}}</p>
+        <p class="card-title fw-bold fs-3">
+          <a href="{{ url | component_escape }}">
+            {{- title -}}
+          </a>
+        </p>
         <p class="card-text fst-italic">
-          {{- description | truncatewords: 10, "…" -}}
+          {{- description | truncatewords: 16, '…' -}}
         </p>
-
         {% assign rating = star %}
         <div class="stars d-flex align-items-center justify-content-start">
           {% for i in (1..5) %}

_includes/theme/card_recipe.html

@@ -13,6 +13,7 @@ i18n:
     title: recipe.title,
     description: recipe.description,
     image: recipe.image,
-    star: recipe.star
+    star: recipe.star,
+    url: '#?'
   %}
 {% endfor %}

_layouts/recipe.html

@@ -0,0 +1,9 @@
+---
+layout: "default"
+---
+<article id="{{ page.recipe }}">
+  <header>
+    <h1>{{ page.title }}</h1>
+    <p class="lead">{{ page.metadata.description }}</p>
+  </header>
+</article>

_layouts/recipes.html

@@ -0,0 +1,20 @@
+---
+layout: "default"
+---
+<div class="container">
+  {% render 'sutty/title.html', title: page.title, class: 'pt-5 pb-3', h: '1', description: page.description %}
+
+  {% if page.recipes == empty %}
+    <h1>Error: No recipes were processed</h1>
+  {% else %}
+    <div class="row row-cols-1 row-cols-md-2 g-0 w-100">
+      {% for recipe in page.recipes %}
+        {% assign icon = recipe.metadata.icon | default: 'public/59c6b7ef75334ab1dd8d9a1c9bf/default.png' %}
+        {% assign image = 'path,description' | create_hash: icon, recipe.description %}
+        <div class="col">
+          {% render 'card_recipe.html', title: recipe.title, description: recipe.description, image:, star: recipe.metadata.features.status, url: recipe.url %}
+        </div>
+      {% endfor %}
+    </div>
+  {% endif %}
+</div>

_plugins/routes.rb

@@ -1,4 +1,21 @@
 # frozen_string_literal: true
 
 Jekyll::Router.draw do |router|
+  get '/:recipe/', recipe: (site.data.dig('recipes') || {}).keys do |page, recipe|
+    page.data['metadata'] = site.data.dig('recipes', recipe)
+    page.data['title'] = recipe
+    page.data['description'] = page['metadata']['description']
+    page.data['categories'] = [ page['metadata']['category'] ]
+    page.data['uuid'] = recipe
+  end
+
+  get '/recipes/' do |page|
+    page.data['title'] = 'Software recipes'
+    page.data['description'] = "You can use these recipes (What's a recipe?) 
+with Co-op Cloud."
+    page.data['uuid'] = SecureRandom.uuid
+    page.data['recipes'] = site.pages.select do |p|
+      p['layout'] == 'recipe'
+    end
+  end
 end