1 files changed, 71 insertions, 0 deletions
diff --git a/templates/section.html b/templates/section.html
new file mode 100755
index 0000000..83c5134
--- /dev/null
+++ b/templates/section.html
@@ -0,0 +1,71 @@
+{% extends 'base.html' %}
+
+{% block title %}
+{{ config.title }} | {{ section.title }}
+{% endblock title %}
+
+{% block content %}
+<section class="section">
+  <div class="container max-w-7xl mx-auto">
+    <div class="flex flex-col items-center flex-start space-y-2 py-8">
+      <h1 class="title leading-10 text-3xl text-garage-gray">{{ section.title }}</h1>
+      <p class="italic">{{ section.description }}</p>
+    </div>
+    <div class="content">
+      {{ section.content | safe }}
+    </div>
+    <div class="columns is-centered">
+      <div class="space-y-20">
+        {% if paginator %}
+          {% set pages = paginator.pages %}
+        {% else %}
+          {% set pages = section.pages %}
+        {% endif %}
+
+        {% for page in pages %}
+        <article class="border-l-4 border-garage-gray pl-4">
+          <h2 class="text-garage-gray hover:text-garage-orange text-2xl pb-3">
+            <a class="w-full block" href='{{ page.permalink }}'>
+              {{ page.title }}
+            </a>
+          </h2>
+          {% if page.description %}
+            <p class="w-max italic text-gray-600 py-0.5 px-1.5 bg-gray-100 rounded mb-1">{{ page.description }}</p>
+          {% endif %}
+          <div class="flex space-x-1 text-sm py-2 bg-garage-orange bg-opacity-10 w-full p-1.5 rounded">
+            <div class="column is-8">
+              {{ macros::page_publish_metadata(page=page) }}
+            </div>
+            <div class="column is-4 has-text-right-desktop">
+              {{ macros::page_content_metadata(page=page) }}
+            </div>
+          </div>
+          <div class="content mt-2">
+            {{ page.summary | safe }}
+            <a class="group py-4 font-semibold px-4 py-2 flex items-center space-x-1 text-garage-orange" href='{{ page.permalink }}'>
+              <div class="h-0.5 mt-0.5 w-4 group-hover:w-8 group-hover:bg-garage-gray transition-all bg-garage-orange"></div>
+              <span>Read</span>
+              <span class="text-garage-orange group-hover:text-garage-gray transition-all">
+                <i class="fas fa-arrow-right fa-xs"></i>
+              </span>
+            </a>
+          </div>
+          <div class="columns">
+            <div class="column">
+              {% if page.taxonomies.categories %}
+                {{ macros::render_categories(categories=page.taxonomies.categories) }}
+              {% endif %}
+            </div>
+            <div class="column has-text-right-desktop">
+              {% if page.taxonomies.tags %}
+                {{ macros::render_tags(tags=page.taxonomies.tags) }}
+              {% endif %}
+            </div>
+          </div>
+        </article>
+        {% endfor %}
+      </div>
+    </div>
+  </div>
+</section>
+{% endblock %}