slow-steps 0.1.11 → 0.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: c5221f077e12c5832eab33a312f51422a160857b6a737bdbe83b6f456f6055e8
-  data.tar.gz: 93666e548893b8e7924368f197304b9bd6c3b143219177513cb7e1d6ab3330b6
+  metadata.gz: d9d1c88ec0b493bea3723570d98ef400e5d009e0e3b410909808c6b35e17e845
+  data.tar.gz: 978803f523fdbc4efc9b2acbd6e6f3f8f0e9922fc2968aa2284ec701496a71b0
 SHA512:
-  metadata.gz: c103bda5ff2d2f0cdbb02a82bff1100da7d1cc64351a35b6d9132f516bc2bc3cf5a3605460bb675c433fdd70aa8c44bcdf0b37cbbf64ec4054b920b43238103d
-  data.tar.gz: 03a69ac4ab04684b74376a951f8f8d5d8ea8f5405a36513773af1c1d0813423f2ad4aedf5c974953dfc245f69c4a9260341c22e6f841166ed4d07630b52d3f59
+  metadata.gz: '028f491628453ae0c41ae8d4edc2a9657c0dc84adac901d32ef3868ff40d7df593cf5fd65d5dc1137b32964eae1f208962b49cd0fc0e6c58cfed934b9b1f554b'
+  data.tar.gz: b4a15f9e3cc37c5a52522460f95098b6edf54858184113a3c1dcffd1c81fa42643a909094a8bb08e544acb827975b5daba41ab7c3d917a463dbed7f56776e5fa

data/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2021 Made Slowly and contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

data/README.md

@@ -1,55 +1,53 @@
 ---
 ---
-# Slow Steps, a Jekyll theme
+# [Slow Steps, a Jekyll theme](https://www.gaitq.madeslowly.xyz/clinician/about/)
 
-A jekyll theme built for GaitQ
+[![Ruby gem](https://badge.fury.io/rb/slow-steps.svg)](https://badge.fury.io/rb/slow-steps)
+
+[![LICENSE](https://img.shields.io/badge/license-MIT-lightgrey.svg)](https://github.com/madeslowly/slow-steps/blob/master/LICENSE)
+
+[![Jekyll](https://img.shields.io/badge/jekyll-%3E%3D%203.7-blue.svg)](https://jekyllrb.com/)
+
+A bold jekyll theme built for gaitQ. Designed to have two distinct styling, depending on current URL.
 
 ## Jekyll Theme Scaffolding
 
-How this repo is organised and what the various files are. All posts, layouts, includes, stylesheets, assets, and whatever else is grouped nicely under the root folder. The compiled Jekyll site outputs to `_site/`, which is never pushed to this repo, see https://www.gaitq.madeslowly.xyz/. General flow starts with a `.md` file in our root. With Front Matter, we declare our layout which points to a structural `.html` file in `_layouts`. From here, the layout file can call in data from our `_config.yml` with `{{ site.variable }}` and from any of our `YAML` files in `_data/file.yml` with `{{ site.data.file.variable }}`. The layout can also pull in other structural html snippets from `_includes` with `{% raw %}{% include relative/path/file.html %}{% endraw %}`.
+How this repo is organised and what the various files are. All posts, layouts, includes, stylesheets, assets, and whatever else is grouped  under the root folder. The compiled Jekyll site outputs to `_site/`, which is never pushed to this repo, see https://www.gaitq.madeslowly.xyz/. General flow starts with a `.md` file in our root. With Front Matter, we declare our layout which points to a structural `.html` file in `_layouts`. From here, the layout file can call in data from our `_config.yml` with `{{ site.variable }}` and from any of our `YAML` files in `_data/file.yml` with `{{ site.data.file.variable }}`. The layout can also pull in other structural html snippets from `_includes` with `{% raw %}{% include relative/path/file.html %}{% endraw %}`.
 
 It is worth noting that _include files can also perform the tasks just described. So, for example, when the `deafult.html` layout is executed (the penultimate step for *all* `.md` files), the `head.html` snippet is called, which in turn calls `og-meta.html`. Based on our sites settings and any relevant Front Matter belonging to the calling file, `og-meta.html` compiles all our `og:meta` tags and passes them to `head.html` which after adding further code, passes on to our default layout where it is placed at the top of our webpages `html`.
 
 ```
 https://github.com/madeslowly/slow-steps/
 |
-├─ _config.yml/                   # Jekyll build settings and data, site.variable
+├─ _config.yml/                   # Website settings
 |
-├─ _data/                         # Site wide data, site.data.variable
+├─ _data/                         # Site data
 |  |  |
-|  |  ├─ forms/                   # inputs for MailChimp forms, picked up by _includes/forms/
+|  |  ├─ forms/                   # Inputs for MailChimp forms
 |  |
-|  ├─ copy.yml                    # Website copy picked up with {{ site.data.copy.copy.variable }}
+|  ├─ copy.yml                    # Website copy
 |  |
-|  ├─ menu.yml                    # Menu structure for GaitQ.com
+|  ├─ menu.yml                    # Menu structure
 |
 ├─ _includes/                     # HTML and Liquid templating
 |  |
 |  ├─ branding/                   # Site branding SVGs
 |  |  |
-|  |  ├─ site__logo.svg           # Site wide logo with CSS classes, see front matter comments for class details.
-|  |
-|  ├─ errors/                     # Error page SVGs
-|  |  |
-|  |  ├─ robot-403.svg            # 403 - Forbidden
-|  |  |
-|  |  ├─ robot-404.svg            # 404 - Not Found
-|  |  |
-|  |  ├─ robot-405.svg            # 405 - Method Not Allowed
+|  |  ├─ site__logo.svg           # Site wide logo
 |  |
 |  ├─ footer/                     # Site wide footers
 |  |  |
-|  |  ├─ footer_full.html         # Multi div footer with sitemaps and contact etc
+|  |  ├─ footer_full.html         # Multi col footer
 |  |  |
-|  |  ├─ footer.html              # Simple single div footer with legal links and copyright
+|  |  ├─ footer.html              # Simple footer
 |  |
-|  ├─ forms/                      # MailChimp scaffolding, pulls data from _data/forms/
+|  ├─ forms/                      # Form scaffolding
 |  |  |
-|  |  ├─ mc-register.html         # Registration form, data from _data/forms/register
+|  |  ├─ mc-register.html         # MailChimp registration form
 |  |
-|  ├─ head/                       # Header partials, everything inside our <html> tags comes from here.
+|  ├─ head/                       # Header partials
 |  |  |
-|  |  ├─ descriptor/              # Site wide descriptors, basically this is where much of our SEO occurs.
+|  |  ├─ descriptor/              # Site wide descriptors
 |  |  |  |
 |  |  |  ├─ og-meta.html
 |  |  |  ├─ structured-data.html
@@ -59,7 +57,7 @@ https://github.com/madeslowly/slow-steps/
 |  |  |  |
 |  |  |  ├─ conditional.html      # Page env: condition --> gaitq_env.css
 |  |  |
-|  |  ├─ head.html                # Routine to collect header partials, page.env and page.layout dependencies. We also open <body> here.
+|  |  ├─ head.html                # Routine to collate header partials
 |  |
 |  ├─ navigation/                 # HTML and Liquid templating
 |  |  |
@@ -69,7 +67,7 @@ https://github.com/madeslowly/slow-steps/
 |
 ├─ _layouts/                      # HTML and Liquid templating
 |  |
-|  ├─ env/                        # Environmental specific layouts, passed onto default.html after processing
+|  ├─ env/                        # Environmental specific layouts
 |  |  |
 |  |  ├─ clinician.html           # Professionals and press
 |  |  ├─ pwp.html                 # Patients and carers
@@ -77,9 +75,9 @@ https://github.com/madeslowly/slow-steps/
 |  |
 |  ├─ compress.html               # Final step for all pages. Strips html comments, carriage returns and white space.
 |  |
-|  ├─ default.html                # Wraps page content with header, nav and scripts. For all pages, also this is where Jekyll looks if no front matter defined. Passed onto compress.html after processing.
+|  ├─ default.html                # Wraps page content with header, nav, scripts and footer.
 |  |
-|  ├─ error-page.html             # Landing page. Passed onto default.html after processing.
+|  ├─ error-page.html             # HTTP error pages
 |
 ├─ _plugins/                      # Custom Ruby plugins
 |  |
@@ -135,17 +133,17 @@ https://github.com/madeslowly/slow-steps/
 
 `_config.yml` is where most variables are set.
 
-#### title:
+#### `title:`
 
 The global title of the website.
 
-#### subtitle:
+#### `subtitle:`
 
 The global subtitle of the website.
 
 #### Page Titling
 
-Pages are given titles according to,
+Each pages is given a title according to,
 
 ```Liquid
 {% if page.title %}
@@ -155,11 +153,11 @@ Pages are given titles according to,
 {% endif %}
 ```
 
-#### description:
+#### `description:`
 
 Site wide description, used in head description, og:description, twitter:description and structured data. Overwritten by page front matter, `description:`
 
-#### url:
+#### `url:`
 
 Used to generate absolute URLs for sitemaps, feeds and for generating canonical URLs in a page's `<head>`. When developing locally either comment this out or use something like `http://localhost:4000` so all assets load properly. *Don't include a trailing `/`*.
 
@@ -172,23 +170,23 @@ url: "http://www.gaitq.com"
 url: ""
 ```
 
-#### baseurl:
+#### `baseurl:`
 
 Used when we are developing a partial.
 
-#### author:
+#### `author:`
 
 Author of this Jekyll project. Content authors can be added to _data/authors.yml and assigned in a pages front matter.
 
-#### postal_add:
+#### `postal_add:`
 
 Postal address of GaitQ Ltd. Used in structured data.
 
-#### opening_hours:
+#### `opening_hours:`
 
 Used in structured data. This lets google know when we are open.
 
-#### logo
+#### `logo:`
 
 Site wide logo, used as a default image for Twitter and Facebook. Can be over written by a pages front matter: `image:`.
 

data/_config.yml

@@ -42,7 +42,7 @@ sass:
 
 compress_html:
   ignore:
-    envs: [local]
+    envs: all
   comments:                all
 
 autoprefixer:

data/_includes/footer/footer_full.html

@@ -16,8 +16,20 @@
           {% for item in site.postal_add %}
           <li class="address">{{ item[1] }}</li>
           {% endfor %}
+          <li><a class="ft--link" href="mailto:{{ site.email }}">{{ site.email }}</a></li>
           <li>{{ site.phone }}</li>
-          <li>{{ site.email }}</li>
+
+          <ul class="social-media">
+
+          {% for social in site.socials %}
+          <li class="social-media-item">
+          <a href="{{ social.url }}">
+          <i class="fab fa-{{ social.icon }} social--{{ social.name }} social-media-link"></i></a>
+          </li>
+          {% endfor %}
+
+          </ul>
+
         </ul>
 
       </div>
@@ -35,7 +47,7 @@
           <h4 class="ft__sitemap--env-header">{{ item.name }}</h4>
           <ul class="ft__sitemap--submenu">
           {% for sub in item.submenu %}
-          <li><a href="{{ sub.url }}">{{ sub.alt }}</a></li>
+          <li><a class="ft--link" href="{{ sub.url }}">{{ sub.alt }}</a></li>
           {% endfor %}
           </ul>
         </div>
@@ -61,7 +73,7 @@
       <a href="{{ item.url }}">{{ item.name }}</a>
       {% endfor %}
     </div>
-    <a href="{{ site.author.url }}" class="slogan">made slowly</a>
+    <a href="{{ site.author.url }}" class="slogan">Jekyll theme Slow Steps</a>
   </div>
 
 </footer>

data/_includes/functions/calc-svg-coord.html

@@ -1,33 +1,30 @@
 <!-- Take inputs from page front matter and calculate the coordinates of the svg elements -->
 {% assign image_handle = include.image_handle %}
 
-{% if page[image_handle].augment %}
+<!-- get image dimensions -->
+{%- assign imageX = page.images[image_handle].size | split: ', ' | first -%}
+{%- assign imageY = page.images[image_handle].size | split: ', ' | last -%}
 
-  <!-- get image dimensions -->
-  {%- assign imageX = page[image_handle].augment.image | split: ', ' | first -%}
-  {%- assign imageY = page[image_handle].augment.image | split: ', ' | last -%}
+<!-- pre-assign arrays for circle centers and line ends -->
+{% assign cX = '' | split: ',' %}
+{% assign cY = '' | split: ',' %}
 
-  <!-- pre-assign arrays for circle centers and line ends -->
-  {% assign cX = '' | split: ',' %}
-  {% assign cY = '' | split: ',' %}
+<!-- loop over all the requested labels -->
+{% for item in page.images[image_handle].labels %}
 
-  <!-- loop over all the requested labels -->
-  {% for item in page[image_handle].augment.labels %}
+  <!-- x(i) and y(i) -->
+  {% assign ix = item.coord | split: ', ' | first %}
+  {% assign iy = item.coord | split: ', ' | last %}
 
-    <!-- x(i) and y(i) -->
-    {% assign ix = item.coord | split: ', ' | first %}
-    {% assign iy = item.coord | split: ', ' | last %}
+  <!-- calculate circle centers as percentage of image size -->
+  {% assign cx = ix | times: 100 | divided_by: imageX | append: ', ' %}
+  {% assign cy = iy | times: 100 | divided_by: imageY | append: ', ' %}
+  <!-- push into arrays -->
+  {% assign cX = cX | push: cx %}
+  {% assign cY = cY | push: cy %}
 
-    <!-- calculate circle centers as percentage of image size -->
-    {% assign cx = ix | times: 100 | divided_by: imageX | append: ', ' %}
-    {% assign cy = iy | times: 100 | divided_by: imageY | append: ', ' %}
-    <!-- push into arrays -->
-    {% assign cX = cX | push: cx %}
-    {% assign cY = cY | push: cy %}
+{% endfor %}
 
-  {% endfor %}
-
-{% endif %}
 
 <!--
 in:   [imageX, imageY] pixels
@@ -35,6 +32,4 @@ in:   [imageX, imageY] pixels
 
 out:  cX = [cx_1, cx_2, ... , cx_n]
       cY = [cy_1, cy_2, ... , cy_n]
-
-      X1 = [x1_1, x1_2, ... , x1_n]
 -->

data/_includes/functions/pull_page_args.html

@@ -5,12 +5,12 @@ function svg_aug_contained_image(){
 
   var x_i = document.getElementsByClassName("image--guarantee")[0].offsetWidth ;
   var y_i = document.getElementsByClassName("image--guarantee")[0].offsetHeight ;
-  /* ge scg labels */
+  /* get svg labels */
   var svg = document.querySelectorAll('.svg__augment > .augment--guarantee');
 
   /* origanal image width in pixels */
-  var x_0 = {{ page.guarantee.augment.image | split: ', ' | first }} ;
-  var y_0 = {{ page.guarantee.augment.image | split: ', ' | last }} ;
+  var x_0 = {{ page.images.guarantee.size | split: ', ' | first }} ;
+  var y_0 = {{ page.images.guarantee.size | split: ', ' | last }} ;
 
   for (let i = 0; i < svg.length; i++) {
   /* origanal x position in pixels */

data/_includes/head/head.html

@@ -15,9 +15,7 @@
     {% endif %}
   </title>
 
-  {% include head/descriptors/structured-data.html %}
-
-  <!-- use local page descriptions if it exist -->
+  <!-- use page descriptions if it exist -->
   <meta name="description"
     content="
       {% if page.description %}
@@ -30,45 +28,26 @@
 
   <meta name="author" content="{{ site.author.name }}" />
 
-  <meta name="copyright"
-    content="
-      Copyright {{ site.title }} {{ 'now' | date: "%Y" }}" />
+  {% assign date = 'now' | date: "%Y" %}
+  <meta name="copyright" content="Copyright {{ site.title | append: ' Ltd. ' | append: date }}" />
 
   <meta name="robots" content="follow" />
 
-  {% include /head/descriptors/twitter-meta.html %}
-
-  {% include /head/descriptors/og-meta.html %}
-
-  <link rel="canonical" href="{{ site.url }}{{ site.baseurl }}{{ page.url }}" />
+  <link rel="canonical" href="{{ page.url | absolute_url }}" />
 
   <link rel="preconnect" href="https://fonts.gstatic.com">
 
   <link href="https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap" rel="stylesheet">
 
-  <link rel="stylesheet" type="text/css" title="made slowly has all the style" href="{{ site.baseurl }}/assets/css/gaitq_global.css" media="screen" />
-
-  {% if page.layout == 'error-page' %}
-  <link rel="stylesheet" type="text/css" title="made slowly has all the style" href="{{ site.baseurl }}/assets/css/gaitq_errors.css" media="screen" />
-  {% endif %}
+  <link rel="shortcut icon" type="image/x-icon" href="{{ site.fallback_path | append: site.favicon | relative_url }}">
 
-  {% if page.layout == 'feed' %}
-  <link rel="stylesheet" type="text/css" title="made slowly has all the style" href="{{ site.baseurl }}/assets/css/gaitq_feed.css" media="screen" />
-  {% endif %}
-
-  <link rel="stylesheet" type="text/css" title="made slowly has all the style" href="{{ site.baseurl }}/assets/css/gaitq_post.css" media="screen" />
-
-
-  {% if page.env %}
-    {% include /head/env/conditional.html %}
-  {% endif %}
+  {% include head/descriptors/structured-data.html %}
 
-  <!-- Animate on scroll lib, js is in footer -->
-  <link rel="stylesheet" type="text/css" href="{{ site.baseurl }}/assets/vendor/aos/aos.css" media="none" onload="if(media!='all')media='all'" />
+  {% include /head/descriptors/twitter-meta.html %}
 
-  <link rel="stylesheet" href="{{ site.baseurl }}/assets/fonts/fontawesome-free-5.11.2-web/css/all.min.css" media="none" onload="if(media!='all')media='all'" / >
+  {% include /head/descriptors/og-meta.html %}
 
-  <link rel="shortcut icon" type="image/x-icon" href="{{ site.baseurl }}{{ site.fallback_path }}{{ site.favicon }}">
+  {% include /head/stylesheets.html %}
 
   {% if jekyll.environment == "production" %}
   {% include google-analytics.html %}

data/_includes/head/stylesheets.html

@@ -0,0 +1,20 @@
+<!-- Animate on scroll, js is in footer -->
+<link rel="stylesheet" type="text/css" href="{{ '/assets/vendor/aos/aos.css' | relative_url }}" media="none" onload="if(media!='all')media='all'" />
+
+<!-- Font Awesome v5 -->
+<link rel="stylesheet" href="{{ '/assets/fonts/fontawesome-free-5.11.2-web/css/all.min.css' | relative_url }}" media="none" onload="if(media!='all')media='all'" / >
+
+<!-- Slow Steps error pages -->
+{% if page.layout == 'error-page' %}
+<link rel="stylesheet" type="text/css" title="made slowly has all the style" href="{{ '/assets/css/gaitq_errors.css' | relative_url }}" media="screen" />
+{% endif %}
+
+<!-- Slow Steps post pages -->
+<link rel="stylesheet" type="text/css" title="made slowly has all the style" href="{{ '/assets/css/gaitq_post.css' | relative_url }}" media="screen" />
+
+{% if page.env %}
+<link rel="stylesheet" type="text/css" title="made slowly has all the style" href="{{ '/assets/css/env/gaitq_' | append: page.env | append: '.css' | relative_url }}" media="screen" />
+{% endif %}
+
+<!-- Slow Steps custom css -->
+<link rel="stylesheet" type="text/css" title="made slowly has all the style" href="{{ '/assets/css/gaitq_custom.css' | relative_url }}" media="screen" />

data/_includes/image-post.html

@@ -0,0 +1,12 @@
+<!--
+  insert an image located in assets/images/posts/ and wrap with .post__image div.
+-->
+<div class="post__image">
+
+  {% picture {{ include.link | prepend: 'posts/' }} --alt {{include.alt}} --img class="post__content--image" %}
+
+  {% if include.caption %}
+  <p class="image--caption">{{ include.caption }}</p>
+  {% endif %}
+
+</div>

data/_includes/image.html

@@ -1,10 +1,55 @@
-<!-- include for post images to simplify the ux -->
+<!--
+  insert an augmented image located in assets/images/content/
 
-<div class="post__image">
+  Usage:
 
-{% picture {{ include.link | prepend: 'posts/' }} --alt include.alt --img class="post__content--image" %}
+  <div class="wrapping-class" >
+  {% comment %}
+  {%  include image.html
+      image="handle"
+      alt="Description"
+      class="image-class"
+      caption="Optional caption"
+      %}
+  {% endcomment %}
 
-{% if include.caption %}
-<p class="post__image--caption">{{ include.caption }}</p>
+  We close the wrapping div before the caption.
+
+-->
+
+
+{% capture path %}
+{{ page.images[include.image].file | prepend: 'content/'  }}
+{% endcapture %}
+
+{% picture {{ path }}
+  --img class="{{ include.class }}"
+  --alt {{ include.alt }} %}
+
+{% if page.images[include.image].labels %}
+
+{% include functions/calc-svg-coord.html image_handle=include.image %}
+
+<svg class="svg__augment" width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
+
+  {% for item in page.images[include.image].labels %}
+  <svg class="svg__labels hidden" x="{{ cX[forloop.index0] | remove: ", " }}%" y="{{ cY[forloop.index0] | remove: ", " }}%" style="overflow: visible">
+
+    <circle class="svg--elem svg--circle" cx="0%" cy="0%" r="6" />
+
+    <line class="svg--elem svg--line" x1="0"  y1="0" y2="0" />
+
+    <text class="svg--elem svg--text trans-{% if item.reverse %}right{% else %}left{% endif %}" >{{ item.text }}</text>
+
+  </svg>
+  {% endfor %}
+
+</svg>
 {% endif %}
+
+<!-- closing warpping div -->
 </div>
+
+{% if include.caption %}
+<p class="image--caption">{{ include.caption }}</p>
+{% endif %}