Merge pull request #112 from hankchizljaw/feature/0.6.0-release

Feature/0.6.0 release

.eleventy.js

@@ -1,6 +1,6 @@
 const rssPlugin = require('@11ty/eleventy-plugin-rss');
 const syntaxHighlight = require('@11ty/eleventy-plugin-syntaxhighlight');
-const fs = require("fs");
+const fs = require('fs');
 
 // Import filters
 const dateFilter = require('./src/filters/date-filter.js');
@@ -34,6 +34,7 @@ module.exports = function(config) {
   config.addPassthroughCopy('src/admin/config.yml');
   config.addPassthroughCopy('src/admin/previews.js');
   config.addPassthroughCopy('node_modules/nunjucks/browser/nunjucks-slim.js');
+  config.addPassthroughCopy('src/robots.txt');
 
   const now = new Date();
 
@@ -55,13 +56,13 @@ module.exports = function(config) {
   config.addPlugin(rssPlugin);
   config.addPlugin(syntaxHighlight);
 
-  // 404 
+  // 404
   config.setBrowserSyncConfig({
     callbacks: {
       ready: function(err, browserSync) {
         const content_404 = fs.readFileSync('dist/404.html');
 
-        browserSync.addMiddleware("*", (req, res) => {
+        browserSync.addMiddleware('*', (req, res) => {
           // Provides the 404 content without redirect.
           res.write(content_404);
           res.end();

README.md

@@ -10,7 +10,7 @@ Get started now by **[deploying Hylia to Netlify.][deploy-to-netlify]**
 
 ## Features
 
-Hylia version 0.5.1 features:
+Hylia version 0.6.0 features:
 
 ✍️ A pre-configured [Netlify CMS](https://www.netlifycms.org/) setup  
 🎨 Customisable design tokens to make it your own  

src/_includes/layouts/archive.njk

@@ -1,5 +1,4 @@
 {% extends 'layouts/base.njk' %}
-{% set pageType = 'Post Archive' %}
 
 {# Intro content #}
 {% set introHeading = title %}

src/_includes/layouts/base.njk

@@ -27,6 +27,6 @@
       });
     }
   </script>
-  <script src="https://identity.netlify.com/v1/netlify-identity-widget.js" async defer></script>
+  <script src="https://identity.netlify.com/v1/netlify-identity-widget.js" defer></script>
 </body>
 </html>

src/_includes/layouts/contact.njk

@@ -1,5 +1,4 @@
 {% extends 'layouts/base.njk' %}
-{% set pageType = 'Page' %}
 
 {# Intro content #}
 {% set introHeading = title %}

src/_includes/layouts/home.njk

@@ -1,5 +1,4 @@
 {% extends 'layouts/base.njk' %}
-{% set pageType = 'Homepage' %}
 
 {# Intro content #}
 {% set introHeading = title %}

src/_includes/layouts/page.njk

@@ -1,5 +1,4 @@
 {% extends 'layouts/base.njk' %}
-{% set pageType = 'Page' %}
 
 {# Intro content #}
 {% set introHeading = title %}

src/_includes/layouts/post.njk

@@ -1,5 +1,4 @@
 {% extends 'layouts/base.njk' %}
-{% set pageType = 'Post' %}
 
 {# Intro content #}
 {% set introHeading = title %}

src/_includes/macros/form.njk

@@ -73,7 +73,7 @@
   <br>
   <textarea id="field-{{ name }}"
             name="{{ name }}"
-            {% if data.rows %}rows="{{ data.rows }}"{% else %}rows="10"{% endif %}
+            {% if data.rows %}rows="{{ data.rows }}"{% else %}rows="5"{% endif %}
             cols="100"
             {% if data.required %}required aria-required="true"{% endif %}
             {% if data.autocorrect %}autocorrect="{{ data.autocorrect }}"{% endif %}

src/_includes/partials/components/contact-form.njk

@@ -1,6 +1,6 @@
 {% from "macros/form.njk" import label, field, textarea, button %}
 
-<form name="contact" method="POST" data-netlify="true" action="/YOUR_THANK_YOU_PAGE/" netlify-honeypot="bot-field">
+<form name="contact" method="POST" data-netlify="true" action="/thank-you" netlify-honeypot="bot-field">
   <ol class="[ field-list ]">
     <li class="[ field-list__field-group ]">
       {{ label("What’s your name?", "name") }}
@@ -18,5 +18,5 @@
       <label>Don’t fill this out if you're human: <input name="bot-field" /></label>
     </li>
   </ol>
-  {{ button("Send in your message") }}
-</form>
+  {{ button("Send message") }}
+</form>

src/_includes/partials/global/site-head.njk

@@ -1,10 +1,9 @@
 <a class="skip-link" href="#main-content">Skip to content</a>
 <header role="banner" class="[ site-head ] [ pad-top-700 pad-bottom-700 ">
   <div class="wrapper">
-    <span class="visually-hidden">{{ site.name }}: {{ pageType }}</span>
     <div class="[ site-head__inner ] [ md:box-flex space-between align-center ]">
-      <a href="/" class="[ site-head__site-name ] [ leading-tight ]"{{ 'aria-current=page' if page.url == '/' | safe }}>
-        <span class="visually-hidden">{{ 'Back to homepage' if page.url != '/' else 'Homepage' }}</span>
+      <a href="/" class="[ site-head__site-name ] [ leading-tight ]">
+        <span class="visually-hidden">{{ site.name }} - Home</span>
         <span class="[ site-head__site-name ] [ text-600 ]" aria-hidden="true">{{ site.name }}</span>
       </a>
       {% set ariaLabel = 'navigation' %}

src/admin/config.yml

@@ -2,7 +2,6 @@ backend:
   name: git-gateway
   branch: master
 publish_mode: editorial_workflow
-site_url: "https://example.com"
 media_folder: "src/images"
 public_folder: "/images"
 collections:

src/index.md

@@ -3,8 +3,10 @@ layout: home
 title: A simple starter kit for Eleventy
 postsHeading: Latest posts
 archiveButtonText: See all posts
+metaDesc: 'Hylia is a lightweight Eleventy starter kit to help you to create your own blog or personal website.'
 socialImage: ''
 ---
+
 Hylia is a lightweight [Eleventy](https://11ty.io) starter kit with [Netlify CMS](https://www.netlifycms.org/) pre-configured, so that you can one-click install a progressive, accessible blog in minutes. It also gives you a well organised starting point to extend yourself. It’s by [Andy Bell](https://twitter.com/hankchizljaw) and [friends](https://github.com/aarongustafson/hylia/graphs/contributors).
 
 Get started now by [deploying Hylia to Netlify.](https://app.netlify.com/start/deploy?repository=https://github.com/hankchizljaw/hylia&stack=cms)

src/scss/_typography.scss

@@ -5,7 +5,6 @@
   font-weight: 700;
   font-display: swap;
   src: local('Lora Bold'), local('Lora-Bold'),
-    url('/fonts/lora-v13-latin-700.woff2') format('woff2'),
     url('/fonts/lora-v13-latin-700.woff') format('woff');
 }
 

src/scss/components/_form.scss

@@ -1,34 +1,38 @@
 /* Form */
+
+form {
+  max-width: 35rem;
+}
+
+form br {
+  display: none;
+}
+
 label {
   display: block;
   font-weight: 600;
 }
 
-form br {
-  display: none;
+input,
+select {
+  line-height: 1;
 }
 
 input,
 textarea,
 select {
   background-color: #fff;
-  font-size: 1.25rem;
-  border: 1px solid;
-  margin-top: .15rem;
-  padding: .25em .5em;
+  font: inherit;
+  border: 1px solid var(--color-text);
+  margin-top: 0.15rem;
+  padding: 0.5rem 1rem;
   width: 100%;
-
-  @include apply-utility('font', 'base');
-}
 
-input:focus,
-select:focus,
-textarea:focus {
-  background-color: #ffffeb;
+  @include apply-utility('font', 'base');
 }
 
 label input {
-  margin: -.25rem .5rem 0 0;
+  margin: -0.25rem 0.5rem 0 0;
   width: auto;
   vertical-align: middle;
 }
@@ -56,8 +60,8 @@ legend {
 
   &__description {
     display: block;
-    margin-top: .3rem;
-    font-size: .875rem;
+    margin-top: 0.3rem;
+    font-size: 0.875rem;
     line-height: 1.25;
   }
 
@@ -82,5 +86,3 @@ legend {
     }
   }
 }
-
-

src/scss/components/_nav.scss

@@ -1,6 +1,10 @@
 .nav {
   &__list {
     overflow-x: auto;
+
+    // Add padding and neg margin to allow focus style visibility
+    padding: 0.5rem;
+    margin: -0.5rem;
     -webkit-overflow-scrolling: touch;
     -ms-overflow-style: none;
 

src/scss/global.scss

@@ -14,7 +14,8 @@
 /**
  * GLOBAL STYLES
  */
-html, body {
+html,
+body {
   height: 100%;
 }
 
@@ -40,6 +41,11 @@ hr {
   margin: get-size(900) auto;
 }
 
+:focus {
+  outline: 1px solid var(--color-theme-primary-glare);
+  outline-offset: 0.25rem;
+}
+
 /**
  * PROJECT IMPORTS
  */

src/tags.njk

@@ -16,7 +16,6 @@ permalink: /tags/{{ tag }}/
 ---
 
 {% extends 'layouts/base.njk' %}
-{% set pageType = 'Tag Archive' %}
 
 {# Intro content #}
 {% set introHeading %}Posts filed under “{{ tag }}”{% endset %}