0.6.0 beta

eleventy.config.js

@@ -117,7 +117,7 @@ module.exports = function (eleventyConfig) {
   eleventyConfig.addPassthroughCopy("src/debug/");
 
   // global vars
-  eleventyConfig.addNunjucksGlobal("saga11version", "0.5.5 beta");
+  eleventyConfig.addNunjucksGlobal("saga11version", "0.6 beta");
   // get the theme folder name
   eleventyConfig.addNunjucksGlobal("theme", theme);
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "saga11",
-  "version": "0.5.5beta",
+  "version": "0.6beta",
   "description": "Website builder based on 11ty & netlifycms",
   "main": "eleventy.config.js",
   "scripts": {

src/content/_datapagination/rick-morty-index.njk

@@ -0,0 +1,4 @@
+---
+layout: data/rick-morty-index.njk
+permalink: '/rickandmorty/index.html'
+---

src/content/_datapagination/rick-morty.njk

@@ -4,5 +4,5 @@ pagination:
   alias: character
   size: 1
 layout: data/rick-morty.njk
-permalink: '/rick-morty/{{character.name|slug}}/'
+permalink: '/rickandmorty/{{character.name|slugify}}/'
 ---

src/themes/grunn/layouts/data/rick-morty-index.njk

@@ -0,0 +1,25 @@
+---
+layout: default.njk
+title: "Rick & Morty Characters {{ name }}"
+---
+
+<section class="flex flex-row space-x-4 flex-wrap">
+
+  {% for item in rickandmorty %}
+    <article class="bg-slate-900 m-2">
+    <a href="/rick-morty/{{ item.name |slugify }}">
+
+    {% picture
+      img=item.image,
+      width=[100],
+      sizes="(max-width: 640px) 50vw, 100vw",
+      css= item.name,
+      loading = "lazy"
+    %}
+    {{ item.name }}
+  </a>
+  </article>
+{% endfor %}
+
+</section>
+

src/themes/grunn/layouts/data/rick-morty.njk

@@ -2,7 +2,7 @@
 layout: default
 title: "Rick & Morty Characters {{ name }}"
 ---
-
+This is an example page of using external apis
 <h1 class="text-5xl">{{ character.name }}</h1>
 
   <div class="aspect-video overflow-hidden shadow-lg ">
@@ -24,7 +24,6 @@ Location:
 </a>
 </div>
 
-
 <div>
 {{ character.episode  | length }} Episodes:
 </div>
@@ -33,7 +32,6 @@ Location:
 {% endfor %}
 
 
-
 <section class="flex flex-row space-x-4 flex-wrap">
 
   {% for item in rickandmorty %}