jekyll-sleek 0.1.1 → 0.1.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 23b26180c2b0cb43bf7d227eef12b1bc3a121a62
-  data.tar.gz: 976c326361d172d55000d4f22ea636def38ad3f7
+  metadata.gz: 736561d9c683029d473e0ae48376414310980cdf
+  data.tar.gz: 37ad5f94fe22b771712cd3c37cdf81c679a69942
 SHA512:
-  metadata.gz: ee3c367f52514584997ee94234a29cf789e64fc438e806536461f703b65bb29680c490eafbab626653a6789f4f3a87048a3bbfb9df2842e3f6e2c9b45fe85d37
-  data.tar.gz: 0f85fa9aea33efde171fef2d77c1430be94bac923c8e3467b6797b309ab5f2b29e63a0c128e1f995d57622863169a0253adbc3ebc5592cc27d17bb655c10e5eb
+  metadata.gz: 95e7562f4caa8aeb47e34725a31c48312db72e010f1c1aadaa7da4d234f0eaf6d0374fcfe56af8fe0d3b1303b39b08fc8587a15248cc8b29357a742ba0b77aee
+  data.tar.gz: d3631f5d14b2bdda41a3ba8f4bf1a0723befbda7a0c4e6d72d82763c01f083c7d73975321495dfaa6539c2ee16136c2f7349d295853270ef7251302c2b2be575

data/README.md

@@ -1,3 +1,5 @@
+[![Gem Version](https://badge.fury.io/rb/jekyll-sleek.svg)](https://badge.fury.io/rb/jekyll-sleek)
+
 # Sleek
 
 Sleek is a modern Jekyll theme focused on speed performance & SEO best practices. In this directory, you'll find the files you need to be able to package up your theme into a gem. Put your layouts in `_layouts`, your includes in `_includes`, your sass files in `_sass` and any other assets in `assets`.
@@ -12,13 +14,13 @@ TODO: Delete this and the text above, and describe your gem
 Add this line to your Jekyll site's `Gemfile`:
 
 ```ruby
-gem "sleek"
+gem "jekyll-sleek"
 ```
 
 And add this line to your Jekyll site's `_config.yml`:
 
 ```yaml
-theme: sleek
+theme: jekyll-sleek
 ```
 
 And then execute:
@@ -27,7 +29,7 @@ And then execute:
 
 Or install it yourself as:
 
-    $ gem install sleek
+    $ gem install jekyll-sleek
 
 ## Usage
 
@@ -44,7 +46,7 @@ To set up your environment to develop this theme, run `bundle install`.
 Your theme is setup just like a normal Jekyll site! To test your theme, run `bundle exec jekyll serve` and open your browser at `http://localhost:4000`. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal.
 
 When your theme is released, only the files in `_layouts`, `_includes`, `_sass` and `assets` tracked with Git will be bundled.
-To add a custom directory to your theme-gem, please edit the regexp in `sleek.gemspec` accordingly.
+To add a custom directory to your theme-gem, please edit the regexp in `jekyll-sleek.gemspec` accordingly.
 
 ## License
 

data/_includes/card.html

@@ -0,0 +1,31 @@
+<a class="post-card" href="{{ post.url | relative_url }}" itemprop="blogPosts" itemscope="" itemtype="http://schema.org/BlogPosting">
+  {% if post.featured-img %}
+  <figure class="post-card__thumb">
+    <img
+      src="{{site.url}}/assets/img/posts/{{post.featured-img}}_placehold.jpg",
+      data-srcset="{{site.url}}/assets/img/posts/{{post.featured-img}}_thumb.jpg, {{site.url}}/assets/img/posts/{{post.featured-img}}_thumb@2x.jpg 2x"
+      class="lazyload blur-up"
+      alt="{{post.title}}"
+    />
+    <noscript><img src="{{site.url}}/assets/img/posts/{{post.featured-img}}_thumb.jpg" alt="{{ post.title }}"></noscript>
+  </figure>
+  {% else %}
+  <figure class="post-card__thumb">
+    <!-- <img src="./assets/img/shane-rounce-205187.jpg" alt="{{post.title}}"/> -->
+  </figure>
+  {% endif %}
+  <div class="post-card__inner">
+    <div class="post-card__header">
+      <h2>{{ post.title | strip_html | truncate: 50 }}</h2>
+      {% assign date_format = site.sleek.date_format | default: "%b %-d, %Y" %}
+      <span class="post-card__meta">
+        <time>{{ post.date | date: date_format }}</time>
+      </span>
+    </div>
+    {% if post.summary %}
+      <p>{{ post.summary | strip_html | truncatewords:20 }}</p>
+    {% else %}
+      <p>{{ post.content | strip_html | truncatewords: 20 }}</p>
+    {% endif %}
+  </div>
+</a>

data/_includes/critical.css

@@ -0,0 +1 @@
+h1{color:#313237;margin-top:0;margin-bottom:.5rem}figure,main{display:block}figure{margin:1em 40px}figure{margin:0}@media (min-width:48em){.post-card{width:48.4375%;margin-right:3.125%}.post-card:last-of-type,.post-card:nth-child(2n+2){margin-right:0}}html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}main{display:block}a{background-color:transparent;-webkit-text-decoration-skip:objects}img{border-style:none}svg:not(:root){overflow:hidden}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}html{-webkit-box-sizing:border-box;box-sizing:border-box}body{-webkit-overflow-scrolling:touch}*,::after,::before{-webkit-box-sizing:inherit;box-sizing:inherit}.site{display:-webkit-box;display:-ms-flexbox;display:flex;min-height:100vh;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.site__content{-webkit-box-flex:1;-ms-flex:1;flex:1}img{max-width:100%;height:auto;width:auto;vertical-align:middle}body{background-color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;line-height:1.5;color:#343851;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}p{margin-top:0;margin-bottom:1.25rem}h1,h2{color:#313237;margin-top:0;margin-bottom:.5rem}a{color:#277cea;text-decoration:none}.blur-up{-webkit-filter:blur(5px);filter:blur(5px)}.container{padding:0 20px}@media (min-width:0){.container{max-width:auto;margin:0 auto}}@media (min-width:36em){.container{max-width:540px;margin:0 auto}}@media (min-width:48em){.container{max-width:720px;margin:0 auto}}@media (min-width:62em){.container{max-width:960px;margin:0 auto}}@media (min-width:75em){.container{max-width:1170px;margin:0 auto}}.header{background-color:#fff;color:#343851;position:absolute;z-index:4;width:100%;top:0;left:0;will-change:transform;-webkit-transform:translateY(0);transform:translateY(0)}.header a{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.header__logo{display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;overflow:hidden;padding:19px 0;margin-right:1.25rem;outline:0;color:#313237}.header__logo .header__logo--container{width:58px}.header__logo .header__logo--container .logo{fill:currentColor}.header__inner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:3.75em;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.header__links{display:none;visibility:hidden}.header__links a{color:#343851;padding:0 1em}.header__toggle{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:24px;height:100%;background-color:transparent;padding:0}.header__toggle span{display:block;position:relative;margin-top:4px;background-color:#343851;width:100%;height:2px}.header__toggle span:first-child{margin-top:0}@media (min-width:62em){.header__toggle{display:none;visibility:hidden}.header__links{display:-webkit-box;display:-ms-flexbox;display:flex;visibility:visible;height:100%}}.post-card{display:block;width:100%;min-height:250px;border-radius:4px;overflow:hidden;background-color:#fff;-webkit-box-shadow:0 1px 3px rgba(0,0,0,.08);box-shadow:0 1px 3px rgba(0,0,0,.08);margin-bottom:5.26316%}@media (min-width:48em){.post-card{width:48.4375%;margin-right:3.125%}.post-card:nth-child(2n+2){margin-right:0}}@media (min-width:75em){.post-card{width:31.25%;margin-right:3.125%}.post-card:nth-child(2n+2){margin-right:3.125%}}.post-card__thumb{margin:0;background:#313237;position:relative}.post-card__thumb::after{content:"";display:block;height:0;width:100%;padding-bottom:56.25%}.post-card__thumb>*{position:absolute;top:0;left:0;width:100%;height:100%;display:block}.post-card__inner{padding:1.875rem 1.25rem .625rem;color:#838c8d}.post-card__header{margin-bottom:.75rem}.post-card__header .post-card__meta{font-size:.875rem}.hero{margin:3.75rem auto 0;min-height:16.25rem;width:100%;position:relative;background:url(../assets/img/posts/sleek.jpg) 50%/cover no-repeat #dde5ea}@media (min-width:62em){.hero{margin:0 auto;height:36em}}.hero::before{position:absolute;display:block;content:"";top:0;left:0;width:100%;height:100%;background:rgba(52,56,81,.8)}.hero__wrap{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);text-align:center;color:rgba(255,255,255,.8);max-width:40em;z-index:1}.hero__wrap .hero__title{color:#fff}.blog{background-color:#f9f9f9}.post-list{padding-top:2.5em;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto}@media (min-width:48em){.hero__wrap .hero__title{font-size:2.625em;line-height:3.125rem}.post-list{padding-top:5em}}

data/_includes/{ga.html → gtm.html}

@@ -1,9 +1,9 @@
 <!-- Global site tag (gtag.js) - Google Analytics -->
-<script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script>
+<script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_tag_manager }}"></script>
 <script>
   window.dataLayer = window.dataLayer || [];
   function gtag(){dataLayer.push(arguments);}
   gtag('js', new Date());
 
-  gtag('config', '{{ site.google_analytics }}');
+  gtag('config', '{{ site.google_tag_manager }}');
 </script>

data/_includes/head.html

@@ -5,6 +5,40 @@
 
   {% seo %}
 
-  <style class="inlineCSS">{% include critical.css %}</style>
-  <link rel="stylesheet" href="{{ "/assets/css/main.css" | relative_url }}">
+  <link rel="apple-touch-icon" sizes="180x180" href="{{ '/assets/img/icons/apple-touch-icon.png?v=qA3OXqyw77' | relative_url }}">
+  <link rel="icon" type="image/png" sizes="32x32" href="{{'/assets/img/icons/favicon-32x32.png?v=qA3OXqyw77' | relative_url }}">
+  <link rel="icon" type="image/png" sizes="16x16" href="{{'/assets/img/icons/favicon-16x16.png?v=qA3OXqyw77' | relative_url }}">
+  <link rel="manifest" href="{{ '/assets/img/icons/manifest.json?v=qA3OXqyw77' | relative_url }}">
+  <link rel="mask-icon" href="{{ '/assets/img/icons/safari-pinned-tab.svg?v=qA3OXqyw77' | relative_url }}" color="#5bbad5">
+  <!--[if IE]><link rel="shortcut icon" href="/assets/img/icons/favicon.ico?v=qA3OXqyw77"><![endif]-->
+  <link rel="shortcut icon" href="{{ '/assets/img/icons/favicon.ico?v=qA3OXqyw77' | relative_url }}">
+  <meta name="apple-mobile-web-app-title" content="Sleek">
+  <meta name="application-name" content="Sleek">
+  <meta name="msapplication-config" content="{{ '/assets/img/icons/browserconfig.xml?v=qA3OXqyw77' | relative_url }}">
+  <meta name="theme-color" content="#ffffff">
+
+  {% if site.google_tag_manager %}
+
+    {% include gtm.html %}
+
+  {% endif %}
+
+  <style class="inlineCSS">
+
+    {% include critical.css %}
+
+  </style>
+  <link rel="preload" href="{{ '/assets/css/main.css' | relative_url }}" as="style" onload="this.rel='stylesheet'">
+  <noscript><link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}"></noscript>
+  <script type="text/javascript">
+  /*! loadCSS. [c]2017 Filament Group, Inc. MIT License */
+  (function(w){"use strict";if(!w.loadCSS){w.loadCSS=function(){}}
+  var rp=loadCSS.relpreload={};rp.support=(function(){var ret;try{ret=w.document.createElement("link").relList.supports("preload")}catch(e){ret=!1}
+  return function(){return ret}})();rp.bindMediaToggle=function(link){var finalMedia=link.media||"all";function enableStylesheet(){link.media=finalMedia}
+  if(link.addEventListener){link.addEventListener("load",enableStylesheet)}else if(link.attachEvent){link.attachEvent("onload",enableStylesheet)}
+  setTimeout(function(){link.rel="stylesheet";link.media="only x"});setTimeout(enableStylesheet,3000)};rp.poly=function(){if(rp.support()){return}
+  var links=w.document.getElementsByTagName("link");for(var i=0;i<links.length;i++){var link=links[i];if(link.rel==="preload"&&link.getAttribute("as")==="style"&&!link.getAttribute("data-loadcss")){link.setAttribute("data-loadcss",!0);rp.bindMediaToggle(link)}}};if(!rp.support()){rp.poly();var run=w.setInterval(rp.poly,500);if(w.addEventListener){w.addEventListener("load",function(){rp.poly();w.clearInterval(run)})}else if(w.attachEvent){w.attachEvent("onload",function(){rp.poly();w.clearInterval(run)})}}
+  if(typeof exports!=="undefined"){exports.loadCSS=loadCSS}
+  else{w.loadCSS=loadCSS}}(typeof global!=="undefined"?global:this))
+  </script>
 </head>

data/_includes/header.html

@@ -1,22 +1,20 @@
 <header class="header" itemscope itemtype="http://schema.org/SiteNavigationElement" aria-label="Main navigation">
   <div class="container">
     <div class="header__inner">
-      <a class="header__logo" href="{{ "/" | relative_url }}">{{ site.title | escape }}</a>
+      <a class="header__logo" href="{{ '/' | relative_url }}">
+        <div class="header__logo--container">
+          {% include logo.svg %}
+        </div>
+      </a>
       <nav class="header__links">
-        <a href="/about" itemprop="url"><span itemprop="name">About</span></a>
-        <a href="/contact" itemprop="url"><span itemprop="name">Contact</span></a>
-        {% if page_paths %}
-          {% for path in page_paths %}
-            {% assign my_page = site.pages | where: "path", path | first %}
-            {% if my_page.title %}
-              {% if my_page.title contains "404" %}
-              {% else %}
-                <a href="{{ my_page.url | relative_url }}">{{ my_page.title | escape }}</a>
-              {% endif %}
-            {% endif %}
-          {% endfor %}
-        {% endif %}
+        <a href="{{ '/about' | relative_url }}" itemprop="url"><span itemprop="name">About</span></a>
+        <a href="{{ '/contact' | relative_url }}" itemprop="url"><span itemprop="name">Contact</span></a>
       </nav>
+      <div class="header__toggle">
+        <span></span>
+        <span></span>
+        <span></span>
+      </div>
     </div>
   </div>
 </header>

data/_includes/logo.svg

@@ -0,0 +1,5 @@
+<svg class="logo" viewBox="0 0 47 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <g id="logo" transform="translate(-113.000000, -89.000000)">
+      <path d="M114.657,93.712 C114.657,93.1479972 114.767999,92.6530021 114.99,92.227 C115.212001,91.8009979 115.505998,91.4470014 115.872,91.165 C116.238002,90.8829986 116.663998,90.6700007 117.15,90.526 C117.636002,90.3819993 118.136997,90.31 118.653,90.31 C119.457004,90.31 120.218996,90.4629985 120.939,90.769 C121.659004,91.0750015 122.258998,91.5219971 122.739,92.11 L121.371,93.406 C121.094999,92.9859979 120.708002,92.6560012 120.21,92.416 C119.711998,92.1759988 119.193003,92.056 118.653,92.056 C118.004997,92.056 117.519002,92.1909986 117.195,92.461 C116.870998,92.7310013 116.709,93.1059976 116.709,93.586 C116.709,93.8740014 116.771999,94.1259989 116.898,94.342 C117.024001,94.5580011 117.194999,94.7469992 117.411,94.909 C117.627001,95.0710008 117.878999,95.2149994 118.167,95.341 C118.455001,95.4670006 118.754998,95.5959993 119.067,95.728 C119.475002,95.8960008 119.888998,96.075999 120.309,96.268 C120.729002,96.460001 121.106998,96.6999986 121.443,96.988 C121.779002,97.2760014 122.054999,97.6299979 122.271,98.05 C122.487001,98.4700021 122.595,98.9919969 122.595,99.616 C122.595,100.276003 122.481001,100.836998 122.253,101.299 C122.024999,101.761002 121.716002,102.138999 121.326,102.433 C120.935998,102.727001 120.483003,102.939999 119.967,103.072 C119.450997,103.204001 118.911003,103.27 118.347,103.27 C117.386995,103.27 116.526004,103.084002 115.764,102.712 C115.001996,102.339998 114.339003,101.758004 113.775,100.966 L115.197,99.778 C115.305001,99.9580009 115.460999,100.152999 115.665,100.363 C115.869001,100.573001 116.105999,100.767999 116.376,100.948 C116.646001,101.128001 116.945998,101.277999 117.276,101.398 C117.606002,101.518001 117.962998,101.578 118.347,101.578 C118.767002,101.578 119.117999,101.53 119.4,101.434 C119.682001,101.338 119.906999,101.206001 120.075,101.038 C120.243001,100.869999 120.363,100.675001 120.435,100.453 C120.507,100.230999 120.543,99.9940013 120.543,99.742 C120.543,99.4299984 120.474001,99.1570012 120.336,98.923 C120.197999,98.6889988 120.015001,98.4820009 119.787,98.302 C119.558999,98.1219991 119.295001,97.9600007 118.995,97.816 C118.694998,97.6719993 118.383002,97.5280007 118.059,97.384 C117.662998,97.2159992 117.261002,97.036001 116.853,96.844 C116.444998,96.651999 116.079002,96.4180014 115.755,96.142 C115.430998,95.8659986 115.167001,95.5330019 114.963,95.143 C114.758999,94.7529981 114.657,94.2760028 114.657,93.712 Z M127.167,89.824 L127.167,103 L125.097,103 L125.097,89.824 L127.167,89.824 Z M131.775,99.364 C131.859,100.192004 132.119998,100.794998 132.558,101.173 C132.996002,101.551002 133.598996,101.74 134.367,101.74 C134.859002,101.74 135.341998,101.662001 135.816,101.506 C136.290002,101.349999 136.700998,101.134001 137.049,100.858 L137.877,102.136 C137.336997,102.496002 136.749003,102.768999 136.113,102.955 C135.476997,103.141001 134.841003,103.234 134.205,103.234 C133.592997,103.234 133.014003,103.141001 132.468,102.955 C131.921997,102.768999 131.442002,102.490002 131.028,102.118 C130.613998,101.745998 130.284001,101.278003 130.038,100.714 C129.791999,100.149997 129.669,99.4840038 129.669,98.716 C129.669,98.0799968 129.779999,97.4920027 130.002,96.952 C130.224001,96.4119973 130.532998,95.947002 130.929,95.557 C131.325002,95.1669981 131.789997,94.8610011 132.324,94.639 C132.858003,94.4169989 133.430997,94.306 134.043,94.306 C134.631003,94.306 135.170998,94.3989991 135.663,94.585 C136.155002,94.7710009 136.580998,95.0439982 136.941,95.404 C137.301002,95.7640018 137.582999,96.2109973 137.787,96.745 C137.991001,97.2790027 138.093,97.8939965 138.093,98.59 C138.093,98.7220007 138.09,98.8419995 138.084,98.95 C138.078,99.0580005 138.069,99.1779993 138.057,99.31 L131.775,99.364 Z M134.043,95.746 C133.394997,95.746 132.861002,95.9559979 132.441,96.376 C132.020998,96.7960021 131.799,97.3479966 131.775,98.032 L136.113,98.032 C136.089,97.3479966 135.906002,96.7960021 135.564,96.376 C135.221998,95.9559979 134.715003,95.746 134.043,95.746 Z M142.179,99.364 C142.263,100.192004 142.523998,100.794998 142.962,101.173 C143.400002,101.551002 144.002996,101.74 144.771,101.74 C145.263002,101.74 145.745998,101.662001 146.22,101.506 C146.694002,101.349999 147.104998,101.134001 147.453,100.858 L148.281,102.136 C147.740997,102.496002 147.153003,102.768999 146.517,102.955 C145.880997,103.141001 145.245003,103.234 144.609,103.234 C143.996997,103.234 143.418003,103.141001 142.872,102.955 C142.325997,102.768999 141.846002,102.490002 141.432,102.118 C141.017998,101.745998 140.688001,101.278003 140.442,100.714 C140.195999,100.149997 140.073,99.4840038 140.073,98.716 C140.073,98.0799968 140.183999,97.4920027 140.406,96.952 C140.628001,96.4119973 140.936998,95.947002 141.333,95.557 C141.729002,95.1669981 142.193997,94.8610011 142.728,94.639 C143.262003,94.4169989 143.834997,94.306 144.447,94.306 C145.035003,94.306 145.574998,94.3989991 146.067,94.585 C146.559002,94.7710009 146.984998,95.0439982 147.345,95.404 C147.705002,95.7640018 147.986999,96.2109973 148.191,96.745 C148.395001,97.2790027 148.497,97.8939965 148.497,98.59 C148.497,98.7220007 148.494,98.8419995 148.488,98.95 C148.482,99.0580005 148.473,99.1779993 148.461,99.31 L142.179,99.364 Z M144.447,95.746 C143.798997,95.746 143.265002,95.9559979 142.845,96.376 C142.424998,96.7960021 142.203,97.3479966 142.179,98.032 L146.517,98.032 C146.493,97.3479966 146.310002,96.7960021 145.968,96.376 C145.625998,95.9559979 145.119003,95.746 144.447,95.746 Z M153.033,89.824 L153.033,97.798 L156.579,94.468 L159.117,94.468 L154.977,98.518 L159.333,103 L156.741,103 L153.033,99.112 L153.033,103 L150.963,103 L150.963,89.824 L153.033,89.824 Z" id="Sleek"></path>
+  </g>
+</svg>

data/_includes/pagination.html

@@ -0,0 +1,3 @@
+<nav class="pagination">
+  <a href="#" class="pagination__item">1</a>
+</nav>

data/_layouts/compress.html

@@ -0,0 +1,10 @@
+---
+# Jekyll layout that compresses HTML
+# v3.0.2
+# http://jch.penibelst.de/
+# © 2014–2015 Anatol Broder
+# MIT License
+---
+
+{% capture _LINE_FEED %}
+{% endcapture %}{% if site.compress_html.ignore.envs contains jekyll.environment %}{{ content }}{% else %}{% capture _content %}{{ content }}{% endcapture %}{% assign _profile = site.compress_html.profile %}{% if site.compress_html.endings == "all" %}{% assign _endings = "html head body li dt dd p rt rp optgroup option colgroup caption thead tbody tfoot tr td th" | split: " " %}{% else %}{% assign _endings = site.compress_html.endings %}{% endif %}{% for _element in _endings %}{% capture _end %}</{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _end %}{% endfor %}{% if _profile and _endings %}{% assign _profile_endings = _content | size | plus: 1 %}{% endif %}{% for _element in site.compress_html.startings %}{% capture _start %}<{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _start %}{% endfor %}{% if _profile and site.compress_html.startings %}{% assign _profile_startings = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.comments == "all" %}{% assign _comments = "<!-- -->" | split: " " %}{% else %}{% assign _comments = site.compress_html.comments %}{% endif %}{% if _comments.size == 2 %}{% capture _comment_befores %}.{{ _content }}{% endcapture %}{% assign _comment_befores = _comment_befores | split: _comments.first %}{% for _comment_before in _comment_befores %}{% if forloop.first %}{% continue %}{% endif %}{% capture _comment_outside %}{% if _carry %}{{ _comments.first }}{% endif %}{{ _comment_before }}{% endcapture %}{% capture _comment %}{% unless _carry %}{{ _comments.first }}{% endunless %}{{ _comment_outside | split: _comments.last | first }}{% if _comment_outside contains _comments.last %}{{ _comments.last }}{% assign _carry = false %}{% else %}{% assign _carry = true %}{% endif %}{% endcapture %}{% assign _content = _content | remove_first: _comment %}{% endfor %}{% if _profile %}{% assign _profile_comments = _content | size | plus: 1 %}{% endif %}{% endif %}{% assign _pre_befores = _content | split: "<pre" %}{% assign _content = "" %}{% for _pre_before in _pre_befores %}{% assign _pres = _pre_before | split: "</pre>" %}{% assign _pres_after = "" %}{% if _pres.size != 0 %}{% if site.compress_html.blanklines %}{% assign _lines = _pres.last | split: _LINE_FEED %}{% capture _pres_after %}{% for _line in _lines %}{% assign _trimmed = _line | split: " " | join: " " %}{% if _trimmed != empty or forloop.last %}{% unless forloop.first %}{{ _LINE_FEED }}{% endunless %}{{ _line }}{% endif %}{% endfor %}{% endcapture %}{% else %}{% assign _pres_after = _pres.last | split: " " | join: " " %}{% endif %}{% endif %}{% capture _content %}{{ _content }}{% if _pre_before contains "</pre>" %}<pre{{ _pres.first }}</pre>{% endif %}{% unless _pre_before contains "</pre>" and _pres.size == 1 %}{{ _pres_after }}{% endunless %}{% endcapture %}{% endfor %}{% if _profile %}{% assign _profile_collapse = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.clippings == "all" %}{% assign _clippings = "html head title base link meta style body article section nav aside h1 h2 h3 h4 h5 h6 hgroup header footer address p hr blockquote ol ul li dl dt dd figure figcaption main div table caption colgroup col tbody thead tfoot tr td th" | split: " " %}{% else %}{% assign _clippings = site.compress_html.clippings %}{% endif %}{% for _element in _clippings %}{% assign _edges = " <e;<e; </e>;</e>;</e> ;</e>" | replace: "e", _element | split: ";" %}{% assign _content = _content | replace: _edges[0], _edges[1] | replace: _edges[2], _edges[3] | replace: _edges[4], _edges[5] %}{% endfor %}{% if _profile and _clippings %}{% assign _profile_clippings = _content | size | plus: 1 %}{% endif %}{{ _content }}{% if _profile %} <table id="compress_html_profile_{{ site.time | date: "%Y%m%d" }}" class="compress_html_profile"> <thead> <tr> <td>Step <td>Bytes <tbody> <tr> <td>raw <td>{{ content | size }}{% if _profile_endings %} <tr> <td>endings <td>{{ _profile_endings }}{% endif %}{% if _profile_startings %} <tr> <td>startings <td>{{ _profile_startings }}{% endif %}{% if _profile_comments %} <tr> <td>comments <td>{{ _profile_comments }}{% endif %}{% if _profile_collapse %} <tr> <td>collapse <td>{{ _profile_collapse }}{% endif %}{% if _profile_clippings %} <tr> <td>clippings <td>{{ _profile_clippings }}{% endif %} </table>{% endif %}{% endif %}

data/_layouts/default.html

@@ -1,5 +1,5 @@
 ---
-layout: default
+layout: compress
 ---
 <html lang="{{ page.lang | default: site.lang | default: "en_US" }}">
 
@@ -7,34 +7,35 @@ layout: default
 
   <body class="site">
 
+    {% if site.google_tag_manager %}
+
+      <!-- Google Tag Manager (noscript) -->
+      <noscript><iframe src="https://www.googletagmanager.com/ns.html?id={{ site.google_tag_manager }}"
+      height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+      <!-- End Google Tag Manager (noscript) -->
+
+    {% endif %}
+
     {% include header.html %}
 
     <div class="hero">
       <div class="hero__wrap">
-        <h1 class="hero__title">Sleek theme</h1>
+        <h1 class="hero__title">Sleek</h1>
+        <p class="hero__meta">Modern Jekyll theme focused on speed performance & SEO best practices</p>
       </div>
     </div>
+
     <main class="site__content">
       <section class="blog">
         <div class="container">
+          <div class="post-list" itemscope="" itemtype="http://schema.org/Blog">
 
-          <div class="post-list">
             {% for post in site.posts %}
-              <a class="post-card" href="{{ post.url | relative_url }}">
-                <img src="./assets/img/shane-rounce-205187.jpg" alt="{{post.title}}"/>
-                {% if post.featured-img %}
-                  <div></div>
-                {% endif %}
-                <div class="post-card--inner">
-                  <h2>{{ post.title | escape }}</h2>
-                  {% assign date_format = site.minima.date_format | default: "%b %-d, %Y" %}
-                  <time class="post-card--meta">{{ post.date | date: date_format }}</time>
-                  <p>{{ post.content | strip_html | truncatewords:20 }}</p>
-                </div>
-              </a>
+              {% include card.html %}
             {% endfor %}
-          </div>
 
+            <!-- {% include pagination.html %} -->
+          </div>
         </div>
       </section>
     </main>

data/_layouts/page.html

@@ -1,5 +1,5 @@
 ---
-layout: page
+layout: compress
 ---
 <html lang="{{ page.lang | default: site.lang | default: "en_US" }}">
 
@@ -7,7 +7,17 @@ layout: page
 
   <body class="site">
 
+    {% if site.google_tag_manager %}
+
+      <!-- Google Tag Manager (noscript) -->
+      <noscript><iframe src="https://www.googletagmanager.com/ns.html?id={{ site.google_tag_manager }}"
+      height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+      <!-- End Google Tag Manager (noscript) -->
+
+    {% endif %}
+
     {% include header.html %}
+
     <div class="hero--small">
       <div class="hero__wrap">
         <h1 class="hero__title">{{ page.title }}</h1>

data/_layouts/post.html

@@ -1,5 +1,5 @@
 ---
-layout: post
+layout: compress
 ---
 <html lang="{{ page.lang | default: site.lang | default: "en_US" }}">
 
@@ -7,11 +7,40 @@ layout: post
 
   <body class="site">
 
+    {% if site.google_tag_manager %}
+
+      <!-- Google Tag Manager (noscript) -->
+      <noscript><iframe src="https://www.googletagmanager.com/ns.html?id={{ site.google_tag_manager }}"
+      height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+      <!-- End Google Tag Manager (noscript) -->
+
+    {% endif %}
+
     {% include header.html %}
 
+    <div class="hero">
+      <div class="hero__wrap">
+        <h1 class="hero__title">{{ page.title }}</h1>
+        <p class="hero__meta">
+          <span>
+            <time>{{ page.date | date_to_string }}</time>&nbsp;
+          </span>
+          <span>
+            {% assign words = content | number_of_words %}
+              {% if words < 360 %}
+                1 min
+              {% else %}
+                {{ words | divided_by:180 }} mins
+            {% endif %} read
+          	&nbsp;
+          </span>
+        </p>
+      </div>
+    </div>
+
     <main class="site__content">
       <div class="container">
-        <article class="post-content">
+        <article class="post-content" itemprop="articleBody">
 
           {{ content }}
 
@@ -22,6 +51,7 @@ layout: post
           <div class="post-content">
             <div class="control">
               {% if page.previous.url %}
+
                 <a class="prev" href="{{page.previous.url}}">&laquo; {{page.previous.title}}</a>
               {% endif %}
             </div>
@@ -34,18 +64,21 @@ layout: post
           </div>
         </div>
       </div>
-      <div class="comments">
-        <div class="container">
-          <div class="post-content">
 
-            {% if site.disqus.shortname %}
+      {% if site.disqus.shortname %}
+
+        <div class="comments">
+          <div class="container">
+            <div class="post-content">
 
               {% include disqus.html %}
 
-            {% endif %}
+            </div>
           </div>
         </div>
-      </div>
+
+      {% endif %}
+
     </main>
 
     {% include footer.html %}

data/_sass/base/_helpers.scss

@@ -1,3 +1,14 @@
+.blur-up {
+	-webkit-filter: blur(5px);
+	filter: blur(5px);
+	transition: filter 400ms, -webkit-filter 400ms;
+}
+
+.blur-up.lazyloaded {
+	-webkit-filter: blur(0);
+	filter: blur(0);
+}
+
 .title {
   position: relative;
   margin: 0 0 85px;

data/_sass/components/_card.scss

@@ -7,6 +7,12 @@
   background-color: $bg-color;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
   margin-bottom: 5.26316%;
+  transition: box-shadow .25s ease;
+
+  &:hover,
+  &:focus {
+    box-shadow: 0 2px 40px 0 hsla(232, 8%, 63%, .3);
+  }
 
   @include breakpoint($md) {
     width: 48.4375%;
@@ -33,6 +39,39 @@
   }
 }
 
-.post-card--inner {
-  padding: 1.875rem 1.25rem;
+.post-card__thumb {
+  margin: 0;
+  background: $dark-light;
+  position: relative;
+
+  &::after {
+    content: "";
+    display: block;
+    height: 0;
+    width: 100%;
+    // 16:9 = 56.25% = calc(9 / 16 * 100%)
+    padding-bottom: 56.25%;
+  }
+
+  > * {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    display: block;
+  }
+}
+
+.post-card__inner {
+  padding: 1.875rem 1.25rem 0.625rem;
+  color: $grey;
+}
+
+.post-card__header {
+  margin-bottom: 0.75rem;
+
+  .post-card__meta {
+    font-size: 0.875rem;
+  }
 }

data/_sass/components/_pagination.scss

@@ -0,0 +1,5 @@
+.pagination {
+  display: flex;
+  justify-content: center;
+  margin: 1.25rem auto;
+}