Merge pull request #24 from seanh/breadcrumbs-2

Breadcrumbs 2

_config.yml

@@ -14,6 +14,7 @@ sass:
 title: jekyll-theme-seanh
 
 github_ribbon: true
+breadcrumbs_omit_date: true
 
 relative_links:
   enabled:     true

_includes/breadcrumb_text.html

@@ -0,0 +1,16 @@
+{% assign breadcrumb_page = nil %}
+{% for page in site.pages %}
+  {% if page.url == include.url %}
+    {% assign breadcrumb_page = page %}
+    {% break %}
+  {% endif %}
+{% endfor %}
+
+{% assign breadcrumb_text = breadcrumb_page.breadcrumb_text | default: breadcrumb_page.title | default: include.default %}
+
+{% unless breadcrumb_page == nil %}
+  <a href="{{ breadcrumb_page.url | relative_url }}">{{ breadcrumb_text }}</a>
+{% else %}
+  {{ breadcrumb_text }}
+{% endunless %}
+>

_includes/breadcrumbs.html

@@ -0,0 +1,143 @@
+{% comment %}
+Render the breadcrumbs for the current page or a given page.
+
+Usage
+=====
+
+To render the breadcrumbs for the current page:
+
+  {% include breadcrumbs.html %}
+
+To render the breadcrumbs for another page:
+
+  {% include breadcrumbs.html page=another_page %}
+
+To render breadcrumbs with the home page and date omitted (see Options below
+for more options):
+
+  {% include breadcrumbs.html omit_home=true omit_date=true %}
+
+Options
+=======
+
+omit_home
+: Don't include the home page as the first breadcrumb.
+
+omit_collection
+: Don't include the page's collection ("posts" by default, for posts) in the breadcrumbs.
+
+omit_categories
+: Don't include the page's categories in the breadcrumbs.
+
+omit_date
+: Don't include the post's date (year, month and day) in the breadcrumbs.
+
+omit_year
+: Don't include the post's year in the breadcrumbs.
+
+omit_month
+: Don't include the post's month in the breadcrumbs.
+
+omit_date
+: Don't include the post's date in the breadcrumbs.
+{% endcomment %}
+
+{% assign omit_home = include.omit_home %}
+{% if omit_home == nil %}
+  {% assign omit_home = site.breadcrumbs_omit_home %}
+{% endif %}
+
+{% assign omit_collection = include.omit_collection %}
+{% if omit_collection == nil %}
+  {% assign omit_collection = site.breadcrumbs_omit_collection %}
+{% endif %}
+
+{% assign omit_categories = include.omit_categories %}
+{% if omit_categories == nil %}
+  {% assign omit_categories = site.breadcrumbs_omit_categories %}
+{% endif %}
+
+{% assign omit_date = include.omit_date %}
+{% if omit_date == nil %}
+  {% assign omit_date = site.breadcrumbs_omit_date %}
+{% endif %}
+
+{% assign omit_year = include.omit_year %}
+{% if omit_year == nil %}
+  {% assign omit_year = site.breadcrumbs_omit_year %}
+{% endif %}
+
+{% assign omit_month = include.omit_month %}
+{% if omit_month == nil %}
+  {% assign omit_month = site.breadcrumbs_omit_month %}
+{% endif %}
+
+{% assign omit_day = include.omit_day %}
+{% if omit_day == nil %}
+  {% assign omit_day = site.breadcrumbs_omit_day %}
+{% endif %}
+
+<nav style="display: inline-block;">
+  {% if page.url == "/" %}
+    {% assign is_front_page = true %}
+  {% else %}
+    {% assign is_front_page = false %}
+  {% endif %}
+
+  {% unless is_front_page %}
+    {% assign page = include.page | default: page %}
+    {% unless omit_home %}
+      {% include breadcrumb_text.html url="/" default="Home" %}
+    {% endunless %}
+  {% endunless %}
+
+  {% unless omit_collection or page.collection == nil %}
+    {% assign collection_slug = page.collection | replace: " ", "-" | downcase | url_encode %}
+    {% assign collection_page_url = "/" | append: collection_slug | append: "/" %}
+    {% include breadcrumb_text.html url=collection_page_url default=page.collection %}
+  {% endunless %}
+
+  {% unless omit_categories %}
+    {% for category in page.categories %}
+      {% assign category_slug = category | replace: " ", "-" | downcase | url_encode %}
+      {% assign category_page_url = "/" | append: category_slug | append: "/" %}
+      {% include breadcrumb_text.html url=category_page_url default=category %}
+    {% endfor %}
+  {% endunless %}
+
+  {% unless omit_date or page.date == nil %}
+    {% assign year = page.date | date: "%Y" %}
+    {% assign year_page_url = "/" | append: year | append: "/" %}
+    {% assign month_int = page.date | date: "%m" %}
+    {% assign month_page_url = year_page_url | append: month_int | append: "/" %}
+    {% assign day_int = page.date | date: "%d" %}
+    {% assign day_page_url = month_page_url | append: day_int | append: "/" %}
+
+    {% unless omit_year %}
+      {% include breadcrumb_text.html url=year_page_url default=year %}
+    {% endunless %}
+
+    {% unless omit_month %}
+      {% assign month_str = page.date | date: "%b" %}
+      {% include breadcrumb_text.html url=month_page_url default=month_str %}
+    {% endunless %}
+
+    {% unless omit_day %}
+      {% assign day_str = page.date | date: "%e" %}
+      {% include breadcrumb_text.html url=day_page_url default=day_str %}
+    {% endunless %}
+  {% endunless %}
+
+  {% unless is_front_page %}
+    {% if page.title == nil %}
+      {% assign title = page.name %}
+    {% else %}
+      {% assign title = page.title %}
+    {% endif %}
+    {% if include.full_stop %}
+      <strong>{{ title }}</strong>.
+    {% else %}
+      <strong>{{ title }}</strong>
+    {% endif %}
+  {% endunless %}
+</nav>

_includes/fullbleed.html

@@ -1,9 +1,9 @@
 {::nomarkdown}
-    </div><!-- .content__inner-container -->
+    </div><!-- .inner-container -->
   </div><!-- .content__outer-container -->
   <div style="margin-bottom: 26px;">
     {{ include.content }}
   </div>
   <div class="content__outer-container">
-    <div class="content__inner-container">
+    <div class="inner-container">
 {:/}

_includes/page_header.html

@@ -0,0 +1,13 @@
+<header class="page-header inner-container">
+  <h1 class="page-header__title">{{ page.title }}</h1>
+  <div class="meta">
+    {% include breadcrumbs.html full_stop=page.date %}
+    {% include tags.html %}
+    {% if site.author and include.author %}
+      <a rel="author" href="{{ "/" | relative_url }}">{{ site.author }}</a>,
+    {% endif %}
+    {% if page.date %}
+      <time datetime="{{ page.date | date: '%Y-%m-%d' }}" pubdate>{{ page.date | date: "%b %Y" }}</time>.
+    {% endif %}
+  </div>
+</header>

_includes/tags.html

@@ -0,0 +1,27 @@
+{% assign tags = "" | split: "" %}
+{% for tag in page.tags %}
+  {% assign tag_slug = tag | replace: " ", "-" | downcase | url_encode %}
+  {% assign tag_url = "/tags/" | append: tag_slug | append: "/" %}
+
+  {% assign tag_page = nil %}
+  {% for page in site.pages %}
+    {% if page.url == tag_url %}
+      {% assign tag_page = page %}
+      {% break %}
+    {% endif %}
+  {% endfor %}
+
+  {% if tag_page %}
+    {% capture tag_str %}<a href="{{ tag_page.url | relative_url }}">{{ tag }}</a>{% endcapture %}
+  {% else %}
+    {% capture tag_str %}<a>{{ tag }}</a>{% endcapture %}
+  {% endif %}
+
+  {% assign tag_str = tag_str | split: "🗾" %}
+  {% assign tags = tags | concat: tag_str %}
+{% endfor %}
+
+{% if tags != empty %}
+  <nav style="display: inline-block;">Tags: {{ tags | array_to_sentence_string }}.</nav>
+{% endif %}
+

_includes/wide.html

@@ -1,5 +1,5 @@
 {::nomarkdown}
-    </div><!-- .content__inner-container -->
+    </div><!-- .inner-container -->
     {{ include.content }}
-    <div class="content__inner-container">
+    <div class="inner-container">
 {:/}

_layouts/default.html

@@ -34,10 +34,10 @@
         </ul>
       </nav>
     </header>
-    {% include anchor_headings.html html=content anchorBody="§" anchorClass="anchor" %}
+    {{ content }}
 
-    <footer class="site-footer">
-      <div class="site-footer__inner">
+    <footer class="site-footer meta">
+      <div class="inner-container">
         <ul class="site-footer__links">
           {% include view_source_link.html %}
           {% include edit_page_link.html %}
@@ -49,5 +49,17 @@
         </ul>
       </footer>
     </footer>
+
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/anchor-js/4.2.2/anchor.min.js"></script>
+    <script>
+       anchors.options.placement = "left";
+       anchors.options.class = "anchor";
+       anchors.add(".inner-container h1");
+       anchors.add(".inner-container h2");
+       anchors.add(".inner-container h3");
+       anchors.add(".inner-container h4");
+       anchors.add(".inner-container h5");
+       anchors.add(".inner-container h6");
+     </script>
   </body>
 </html>

_layouts/page.html

@@ -3,11 +3,9 @@
 ---
 <main class="content">
   <div class="content__outer-container">
-    <header class="content__header">
-      <h1 class="content__title">{{ page.title }}</h1>
-    </header>
-    <div class="content__inner-container">
+    {% include page_header.html %}
+    <div class="inner-container">
       {{ content }}
-    </div><!-- content__inner-container -->
+    </div><!-- inner-container -->
   </div><!-- content__outer-container -->
 </main>

_layouts/post.html

@@ -4,16 +4,10 @@
 <main>
   <article class="content">
     <div class="content__outer-container">
-      <header class="content__header">
-        <h1 class="content__title">{{ page.title }}</h1>
-      </header>
-      <div class="content__inner-container">
+      {% include page_header.html author=true %}
+      <div class="inner-container">
         {{ content }}
-        <footer class="post-footer">
-            — <a class="post-footer__link" href="{{ "/" | relative_url }}">Sean Hammond</a>,
-            <time class="post-footer__time" datetime="{{ page.date | date: '%Y-%m-%d' }}" pubdate>{{ page.date | date: "%b %Y" }}</time>
-        </footer>
-      </div><!-- content__inner-container -->
+      </div><!-- inner-container -->
     </div><!-- content__outer-container -->
   </article>
 </main>