enya-agent 0.1.0

package/docs/themes/tanuki/templates/index.html

@@ -0,0 +1,178 @@
+{% extends "base.html" %}
+
+{% block title %}{{ config.title }}{% endblock %}
+
+{% block content %}
+{% set mode = config.extra.mode | default(value="site") %}
+
+{% if mode == "site" or mode == "blog" %}
+{# raskell.io style homepage #}
+<div class="container">
+    <section class="hero">
+        <div class="content">
+            {% set section = get_section(path="_index.md") %}
+            {{ section.content | safe }}
+        </div>
+
+        {# Speaking & Social #}
+        <div class="hero-meta">
+            {% if config.extra.speaking_badge %}
+            <p class="speaking-badge"><strong>{{ config.extra.speaking_badge }}</strong> · Available for technical talks and consulting</p>
+            {% endif %}
+            <div class="bio-social">
+                {% if config.extra.social.github %}
+                <a href="{{ config.extra.social.github }}" target="_blank" rel="noreferrer" title="github" aria-label="github">
+                    <svg width="25" height="25" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path></svg>
+                </a>
+                {% endif %}
+                {% if config.extra.social.twitter %}
+                <a href="{{ config.extra.social.twitter }}" target="_blank" rel="noreferrer" title="X (Twitter)" aria-label="X (Twitter)">
+                    <svg width="25" height="25" viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"></path></svg>
+                </a>
+                {% endif %}
+                {% if config.extra.social.linkedin %}
+                <a href="{{ config.extra.social.linkedin }}" target="_blank" rel="noreferrer" title="linkedin" aria-label="linkedin">
+                    <svg width="25" height="25" viewBox="0 0 24 24" fill="currentColor"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"></path></svg>
+                </a>
+                {% endif %}
+            </div>
+        </div>
+    </section>
+</div>
+
+{# Articles - prominent #}
+{% set articles_section = get_section(path="articles/_index.md", required=false) %}
+{% if articles_section %}
+<div class="container">
+    <section>
+        <h2>Writing</h2>
+        <div class="posts">
+            {% for page in articles_section.pages | slice(end=10) %}
+            <div class="post">
+                <a href="{{ page.permalink }}">
+                    <div class="post-row">
+                        <time>{{ page.date | date(format="%Y-%m-%d") }}</time>
+                        <h3>{{ page.title }}</h3>
+                    </div>
+                    {% if page.taxonomies.tags %}
+                    <div class="post-tags">
+                        {% for tag in page.taxonomies.tags | slice(end=3) %}
+                        <span class="tag">{{ tag }}</span>
+                        {% endfor %}
+                    </div>
+                    {% endif %}
+                </a>
+            </div>
+            {% endfor %}
+        </div>
+        <a class="view-all-link" href="{{ get_url(path='@/articles/_index.md') }}">View all articles →</a>
+    </section>
+</div>
+{% endif %}
+
+{% elif mode == "product" %}
+{# Product mode - Landing page for products/tools #}
+<section class="product-hero">
+    <h1 class="product-hero__title">{{ config.title }}</h1>
+    <p class="product-hero__subtitle">{{ config.description }}</p>
+    <div class="product-hero__actions">
+        {% if config.extra.cta_primary %}
+        <a href="{{ config.extra.cta_primary.url | safe }}" class="btn btn--primary btn--lg">
+            {{ config.extra.cta_primary.text }}
+        </a>
+        {% endif %}
+        {% if config.extra.cta_secondary %}
+        <a href="{{ config.extra.cta_secondary.url | safe }}" class="btn btn--secondary btn--lg">
+            {{ config.extra.cta_secondary.text }}
+        </a>
+        {% endif %}
+    </div>
+</section>
+
+{# Features section from config #}
+{% if config.extra.product.features is defined %}
+<section class="product-features product-section">
+    <div class="product-section__container">
+        {% if config.extra.product.features_title is defined %}
+        <h2 class="product-section__title">{{ config.extra.product.features_title }}</h2>
+        {% endif %}
+        <div class="product-feature-grid">
+            {% for feature in config.extra.product.features %}
+            <article class="product-feature-card">
+                {% if feature.icon %}
+                <div class="product-feature-card__icon">{{ feature.icon | safe }}</div>
+                {% endif %}
+                <h3 class="product-feature-card__title">{{ feature.title }}</h3>
+                <p class="product-feature-card__description">{{ feature.description }}</p>
+            </article>
+            {% endfor %}
+        </div>
+    </div>
+</section>
+{% endif %}
+
+{# Install section #}
+{% if config.extra.product.install_command is defined %}
+<section class="product-install product-section">
+    <div class="product-section__container">
+        <h2 class="product-section__title">Install</h2>
+        <div class="product-install__code">
+            <code><span class="product-install__cmd">{{ config.extra.product.install_command }}</span></code>
+        </div>
+        {% if config.extra.product.install_alternatives %}
+        <p class="product-install__alternatives">{{ config.extra.product.install_alternatives | safe }}</p>
+        {% endif %}
+    </div>
+</section>
+{% endif %}
+
+{# Product footer #}
+<footer class="product-footer">
+    <div class="product-footer__container">
+        <div class="product-footer__content">
+            <div class="product-footer__brand">
+                {% if config.extra.product.icon %}
+                <div class="product-footer__icon-wrapper">
+                    <div class="product-footer__icon-glow"></div>
+                    <img src="{{ get_url(path=config.extra.product.icon) | safe }}" alt="" class="product-footer__icon">
+                </div>
+                {% endif %}
+                <div class="product-footer__tagline">
+                    <p class="product-footer__title">{{ config.extra.product.tagline | default(value=config.description) }}</p>
+                    <p class="product-footer__description">{{ config.extra.product.footer_description | default(value="") }}</p>
+                </div>
+            </div>
+            <nav class="product-footer__links">
+                {% if config.extra.product.footer_links is defined %}
+                {% for col in config.extra.product.footer_links %}
+                <div class="product-footer__col">
+                    <h4>{{ col.title }}</h4>
+                    {% for link in col.links %}
+                    <a href="{{ link.url | safe }}">{{ link.text }}</a>
+                    {% endfor %}
+                </div>
+                {% endfor %}
+                {% endif %}
+            </nav>
+        </div>
+        <div class="product-footer__bottom">
+            <p>&copy; {{ now() | date(format='%Y') }} {% if config.extra.author %}<a href="{{ config.extra.author_url | default(value='#') }}">{{ config.extra.author }}</a>{% endif %}. {{ config.extra.product.license | default(value="") }}</p>
+        </div>
+    </div>
+</footer>
+
+{% elif mode == "docs" or mode == "book" %}
+{# Docs/Book mode - redirect to first page or show landing #}
+{% set section = get_section(path="_index.md") %}
+{% if section.pages %}
+{% set first_page = section.pages | first %}
+<script>window.location.href = "{{ first_page.permalink | safe }}";</script>
+<p>Redirecting to <a href="{{ first_page.permalink | safe }}">{{ first_page.title }}</a>...</p>
+{% else %}
+<section class="hero">
+    <h1 class="hero__title">{{ config.title }}</h1>
+    <p class="hero__subtitle">{{ config.description }}</p>
+</section>
+{% endif %}
+{% endif %}
+{% endblock %}

package/docs/themes/tanuki/templates/landing.html

@@ -0,0 +1,168 @@
+{% extends "base.html" %}
+
+{% block title %}{{ config.title }}{% endblock %}
+
+{% block content %}
+<section class="hero hero--landing">
+    <div class="hero__content">
+        <h1 class="hero__title">
+            <span class="hero__icon">tanuki</span>
+        </h1>
+        <p class="hero__subtitle">{{ config.description }}</p>
+        <p class="hero__tagline">Named after the playful Japanese raccoon dog, this theme brings joy and whimsy to your Zola sites.</p>
+    </div>
+</section>
+
+<section class="modes">
+    <div class="container">
+        <h2 class="section__title">Three Modes, One Theme</h2>
+        <p class="section__subtitle">Choose the mode that fits your project</p>
+
+        <div class="mode-grid">
+            <a href="{{ get_url(path='@/docs/_index.md') }}" class="mode-card mode-card--docs">
+                <div class="mode-card__icon">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
+                        <path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H20v20H6.5a2.5 2.5 0 0 1 0-5H20"/>
+                        <path d="M8 7h6"/>
+                        <path d="M8 11h8"/>
+                    </svg>
+                </div>
+                <h3 class="mode-card__title">Documentation</h3>
+                <p class="mode-card__description">Technical docs with versioning, sidebar navigation, and search. Perfect for API references and guides.</p>
+                <span class="mode-card__cta">Explore Docs</span>
+            </a>
+
+            <a href="{{ get_url(path='@/book/_index.md') }}" class="mode-card mode-card--book">
+                <div class="mode-card__icon">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
+                        <path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"/>
+                        <path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"/>
+                    </svg>
+                </div>
+                <h3 class="mode-card__title">E-Book</h3>
+                <p class="mode-card__description">Long-form content with chapter navigation and reading-optimized layout. Ideal for tutorials and courses.</p>
+                <span class="mode-card__cta">Read Book</span>
+            </a>
+
+            <a href="{{ get_url(path='@/blog/_index.md') }}" class="mode-card mode-card--blog">
+                <div class="mode-card__icon">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
+                        <path d="M12 19l7-7 3 3-7 7-3-3z"/>
+                        <path d="M18 13l-1.5-7.5L2 2l3.5 14.5L13 18l5-5z"/>
+                        <path d="M2 2l7.586 7.586"/>
+                        <circle cx="11" cy="11" r="2"/>
+                    </svg>
+                </div>
+                <h3 class="mode-card__title">Blog</h3>
+                <p class="mode-card__description">Posts, articles, and landing pages. Features hero sections, card layouts, and pagination.</p>
+                <span class="mode-card__cta">View Blog</span>
+            </a>
+        </div>
+    </div>
+</section>
+
+<section class="features">
+    <div class="container">
+        <h2 class="section__title">Features</h2>
+
+        <div class="feature-grid">
+            <div class="feature">
+                <div class="feature__icon">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                        <circle cx="12" cy="12" r="4"/>
+                        <path d="M12 2v2"/>
+                        <path d="M12 20v2"/>
+                        <path d="m4.93 4.93 1.41 1.41"/>
+                        <path d="m17.66 17.66 1.41 1.41"/>
+                        <path d="M2 12h2"/>
+                        <path d="M20 12h2"/>
+                        <path d="m6.34 17.66-1.41 1.41"/>
+                        <path d="m19.07 4.93-1.41 1.41"/>
+                    </svg>
+                </div>
+                <h3 class="feature__title">Catppuccin Colors</h3>
+                <p class="feature__description">Beautiful Mocha (dark) and Latte (light) themes with smooth transitions.</p>
+            </div>
+
+            <div class="feature">
+                <div class="feature__icon">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                        <polyline points="4 7 4 4 20 4 20 7"/>
+                        <line x1="9" x2="15" y1="20" y2="20"/>
+                        <line x1="12" x2="12" y1="4" y2="20"/>
+                    </svg>
+                </div>
+                <h3 class="feature__title">Geist Typography</h3>
+                <p class="feature__description">Vercel's beautiful Geist font family for optimal readability.</p>
+            </div>
+
+            <div class="feature">
+                <div class="feature__icon">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                        <circle cx="11" cy="11" r="8"/>
+                        <path d="m21 21-4.3-4.3"/>
+                    </svg>
+                </div>
+                <h3 class="feature__title">Full-Text Search</h3>
+                <p class="feature__description">Elasticlunr-powered search with keyboard shortcuts.</p>
+            </div>
+
+            <div class="feature">
+                <div class="feature__icon">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                        <rect width="18" height="18" x="3" y="3" rx="2"/>
+                        <path d="m9 12 2 2 4-4"/>
+                    </svg>
+                </div>
+                <h3 class="feature__title">Accessible</h3>
+                <p class="feature__description">WCAG-compliant with keyboard navigation and screen reader support.</p>
+            </div>
+
+            <div class="feature">
+                <div class="feature__icon">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                        <path d="M6 18h8"/>
+                        <path d="M3 22h18"/>
+                        <path d="M14 22a7 7 0 1 0 0-14h-1"/>
+                        <path d="M9 14h2"/>
+                        <path d="M9 12a2 2 0 0 1-2-2V6h6v4a2 2 0 0 1-2 2Z"/>
+                        <path d="M12 6V3a1 1 0 0 0-1-1H9a1 1 0 0 0-1 1v3"/>
+                    </svg>
+                </div>
+                <h3 class="feature__title">Nintendo UX</h3>
+                <p class="feature__description">Whimsical animations and delightful interactions inspired by Nintendo.</p>
+            </div>
+
+            <div class="feature">
+                <div class="feature__icon">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                        <polyline points="6 9 6 2 18 2 18 9"/>
+                        <path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"/>
+                        <rect width="12" height="8" x="6" y="14"/>
+                    </svg>
+                </div>
+                <h3 class="feature__title">Print Ready</h3>
+                <p class="feature__description">Print documentation or books as a single, beautifully formatted document.</p>
+            </div>
+        </div>
+    </div>
+</section>
+
+<section class="cta">
+    <div class="container">
+        <h2 class="cta__title">Get Started</h2>
+        <p class="cta__description">Add Tanuki to your Zola project in seconds.</p>
+        <div class="cta__code">
+            <code>git submodule add https://github.com/raskell-io/tanuki themes/tanuki</code>
+        </div>
+        <div class="cta__actions">
+            <a href="https://github.com/raskell-io/tanuki" class="btn btn--primary btn--lg" target="_blank" rel="noopener">
+                View on GitHub
+            </a>
+            <a href="{{ get_url(path='@/docs/_index.md') }}" class="btn btn--secondary btn--lg">
+                Read the Docs
+            </a>
+        </div>
+    </div>
+</section>
+{% endblock %}

package/docs/themes/tanuki/templates/macros/nav.html

@@ -0,0 +1,128 @@
+{# =============================================================================
+   Macros: Navigation
+   Reusable navigation components
+   ============================================================================= #}
+
+{# -----------------------------------------------------------------------------
+   Nav Links - Header navigation links
+   Usage: {{ macros::nav_links(nav=config.extra.nav, current_path=current_path) }}
+   ----------------------------------------------------------------------------- #}
+{% macro nav_links(nav, current_path="") %}
+{% if nav %}
+{% for link in nav %}
+    {% if link.children %}
+    <div class="nav-dropdown">
+        <button class="nav-dropdown__trigger" type="button" aria-expanded="false" aria-haspopup="true">
+            {{ link.name }}
+            <svg class="nav-dropdown__chevron" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg>
+        </button>
+        <div class="nav-dropdown__menu" role="menu">
+            {% for child in link.children %}
+            <a href="{{ child.url | safe }}" role="menuitem"{% if child.external %} target="_blank" rel="noopener noreferrer"{% endif %}>
+                {{ child.name }}
+            </a>
+            {% endfor %}
+        </div>
+    </div>
+    {% else %}
+    <a href="{{ link.url | safe }}" class="header__link {% if current_path == link.url %}active{% endif %}"{% if link.external %} target="_blank" rel="noopener noreferrer"{% endif %}>
+        {{ link.name }}
+    </a>
+    {% endif %}
+{% endfor %}
+{% endif %}
+{% endmacro %}
+
+{# -----------------------------------------------------------------------------
+   Sidebar Nav - Hierarchical sidebar navigation
+   Usage: {{ macros::sidebar_nav(pages=section.pages, current_path=current_path) }}
+   ----------------------------------------------------------------------------- #}
+{% macro sidebar_nav(pages, current_path="") %}
+<nav class="sidebar__nav" role="navigation" aria-label="Table of contents">
+    <ul class="nav-list">
+        {% for page in pages %}
+        <li class="nav-item">
+            <a href="{{ page.permalink | safe }}" {% if current_path == page.path %}aria-current="page"{% endif %}>
+                {{ page.title }}
+            </a>
+        </li>
+        {% endfor %}
+    </ul>
+</nav>
+{% endmacro %}
+
+{# -----------------------------------------------------------------------------
+   Breadcrumbs - Breadcrumb navigation
+   Usage: {{ macros::breadcrumbs(items=[{name: "Home", url: "/"}, {name: "Blog", url: "/blog/"}]) }}
+   ----------------------------------------------------------------------------- #}
+{% macro breadcrumbs(items) %}
+<nav class="breadcrumbs" aria-label="Breadcrumb">
+    <ol>
+        {% for item in items %}
+        <li>
+            {% if loop.last %}
+            <span aria-current="page">{{ item.name }}</span>
+            {% else %}
+            <a href="{{ item.url | safe }}">{{ item.name }}</a>
+            <span class="separator" aria-hidden="true">/</span>
+            {% endif %}
+        </li>
+        {% endfor %}
+    </ol>
+</nav>
+{% endmacro %}
+
+{# -----------------------------------------------------------------------------
+   Table of Contents - Page TOC from headers
+   Usage: {{ macros::toc(toc=page.toc) }}
+   ----------------------------------------------------------------------------- #}
+{% macro toc(toc, title="On this page") %}
+{% if toc %}
+<nav class="toc" aria-label="Table of contents">
+    {% if title %}
+    <h2 class="toc__title">{{ title }}</h2>
+    {% endif %}
+    <ul class="toc__list">
+        {% for h in toc %}
+        <li class="toc__item toc__item--h{{ h.level }}">
+            <a href="#{{ h.id }}">{{ h.title }}</a>
+            {% if h.children %}
+            <ul class="toc__list toc__list--nested">
+                {% for child in h.children %}
+                <li class="toc__item">
+                    <a href="#{{ child.id }}">{{ child.title }}</a>
+                </li>
+                {% endfor %}
+            </ul>
+            {% endif %}
+        </li>
+        {% endfor %}
+    </ul>
+</nav>
+{% endif %}
+{% endmacro %}
+
+{# -----------------------------------------------------------------------------
+   Prev/Next Navigation - For sequential content (books, docs)
+   Usage: {{ macros::prev_next(prev=page.lower, next=page.higher) }}
+   ----------------------------------------------------------------------------- #}
+{% macro prev_next(prev, next) %}
+{% if prev or next %}
+<nav class="prev-next" aria-label="Previous and next pages">
+    {% if prev %}
+    <a href="{{ prev.permalink | safe }}" class="prev-next__link prev-next__link--prev">
+        <span class="prev-next__label">Previous</span>
+        <span class="prev-next__title">{{ prev.title }}</span>
+    </a>
+    {% else %}
+    <div class="prev-next__spacer"></div>
+    {% endif %}
+    {% if next %}
+    <a href="{{ next.permalink | safe }}" class="prev-next__link prev-next__link--next">
+        <span class="prev-next__label">Next</span>
+        <span class="prev-next__title">{{ next.title }}</span>
+    </a>
+    {% endif %}
+</nav>
+{% endif %}
+{% endmacro %}

package/docs/themes/tanuki/templates/macros/posts.html

@@ -0,0 +1,101 @@
+{# =============================================================================
+   Macros: Posts
+   Reusable components for displaying posts/articles
+   ============================================================================= #}
+
+{# -----------------------------------------------------------------------------
+   Post Row - Simple date | title format
+   Usage: {{ macros::post_row(page=page) }}
+   ----------------------------------------------------------------------------- #}
+{% macro post_row(page, date_format="%b %d") %}
+<article class="post">
+    <a href="{{ page.permalink | safe }}">
+        <div class="post-row">
+            {% if page.date %}
+            <time datetime="{{ page.date }}">{{ page.date | date(format=date_format) }}</time>
+            {% endif %}
+            <h3>{{ page.title }}</h3>
+        </div>
+    </a>
+</article>
+{% endmacro %}
+
+{# -----------------------------------------------------------------------------
+   Post Card - With description and meta
+   Usage: {{ macros::post_card(page=page, show_description=true, show_tags=true) }}
+   ----------------------------------------------------------------------------- #}
+{% macro post_card(page, show_description=true, show_tags=true, max_tags=3) %}
+<article class="blog-card">
+    <div class="blog-card__content">
+        <h2 class="blog-card__title">
+            <a href="{{ page.permalink | safe }}">{{ page.title }}</a>
+        </h2>
+        {% if show_description and page.description %}
+        <p class="blog-card__description">{{ page.description }}</p>
+        {% endif %}
+        <div class="blog-card__meta">
+            {% if page.date %}
+            <time datetime="{{ page.date }}">{{ page.date | date(format="%B %d, %Y") }}</time>
+            {% endif %}
+            {% if show_tags and page.taxonomies.tags %}
+            <div class="blog-card__tags">
+                {% for tag in page.taxonomies.tags | slice(end=max_tags) %}
+                <a href="{{ get_taxonomy_url(kind='tags', name=tag) | safe }}" class="tag">{{ tag }}</a>
+                {% endfor %}
+            </div>
+            {% endif %}
+        </div>
+    </div>
+</article>
+{% endmacro %}
+
+{# -----------------------------------------------------------------------------
+   Post List - List of post rows
+   Usage: {{ macros::post_list(pages=section.pages, limit=6) }}
+   ----------------------------------------------------------------------------- #}
+{% macro post_list(pages, limit=10, date_format="%b %d") %}
+<div class="posts">
+    {% for page in pages | slice(end=limit) %}
+    {{ self::post_row(page=page, date_format=date_format) }}
+    {% endfor %}
+</div>
+{% endmacro %}
+
+{# -----------------------------------------------------------------------------
+   Post Grid - Grid of post cards
+   Usage: {{ macros::post_grid(pages=section.pages, limit=6) }}
+   ----------------------------------------------------------------------------- #}
+{% macro post_grid(pages, limit=10, show_description=true, show_tags=true) %}
+<div class="blog-posts">
+    {% for page in pages | slice(end=limit) %}
+    {{ self::post_card(page=page, show_description=show_description, show_tags=show_tags) }}
+    {% endfor %}
+</div>
+{% endmacro %}
+
+{# -----------------------------------------------------------------------------
+   Post Meta - Date, reading time, tags
+   Usage: {{ macros::post_meta(page=page) }}
+   ----------------------------------------------------------------------------- #}
+{% macro post_meta(page, show_reading_time=true, show_tags=true) %}
+<div class="post-meta">
+    <div class="meta-line">
+        {% if page.date %}
+        <time datetime="{{ page.date }}">{{ page.date | date(format="%B %d, %Y") }}</time>
+        {% endif %}
+        {% if show_reading_time and page.reading_time %}
+        <span class="separator">&middot;</span>
+        <span class="reading-time">{{ page.reading_time }} min read</span>
+        {% endif %}
+    </div>
+    {% if show_tags and page.taxonomies.tags %}
+    <div class="article-taxonomies">
+        <div class="tags">
+            {% for tag in page.taxonomies.tags %}
+            <a href="{{ get_taxonomy_url(kind='tags', name=tag) | safe }}" class="tag">{{ tag }}</a>
+            {% endfor %}
+        </div>
+    </div>
+    {% endif %}
+</div>
+{% endmacro %}