Updates

.editorconfig

@@ -13,7 +13,7 @@ block_comment_start = /*
 block_comment = *
 block_comment_end = */
 
-[*.{scss,css,js,json,yml,md}]
+[*.{scss,css,js,json}]
 indent_size = 2
 
 [acf-json/*.json]

.github/workflows/test.yml

@@ -1,31 +1,39 @@
 name: Test
 
 on:
-  push:
-    branches: [ main ]
+    push:
+        branches: [ main ]
+    pull_request:
+        branches: [ main ]
 
-  workflow_dispatch:
+    workflow_dispatch:
 
 jobs:
-  lint:
-    name: Lint
-    runs-on: ubuntu-latest
+    lint:
+        name: Lint
+        runs-on: ubuntu-latest
 
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v3
-      - name: Set up Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: 'lts/*'
-      - name: Install dependencies
-        run: npm ci
-      - name: Run linter
-        run: npm run sass:lint
-      - name: Check EditorConfig configuration
-        run: test -f .editorconfig
-      - name: Check adherence to EditorConfig
-        uses: greut/eclint-action@v0
-        with:
-          eclint_args: |
-            -exclude=css/*
+        steps:
+        -
+            name: Checkout repository
+            uses: actions/checkout@v3
+        -
+            name: Set up Node.js
+            uses: actions/setup-node@v3
+            with:
+                node-version: 'lts/*'
+        -
+            name: Install dependencies
+            run: npm ci
+        -
+            name: Run linter
+            run: npm run sass:lint
+        -
+            name: Check EditorConfig configuration
+            run: test -f .editorconfig
+        -
+            name: Check adherence to EditorConfig
+            uses: greut/eclint-action@v0
+            with:
+                eclint_args: |
+                    -exclude=css/*

README.md

@@ -1,13 +1,13 @@
 <p>
-  <a href="https://sprucecss.com/">
-    <br>
-    <picture>
-      <source media="(prefers-color-scheme: light)" srcset="./.github/spruce-logo-dark.svg">
-      <source media="(prefers-color-scheme: dark)" srcset="./.github/spruce-logo-light.svg">
-      <img alt="Spruce CSS" width="140" src="./.github/spruce-logo-dark.svg">
-    </picture>
-    <br>
-  </a>
+    <a href="https://sprucecss.com/">
+        <br>
+        <picture>
+            <source media="(prefers-color-scheme: light)" srcset="./.github/spruce-logo-dark.svg">
+            <source media="(prefers-color-scheme: dark)" srcset="./.github/spruce-logo-light.svg">
+            <img alt="Spruce CSS" width="140" src="./.github/spruce-logo-dark.svg">
+        </picture>
+        <br>
+    </a>
 </p>
 
 **Welcome to the official documentation of **Spruce Docs** Elventy theme. A small template you can use to document any of your projects.**

package.json

@@ -21,21 +21,21 @@
     "@11ty/eleventy": "^2.0.1",
     "@11ty/eleventy-navigation": "^0.3.5",
     "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
-    "del-cli": "^5.0.0",
-    "dotenv": "^16.0.3",
+    "del-cli": "^5.0.1",
+    "dotenv": "^16.3.1",
     "eleventy-plugin-toc": "^1.1.5",
-    "eslint": "^8.41.0",
+    "eslint": "^8.48.0",
     "eslint-config-airbnb-base": "^15.0.0",
-    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-import": "^2.28.1",
     "himalaya": "^1.1.0",
     "html-minifier": "^4.0.0",
     "moment": "^2.29.4",
     "markdown-it-anchor": "^8.6.7",
     "npm-run-all": "^4.1.5",
     "pagefind": "^0.12.0",
-    "sass": "^1.62.1",
-    "sprucecss": "^2.2.0",
-    "stylelint": "^15.6.2",
+    "sass": "^1.66.1",
+    "sprucecss": "^2.2.2",
+    "stylelint": "^15.10.3",
     "stylelint-config-sass-guidelines": "^10.0.0",
     "stylelint-order": "^6.0.3"
   },

src/faq.md

@@ -4,20 +4,28 @@ summary: "Have some questions? You may find it here."
 displaySummary: true
 layout: "layouts/faq.html"
 faqs:
-- title: "Spruce CSS"
-  items:
-    - title: "Why Make Another CSS Framework?"
-      description: "As you may know, there are many CSS frameworks (hundreds of them, and a lot of them are not maintained today). Everybody can choose one that suits their work style or project requirements. So why make another one? It is certainly not because we can do it better but because we want to do it our way. We want to be in control and make decisions."
-    - title: "It Is Opinionated"
-      description: "Each system is opinionated but on a different level; this is valid for Spruce too. We don’t want to vote for (strictly) any particular solution (because there is always more than one), but we will show you what we think is the best for us (and maybe for you too). We don’t believe there is a good or bad solution, but we can learn from any of them."
-    - title: "We Left the Grid Out"
-      description: "One controversial decision we made with Spruce is to leave a classical grid system out. Because of the late CSS layout model developments like Flexbox and Grid, we think it can be eliminated; this doesn’t mean that we won’t show you how to make layouts with ease, but we try to make it the modern way."
-    - title: "Coding Style Guide and Practices"
-      description: "Where it is possible, we use elements and/or attributes to style elements, but it is still a class-based framework."
-- title: "Demo FAQ"
-  items:
-    - title: "Lorem ipsum dolor sit amet"
-      description: "Nulla porta felis mollis est suscipit vestibulum. Integer fermentum ullamcorper leo a pulvinar."
-    - title: "Donec rhoncus facilisis velit, efficitur interdum"
-      description: "Ut at nunc tristique, tincidunt tortor eget, consequat magna. Phasellus cursus nisi et orci porttitor feugiat. Etiam porttitor consequat sapien eu elementum. Nulla in interdum enim, non molestie tellus. In id sagittis nulla. Morbi ultrices eros libero, quis vehicula mauris egestas vitae. Fusce varius tortor risus. Aliquam id cursus massa."
+-
+    title: "Spruce CSS"
+    items:
+    -
+        title: "Why Make Another CSS Framework?"
+        description: "As you may know, there are many CSS frameworks (hundreds of them, and a lot of them are not maintained today). Everybody can choose one that suits their work style or project requirements. So why make another one? It is certainly not because we can do it better but because we want to do it our way. We want to be in control and make decisions."
+    -
+        title: "It Is Opinionated"
+        description: "Each system is opinionated but on a different level; this is valid for Spruce too. We don’t want to vote for (strictly) any particular solution (because there is always more than one), but we will show you what we think is the best for us (and maybe for you too). We don’t believe there is a good or bad solution, but we can learn from any of them."
+    -
+        title: "We Left the Grid Out"
+        description: "One controversial decision we made with Spruce is to leave a classical grid system out. Because of the late CSS layout model developments like Flexbox and Grid, we think it can be eliminated; this doesn’t mean that we won’t show you how to make layouts with ease, but we try to make it the modern way."
+    -
+        title: "Coding Style Guide and Practices"
+        description: "Where it is possible, we use elements and/or attributes to style elements, but it is still a class-based framework."
+-
+    title: "Demo FAQ"
+    items:
+    -
+        title: "Lorem ipsum dolor sit amet"
+        description: "Nulla porta felis mollis est suscipit vestibulum. Integer fermentum ullamcorper leo a pulvinar."
+    -
+        title: "Donec rhoncus facilisis velit, efficitur interdum"
+        description: "Ut at nunc tristique, tincidunt tortor eget, consequat magna. Phasellus cursus nisi et orci porttitor feugiat. Etiam porttitor consequat sapien eu elementum. Nulla in interdum enim, non molestie tellus. In id sagittis nulla. Morbi ultrices eros libero, quis vehicula mauris egestas vitae. Fusce varius tortor risus. Aliquam id cursus massa."
 ---

src/index.md

@@ -2,29 +2,37 @@
 title: "Document your next project a little bit better."
 headline: "Eleventy / Spruce CSS"
 btns:
-    - caption: "Introduction"
-      url: "/getting-started/introduction/"
-      type: "regular"
-    - caption: "Changelog"
-      url: "/changelog/"
-      type: "outline"
+-
+    caption: "Introduction"
+    url: "/getting-started/introduction/"
+    type: "regular"
+-
+    caption: "Changelog"
+    url: "/changelog/"
+    type: "outline"
 summary: "Do you work on a project that requires a documentation? This theme is for you. It's a simple, clean and responsive theme for Eleventy."
 displaySummary: true
 layout: "layouts/front-page.html"
 overview:
-    - title: "Getting Started"
-      url: "/getting-started/"
-      description: "Start here and get to know this minimalistic Eleventy theme."
-    - title: "Customization"
-      url: "/customization/"
-      description: "Built on the top of Spruce CSS, you can easily customize its look."
+-
+    title: "Getting Started"
+    url: "/getting-started/"
+    description: "Start here and get to know this minimalistic Eleventy theme."
+-
+    title: "Customization"
+    url: "/customization/"
+    description: "Built on the top of Spruce CSS, you can easily customize its look."
 faqs:
-    - title: "Why Make Another CSS Framework?"
-      description: "As you may know, there are many CSS frameworks (hundreds of them, and a lot of them are not maintained today). Everybody can choose one that suits their work style or project requirements. So why make another one? It is certainly not because we can do it better but because we want to do it our way. We want to be in control and make decisions."
-    - title: "It Is Opinionated"
-      description: "Each system is opinionated but on a different level; this is valid for Spruce too. We don’t want to vote for (strictly) any particular solution (because there is always more than one), but we will show you what we think is the best for us (and maybe for you too). We don’t believe there is a good or bad solution, but we can learn from any of them."
-    - title: "We Left the Grid Out"
-      description: "One controversial decision we made with Spruce is to leave a classical grid system out. Because of the late CSS layout model developments like Flexbox and Grid, we think it can be eliminated; this doesn’t mean that we won’t show you how to make layouts with ease, but we try to make it the modern way."
-    - title: "Coding Style Guide and Practices"
-      description: "Where it is possible, we use elements and/or attributes to style elements, but it is still a class-based framework."
+-
+    title: "Why Make Another CSS Framework?"
+    description: "As you may know, there are many CSS frameworks (hundreds of them, and a lot of them are not maintained today). Everybody can choose one that suits their work style or project requirements. So why make another one? It is certainly not because we can do it better but because we want to do it our way. We want to be in control and make decisions."
+-
+    title: "It Is Opinionated"
+    description: "Each system is opinionated but on a different level; this is valid for Spruce too. We don’t want to vote for (strictly) any particular solution (because there is always more than one), but we will show you what we think is the best for us (and maybe for you too). We don’t believe there is a good or bad solution, but we can learn from any of them."
+-
+    title: "We Left the Grid Out"
+    description: "One controversial decision we made with Spruce is to leave a classical grid system out. Because of the late CSS layout model developments like Flexbox and Grid, we think it can be eliminated; this doesn’t mean that we won’t show you how to make layouts with ease, but we try to make it the modern way."
+-
+    title: "Coding Style Guide and Practices"
+    description: "Where it is possible, we use elements and/or attributes to style elements, but it is still a class-based framework."
 ---

src/posts/getting-started/posts/content-management.md

@@ -2,9 +2,9 @@
 title: "Content Management"
 summary: "Today more people and experts write about accessibility. For the better progression it is a good idea to read them."
 eleventyNavigation:
-  key: Content Management
-  parent: Getting Started
-  order: 5
+    key: Content Management
+    parent: Getting Started
+    order: 5
 ---
 
 Adding content to the template is easy as almost everything is in Eleventy.

src/posts/getting-started/posts/features.md

@@ -2,9 +2,9 @@
 title: "Features"
 summary: "We tried to make a simple but well-structured theme. Managing the content is straightforward but still comes with some helpful features."
 eleventyNavigation:
-  key: Features
-  parent: Getting Started
-  order: 2
+    key: Features
+    parent: Getting Started
+    order: 2
 ---
 
 We tried to make a simple but well-structured theme. Managing the content is straightforward but still comes with some helpful features.

src/posts/getting-started/posts/introduction.md

@@ -2,9 +2,9 @@
 title: "Introduction"
 summary: "Welcome to the official documentation of Spruce Docs Elventy theme. A small template that you can use to document any of your projects."
 eleventyNavigation:
-  key: Introduction
-  parent: Getting Started
-  order: 1
+    key: Introduction
+    parent: Getting Started
+    order: 1
 ---
 
 Welcome to the official documentation of **Spruce Docs** Elventy theme. A small template that you can use to document any of your projects.

src/posts/getting-started/posts/setup.md

@@ -2,9 +2,9 @@
 title: "Setup"
 summary: "We use eleventy --serve and compile Sass with sass-cli with npm scripts."
 eleventyNavigation:
-  key: Setup
-  parent: Getting Started
-  order: 4
+    key: Setup
+    parent: Getting Started
+    order: 4
 ---
 
 ## Clone the repository

src/scss/section/_footer.scss

@@ -10,7 +10,6 @@
 
   &__inner {
     @include layout-grid('l', 12rem);
-
   }
 
   &__logo {