DRY up archive include

- Combine grid and list view into one include

_includes/archive-list-single.html

@@ -1,8 +0,0 @@
-<article class="archive__item" itemscope itemtype="http://schema.org/CreativeWork">
-  {% if post.link %}
-    <h2 class="archive__item-title link-post" itemprop="headline"><a href="{{ base_path }}{{ post.url }}">{% if post.id %}{{ post.title | markdownify | remove: "<p>" | remove: "</p>" }}{% else %}{{ post.title }}{% endif %}</a> <a href="{{ post.link }}" target="_blank"><i class="fa fa-link"></i></a></h2>
-  {% else %}
-    <h2 class="archive__item-title" itemprop="headline"><a href="{{ base_path }}{{ post.url }}">{% if post.id %}{{ post.title | markdownify | remove: "<p>" | remove: "</p>" }}{% else %}{{ post.title }}{% endif %}</a></h2>
-  {% endif %}
-  {% if post.excerpt %}<p class="archive__item-excerpt" itemprop="description">{{ post.excerpt | markdownify | strip_html | truncate: 160 }}</p>{% endif %}
-</article>

_includes/archive-single.html

@@ -1,23 +1,27 @@
-{% include base_path %}
-
 {% if post.header.teaser %}
   {% capture teaser %}{{ post.header.teaser }}{% endcapture %}
 {% else %}
   {% capture teaser %}{{ site.teaser }}{% endcapture %}
 {% endif %}
 
-<div class="grid__item">
-  <a href="{{ base_path }}{{ post.url }}">
+<div class="{{ include.type | default: "list" }}__item">
+  {% if post.link %}
+    <a href="{{ post.link }}" target="_blank">
+  {% else %}
+    <a href="{{ base_path }}{{ post.url }}">
+  {% endif %}
     <article class="archive__item" itemscope itemtype="http://schema.org/CreativeWork">
-      <div class="archive__item-teaser">
-        <img src=
-          {% if teaser contains "http" %}
-            "{{ teaser }}"
-          {% else %}
-            "{{ teaser | prepend: "/images/" | prepend: base_path }}"
-          {% endif %}
-          alt="{{ page.title }}">
-      </div>
+      {% if include.type == "grid" %}
+        <div class="archive__item-teaser">
+          <img src=
+            {% if teaser contains "http" %}
+              "{{ teaser }}"
+            {% else %}
+              "{{ teaser | prepend: "/images/" | prepend: base_path }}"
+            {% endif %}
+            alt="{{ page.title }}">
+        </div>
+        {% endif %}
       <h2 class="archive__item-title" itemprop="headline">{% if post.id %}{{ post.title | markdownify | remove: "<p>" | remove: "</p>" }}{% else %}{{ post.title }}{% endif %}</h2>
       {% if post.excerpt %}<p class="archive__item-excerpt" itemprop="description">{{ post.excerpt | markdownify | strip_html | truncate: 160 }}</p>{% endif %}
     </article>

_layouts/archive-taxonomy.html

@@ -7,6 +7,6 @@ author_profile: false
   <h1 class="page__title">{{ page.title }}</h1>
   {% include base_path %}
   {% for post in page.posts %}
-    {% include archive-list-single.html %}
+    {% include archive-single.html %}
   {% endfor %}
 </div>

_layouts/single.html

@@ -57,7 +57,7 @@ layout: default
     {% endif %}
     <div class="grid__wrapper">
       {% for post in site.related_posts limit:4 %}
-        {% include archive-grid-single.html %}
+        {% include archive-single.html type="grid" %}
       {% endfor %}
     </div>
   </div>

_pages/category-archive.html

@@ -6,12 +6,12 @@ author_profile: false
 ---
 
 {% include base_path %}
-{% include group-by-array collection=site.posts field='categories' %}
+{% include group-by-array collection=site.posts field="categories" %}
 
 {% for category in group_names %}
   {% assign posts = group_items[forloop.index0] %}
   <h2 id="{{ category | slugify }}" class="archive__subtitle">{{ category }}</h2>
   {% for post in posts %}
-    {% include archive-list-single.html %}
+    {% include archive-single.html %}
   {% endfor %}
 {% endfor %}

_pages/collection-archive.html

@@ -9,7 +9,7 @@ author_profile: false
 {% capture written_label %}'None'{% endcapture %}
 
 {% for collection in site.collections %}
-  {% unless collection.output == false or collection.label == 'posts' %}
+  {% unless collection.output == false or collection.label == "posts" %}
     {% capture label %}{{ collection.label }}{% endcapture %}
     {% if label != written_label %}
       <h2 id="{{ label | slugify }}" class="archive__subtitle">{{ label }}</h2>
@@ -17,8 +17,8 @@ author_profile: false
     {% endif %}
   {% endunless %}
   {% for post in collection.docs %}
-    {% unless collection.output == false or collection.label == 'posts' %}
-      {% include archive-list-single.html %}
+    {% unless collection.output == false or collection.label == "posts" %}
+      {% include archive-single.html %}
     {% endunless %}
   {% endfor %}
 {% endfor %}

_pages/page-archive.html

@@ -7,5 +7,5 @@ author_profile: false
 
 {% include base_path %}
 {% for post in site.pages %}
-  {% include archive-list-single.html %}
+  {% include archive-single.html %}
 {% endfor %}

_pages/portfolio-archive.html

@@ -5,12 +5,12 @@ permalink: /portfolio/
 ---
 
 {% include base_path %}
-{% include group-by-array collection=site.portfolio field='categories' %}
+{% include group-by-array collection=site.portfolio field="categories" %}
 
 {% for category in group_names %}
   {% assign posts = group_items[forloop.index0] %}
   <h2 id="{{ category | slugify }}" class="archive__subtitle">{{ category }}</h2>
   {% for post in posts %}
-    {% include archive-list-single.html %}
+    {% include archive-single.html %}
   {% endfor %}
 {% endfor %}

_pages/recipes-archive.html

@@ -8,5 +8,5 @@ author_profile: false
 {% include base_path %}
 
 {% for post in site.recipes %}
-  {% include archive-list-single.html %}
+  {% include archive-single.html %}
 {% endfor %}

_pages/sitemap.md

@@ -11,18 +11,18 @@ A list of all the posts and pages found on the site. For you robots out there is
 
 <h2>Pages</h2>
 {% for post in site.pages %}
-  {% include archive-list-single.html %}
+  {% include archive-single.html %}
 {% endfor %}
 
 <h2>Posts</h2>
 {% for post in site.posts %}
-  {% include archive-list-single.html %}
+  {% include archive-single.html %}
 {% endfor %}
 
 {% capture written_label %}'None'{% endcapture %}
 
 {% for collection in site.collections %}
-{% unless collection.output == false or collection.label == 'posts' %}
+{% unless collection.output == false or collection.label == "posts" %}
   {% capture label %}{{ collection.label }}{% endcapture %}
   {% if label != written_label %}
   <h2>{{ label }}</h2>
@@ -30,8 +30,8 @@ A list of all the posts and pages found on the site. For you robots out there is
   {% endif %}
 {% endunless %}
 {% for post in collection.docs %}
-  {% unless collection.output == false or collection.label == 'posts' %}
-  {% include archive-list-single.html %}
+  {% unless collection.output == false or collection.label == "posts" %}
+  {% include archive-single.html %}
   {% endunless %}
 {% endfor %}
 {% endfor %}

_pages/tag-archive.html

@@ -6,12 +6,12 @@ author_profile: false
 ---
 
 {% include base_path %}
-{% include group-by-array collection=site.posts field='tags' %}
+{% include group-by-array collection=site.posts field="tags" %}
 
 {% for tag in group_names %}
   {% assign posts = group_items[forloop.index0] %}
   <h2 id="{{ tag | slugify }}" class="archive__subtitle">{{ tag }}</h2>
   {% for post in posts %}
-    {% include archive-list-single.html %}
+    {% include archive-single.html %}
   {% endfor %}
 {% endfor %}

_pages/year-archive.html

@@ -13,5 +13,5 @@ author_profile: false
     <h2 id="{{ year | slugify }}" class="archive__subtitle">{{ year }}</h2>
     {% capture written_year %}{{ year }}{% endcapture %}
   {% endif %}
-  {% include archive-list-single.html %}
+  {% include archive-single.html %}
 {% endfor %}

assets/_scss/_archive.scss

@@ -13,6 +13,9 @@
   @include breakpoint($x-large) {
     @include prefix(0.5 of 12);
   }
+  a {
+    text-decoration: none;
+  }
 }
 
 .archive__subtitle {
@@ -27,12 +30,6 @@
   margin-bottom: 4px;
   font-family: $sans-serif-narrow;
   font-size: 20px;
-  a {
-    text-decoration: none;
-    &:hover {
-      text-decoration: underline;
-    }
-  }
 }
 
 .archive__item-excerpt {
@@ -50,3 +47,36 @@ a:hover {
     text-decoration: underline;
   }
 }
+
+
+/*
+   Grid view
+   ========================================================================== */
+
+.grid__item {
+  margin-bottom: 2em;
+  .archive__item-excerpt {
+    display: none;
+  }
+  .archive__item-teaser {
+    border-radius: $border-radius;
+  }
+  @include breakpoint($small) {
+    @include gallery(5 of 10);
+    .archive__item-teaser {
+      max-height: 200px;
+      overflow: hidden;
+    }
+  }
+  @include breakpoint($medium) {
+    margin-left: 0; // reset before mixin does its thing
+    margin-right: 0; // reset before mixin does its thing
+    @include gallery(2.5 of 10);
+    .archive__item-teaser {
+      max-height: 120px;
+    }
+    .archive__item-excerpt {
+      display: block;
+    }
+  }
+}

assets/_scss/_page.scss

@@ -150,33 +150,6 @@
   @include breakpoint($x-large) {
     @include pre(2.5 of 12);
   }
-  .grid__item {
-    margin-bottom: 2em;
-    .archive__item-excerpt {
-      display: none;
-    }
-    .archive__item-teaser {
-      border-radius: $border-radius;
-    }
-    @include breakpoint($small) {
-      @include gallery(5 of 10);
-      .archive__item-teaser {
-        max-height: 200px;
-        overflow: hidden;
-      }
-    }
-    @include breakpoint($medium) {
-      margin-left: 0; // reset before mixin does its thing
-      margin-right: 0; // reset before mixin does its thing
-      @include gallery(2.5 of 10);
-      .archive__item-teaser {
-        max-height: 120px;
-      }
-      .archive__item-excerpt {
-        display: block;
-      }
-    }
-  }
   a {
     text-decoration: none;
   }

index.html

@@ -11,7 +11,7 @@ header:
 <h3 class="archive__subtitle">Recent Posts</h3>
 
 {% for post in paginator.posts %}
-  {% include archive-list-single.html %}
+  {% include archive-single.html %}
 {% endfor %}
 
 {% include pagination.html %}