Make about page editable from CMS

README.md

@@ -7,6 +7,7 @@ My Online Cookbook is a starter kit to create your own website of recipes, using
 Demo (this is what you get out of the box) : [https://myonlinecookbook.netlify.app/](https://myonlinecookbook.netlify.app/)
 
 Get started now by forking the project or deploy to Netlify :
+
 [![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/maeligg/my-online-cookbook&stack=cms)
 
 ## Features

src/_includes/layouts/home.njk

@@ -20,7 +20,7 @@ bodyClass: c-home
         </div>
     </section>
 
-    {% if collections["Favourite ⭐"] %}}
+    {% if collections["Favourite ⭐"] %}
         <section class="u-bgc-grey-100">
             <div class="l-container">
                 <h2>{{ favouriteRecipes }}</h2>

src/admin/config.yml

@@ -42,3 +42,12 @@ collections:
           - {label: "Primary color", name: "primaryColor", widget: "color", hint: "make sure to choose a color that is light enough to display as a background behind dark text"}
           - {label: "Secondary color", name: "secondaryColor", widget: "color", hint: "used for links and focus styles"}
           - {label: "Search label", name: "searchLabel", widget: "string"}
+  - name: "pages"
+    label: "Pages"
+    files:
+    - name: "about"
+      label: "About page"
+      file: "src/about.md"
+      fields:
+        - {label: "Title", name: "title", widget: "string"}
+        - {label: "Body", name: "body", widget: "markdown"}

src/scss/_global.scss

@@ -24,6 +24,7 @@ body {
 main {
     display: flex;
     flex-direction: column;
+    margin-bottom: 30px;
 }
 
 // The x-cloak attribute is automatically removed from elements when Alpine initializes. They should not be visible before then to avoid flickering content