@terrymooreii/sia 2.1.3 → 2.1.4

package/themes/magazine/includes/footer.njk

@@ -0,0 +1,32 @@
+<footer class="site-footer">
+  <div class="footer-container">
+    <div class="footer-brand">
+      <a href="{{ '/' | url }}" class="footer-logo">{{ site.title }}</a>
+      <p class="footer-tagline">{{ site.description }}</p>
+    </div>
+    
+    <div class="footer-links">
+      <div class="footer-column">
+        <h4 class="footer-heading">Navigate</h4>
+        <nav class="footer-nav">
+          <a href="{{ '/' | url }}">Home</a>
+          <a href="{{ '/blog/' | url }}">Articles</a>
+          <a href="{{ '/notes/' | url }}">Notes</a>
+          <a href="{{ '/about/' | url }}">About</a>
+        </nav>
+      </div>
+      
+      <div class="footer-column">
+        <h4 class="footer-heading">Subscribe</h4>
+        <nav class="footer-nav">
+          <a href="{{ '/feed.xml' | url }}">RSS Feed</a>
+          <a href="{{ '/tags/' | url }}">Browse Tags</a>
+        </nav>
+      </div>
+    </div>
+  </div>
+  
+  <div class="footer-bottom">
+    <p>&copy; {{ "now" | date("year") }} {{ site.title }}. Crafted with <a href="https://github.com/terrymooreii/sia">Sia</a>.</p>
+  </div>
+</footer>

package/themes/magazine/includes/header.njk

@@ -0,0 +1,63 @@
+<header class="site-header">
+  <div class="header-container">
+    <a href="{{ '/' | url }}" class="site-logo">{{ site.title }}</a>
+    
+    <nav class="main-nav">
+      <a href="{{ '/' | url }}" class="nav-link {% if page.url == '/' %}active{% endif %}">Home</a>
+      <a href="{{ '/blog/' | url }}" class="nav-link {% if page.url and '/blog' in page.url %}active{% endif %}">Articles</a>
+      <a href="{{ '/notes/' | url }}" class="nav-link {% if page.url and '/notes' in page.url %}active{% endif %}">Notes</a>
+      <a href="{{ '/about/' | url }}" class="nav-link {% if page.url and '/about' in page.url %}active{% endif %}">About</a>
+    </nav>
+    
+    <div class="header-actions">
+      <button class="theme-toggle" aria-label="Toggle dark mode">
+        <svg class="sun-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+          <circle cx="12" cy="12" r="5"></circle>
+          <line x1="12" y1="1" x2="12" y2="3"></line>
+          <line x1="12" y1="21" x2="12" y2="23"></line>
+          <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
+          <line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
+          <line x1="1" y1="12" x2="3" y2="12"></line>
+          <line x1="21" y1="12" x2="23" y2="12"></line>
+          <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
+          <line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
+        </svg>
+        <svg class="moon-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+          <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
+        </svg>
+      </button>
+      
+      <button class="mobile-menu-toggle" aria-label="Toggle menu">
+        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+          <line x1="3" y1="12" x2="21" y2="12"></line>
+          <line x1="3" y1="6" x2="21" y2="6"></line>
+          <line x1="3" y1="18" x2="21" y2="18"></line>
+        </svg>
+      </button>
+    </div>
+  </div>
+  
+  <nav class="mobile-nav">
+    <a href="{{ '/' | url }}" class="mobile-nav-link">Home</a>
+    <a href="{{ '/blog/' | url }}" class="mobile-nav-link">Articles</a>
+    <a href="{{ '/notes/' | url }}" class="mobile-nav-link">Notes</a>
+    <a href="{{ '/tags/' | url }}" class="mobile-nav-link">Tags</a>
+    <a href="{{ '/about/' | url }}" class="mobile-nav-link">About</a>
+  </nav>
+</header>
+
+<script>
+  // Theme toggle
+  document.querySelector('.theme-toggle').addEventListener('click', function() {
+    const html = document.documentElement;
+    const current = html.getAttribute('data-theme');
+    const next = current === 'dark' ? 'light' : 'dark';
+    html.setAttribute('data-theme', next);
+    localStorage.setItem('theme', next);
+  });
+  
+  // Mobile menu toggle
+  document.querySelector('.mobile-menu-toggle').addEventListener('click', function() {
+    document.querySelector('.site-header').classList.toggle('nav-open');
+  });
+</script>

package/themes/magazine/includes/pagination.njk

@@ -0,0 +1,29 @@
+{% if pagination.totalPages > 1 %}
+<nav class="pagination" aria-label="Pagination">
+  {% if pagination.previousUrl %}
+    <a href="{{ pagination.previousUrl }}" class="pagination-link prev">
+      <span class="pagination-arrow">←</span>
+      <span>Newer</span>
+    </a>
+  {% else %}
+    <span class="pagination-link prev disabled">
+      <span class="pagination-arrow">←</span>
+      <span>Newer</span>
+    </span>
+  {% endif %}
+  
+  <span class="pagination-current">{{ pagination.currentPage }} / {{ pagination.totalPages }}</span>
+  
+  {% if pagination.nextUrl %}
+    <a href="{{ pagination.nextUrl }}" class="pagination-link next">
+      <span>Older</span>
+      <span class="pagination-arrow">→</span>
+    </a>
+  {% else %}
+    <span class="pagination-link next disabled">
+      <span>Older</span>
+      <span class="pagination-arrow">→</span>
+    </span>
+  {% endif %}
+</nav>
+{% endif %}

package/themes/magazine/includes/tag-list.njk

@@ -0,0 +1,7 @@
+{% if tags and tags.length %}
+<div class="tag-list">
+  {% for tag in tags %}
+    <a href="{{ ('/tags/' + (tag | slug) + '/') | url }}" class="tag">{{ tag }}</a>
+  {% endfor %}
+</div>
+{% endif %}

package/themes/magazine/layouts/base.njk

@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  {% include "meta.njk" %}
+  {% include "theme-script.njk" %}
+  
+  <link rel="stylesheet" href="{{ '/styles/main.css' | url }}">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Source+Sans+3:wght@400;500;600&family=Source+Serif+4:opsz,wght@8..60,400;8..60,500&display=swap" rel="stylesheet">
+  
+  {% block head %}{% endblock %}
+</head>
+<body>
+  {% include "header.njk" %}
+  
+  <main class="main">
+    {% block content %}{% endblock %}
+  </main>
+  
+  {% include "footer.njk" %}
+</body>
+</html>

package/themes/magazine/layouts/note.njk

@@ -0,0 +1,25 @@
+{% extends "base.njk" %}
+
+{% block content %}
+<article class="note">
+  <header class="note-header">
+    <time class="note-timestamp" datetime="{{ page.date | date('iso') }}">
+      {{ page.date | date('full_time') }}
+    </time>
+  </header>
+  
+  <div class="note-body prose">
+    {{ content | safe }}
+  </div>
+  
+  {% if page.tags %}
+  <footer class="note-footer">
+    <div class="note-tags">
+      {% for tag in page.tags %}
+        <a href="{{ ('/tags/' + (tag | slug) + '/') | url }}" class="tag">{{ tag }}</a>
+      {% endfor %}
+    </div>
+  </footer>
+  {% endif %}
+</article>
+{% endblock %}

package/themes/magazine/layouts/page.njk

@@ -0,0 +1,13 @@
+{% extends "base.njk" %}
+
+{% block content %}
+<article class="page">
+  <header class="page-header">
+    <h1 class="page-title">{{ page.title }}</h1>
+  </header>
+  
+  <div class="page-body prose">
+    {{ content | safe }}
+  </div>
+</article>
+{% endblock %}

package/themes/magazine/layouts/post.njk

@@ -0,0 +1,79 @@
+{% extends "base.njk" %}
+
+{% block content %}
+<article class="article">
+  <header class="article-header">
+    <div class="article-meta-top">
+      {% if page.tags %}
+        <a href="{{ ('/tags/' + (page.tags[0] | slug) + '/') | url }}" class="article-category">{{ page.tags[0] }}</a>
+      {% endif %}
+      <span class="article-reading-time">{{ content | readingTime }}</span>
+    </div>
+    
+    <h1 class="article-title">{{ page.title }}</h1>
+    
+    {% if page.excerpt %}
+    <p class="article-subtitle">{{ page.excerpt | excerpt(200) }}</p>
+    {% endif %}
+    
+    <div class="article-byline">
+      <div class="author-avatar">{{ (page.author or site.author)[0] }}</div>
+      <div class="author-info">
+        <span class="author-name">{{ page.author or site.author }}</span>
+        <time class="publish-date" datetime="{{ page.date | date('iso') }}">{{ page.date | date('long') }}</time>
+      </div>
+    </div>
+  </header>
+  
+  {% if page.image %}
+  <figure class="article-hero">
+    <img src="{{ page.image | url }}" alt="{{ page.title }}">
+    {% if page.imageCaption %}
+    <figcaption>{{ page.imageCaption }}</figcaption>
+    {% endif %}
+  </figure>
+  {% endif %}
+  
+  <div class="article-body prose">
+    {{ content | safe }}
+  </div>
+  
+  <footer class="article-footer">
+    {% if page.tags %}
+    <div class="article-tags">
+      {% for tag in page.tags %}
+        <a href="{{ ('/tags/' + (tag | slug) + '/') | url }}" class="tag">{{ tag }}</a>
+      {% endfor %}
+    </div>
+    {% endif %}
+    
+    <div class="article-share">
+      <span class="share-label">Share this article</span>
+      <div class="share-links">
+        <a href="https://twitter.com/intent/tweet?url={{ site.url }}{{ page.url }}&text={{ page.title | urlencode }}" target="_blank" rel="noopener" class="share-link" aria-label="Share on Twitter">
+          <svg 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"/></svg>
+        </a>
+        <a href="https://www.linkedin.com/sharing/share-offsite/?url={{ site.url }}{{ page.url }}" target="_blank" rel="noopener" class="share-link" aria-label="Share on LinkedIn">
+          <svg 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"/></svg>
+        </a>
+      </div>
+    </div>
+  </footer>
+</article>
+
+<aside class="read-more">
+  <h2 class="read-more-title">Continue Reading</h2>
+  <div class="read-more-posts">
+    {% for post in collections.posts | limit(3) %}
+      {% if post.url != page.url %}
+      <article class="read-more-card">
+        <h3 class="read-more-card-title">
+          <a href="{{ post.url | url }}">{{ post.title }}</a>
+        </h3>
+        <time class="read-more-date">{{ post.date | date('short') }}</time>
+      </article>
+      {% endif %}
+    {% endfor %}
+  </div>
+</aside>
+{% endblock %}

package/themes/magazine/pages/blog.njk

@@ -0,0 +1,35 @@
+{% extends "base.njk" %}
+
+{% block content %}
+<header class="listing-header">
+  <h1 class="listing-title">Articles</h1>
+  <p class="listing-description">Thoughts, stories, and ideas</p>
+</header>
+
+<div class="articles-list">
+  {% for post in posts %}
+  <article class="article-row">
+    <div class="article-row-content">
+      {% if post.tags %}
+      <a href="{{ ('/tags/' + (post.tags[0] | slug) + '/') | url }}" class="row-category">{{ post.tags[0] }}</a>
+      {% endif %}
+      <h2 class="row-title">
+        <a href="{{ post.url | url }}">{{ post.title }}</a>
+      </h2>
+      <p class="row-excerpt">{{ post.excerpt | excerpt(180) }}</p>
+      <div class="row-meta">
+        <span class="row-author">{{ post.author or site.author }}</span>
+        <span class="meta-separator">·</span>
+        <time datetime="{{ post.date | date('iso') }}">{{ post.date | date('long') }}</time>
+        <span class="meta-separator">·</span>
+        <span>{{ post.content | readingTime }}</span>
+      </div>
+    </div>
+  </article>
+  {% else %}
+  <p class="empty-state">No articles yet. Check back soon!</p>
+  {% endfor %}
+</div>
+
+{% include "pagination.njk" %}
+{% endblock %}

package/themes/magazine/pages/feed.njk

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
+  <channel>
+    <title>{{ site.title }}</title>
+    <description>{{ site.description }}</description>
+    <link>{{ site.url }}</link>
+    <atom:link href="{{ site.url }}/feed.xml" rel="self" type="application/rss+xml"/>
+    <lastBuildDate>{{ buildDate }}</lastBuildDate>
+    {% for post in posts | limit(20) %}
+    <item>
+      <title>{{ post.title }}</title>
+      <link>{{ site.url }}{{ post.url }}</link>
+      <guid isPermaLink="true">{{ site.url }}{{ post.url }}</guid>
+      <pubDate>{{ post.date | date('rss') }}</pubDate>
+      <description><![CDATA[{{ post.excerpt | excerpt(300) }}]]></description>
+      {% for tag in post.tags %}
+      <category>{{ tag }}</category>
+      {% endfor %}
+    </item>
+    {% endfor %}
+  </channel>
+</rss>

package/themes/magazine/pages/index.njk

@@ -0,0 +1,79 @@
+{% extends "base.njk" %}
+
+{% block content %}
+<section class="hero">
+  <div class="hero-content">
+    <h1 class="hero-title">{{ site.title }}</h1>
+    <p class="hero-subtitle">{{ site.description }}</p>
+  </div>
+</section>
+
+{% set featuredPost = collections.posts[0] %}
+{% if featuredPost %}
+<section class="featured-section">
+  <article class="featured-article">
+    <div class="featured-content">
+      {% if featuredPost.tags %}
+      <span class="featured-category">{{ featuredPost.tags[0] }}</span>
+      {% endif %}
+      <h2 class="featured-title">
+        <a href="{{ featuredPost.url | url }}">{{ featuredPost.title }}</a>
+      </h2>
+      <p class="featured-excerpt">{{ featuredPost.excerpt | excerpt(200) }}</p>
+      <div class="featured-meta">
+        <span class="featured-author">{{ featuredPost.author or site.author }}</span>
+        <span class="featured-date">{{ featuredPost.date | date('long') }}</span>
+        <span class="featured-reading">{{ featuredPost.content | readingTime }}</span>
+      </div>
+    </div>
+  </article>
+</section>
+{% endif %}
+
+<section class="latest-section">
+  <div class="section-header">
+    <h2 class="section-title">Latest Articles</h2>
+    <a href="{{ '/blog/' | url }}" class="section-link">View all →</a>
+  </div>
+  
+  <div class="articles-grid">
+    {% for post in collections.posts | skip(1) | limit(6) %}
+    <article class="article-card">
+      <div class="card-content">
+        {% if post.tags %}
+        <span class="card-category">{{ post.tags[0] }}</span>
+        {% endif %}
+        <h3 class="card-title">
+          <a href="{{ post.url | url }}">{{ post.title }}</a>
+        </h3>
+        <p class="card-excerpt">{{ post.excerpt | excerpt(100) }}</p>
+        <div class="card-meta">
+          <time datetime="{{ post.date | date('iso') }}">{{ post.date | date('short') }}</time>
+          <span>·</span>
+          <span>{{ post.content | readingTime }}</span>
+        </div>
+      </div>
+    </article>
+    {% endfor %}
+  </div>
+</section>
+
+{% if collections.notes.length %}
+<section class="notes-section">
+  <div class="section-header">
+    <h2 class="section-title">Recent Notes</h2>
+    <a href="{{ '/notes/' | url }}" class="section-link">View all →</a>
+  </div>
+  
+  <div class="notes-feed">
+    {% for note in collections.notes | limit(3) %}
+    <article class="note-preview">
+      <time datetime="{{ note.date | date('iso') }}">{{ note.date | date('short') }}</time>
+      <p>{{ note.excerpt | excerpt(150) }}</p>
+      <a href="{{ note.url | url }}" class="note-link">Read note →</a>
+    </article>
+    {% endfor %}
+  </div>
+</section>
+{% endif %}
+{% endblock %}

package/themes/magazine/pages/notes.njk

@@ -0,0 +1,33 @@
+{% extends "base.njk" %}
+
+{% block content %}
+<header class="listing-header">
+  <h1 class="listing-title">Notes</h1>
+  <p class="listing-description">Quick thoughts and observations</p>
+</header>
+
+<div class="notes-list">
+  {% for note in notes %}
+  <article class="note-item">
+    <time class="note-time" datetime="{{ note.date | date('iso') }}">
+      {{ note.date | date('full') }}
+    </time>
+    <div class="note-content">
+      <p>{{ note.excerpt | excerpt(250) }}</p>
+      <a href="{{ note.url | url }}" class="note-read-more">Continue reading →</a>
+    </div>
+    {% if note.tags %}
+    <div class="note-item-tags">
+      {% for tag in note.tags %}
+        <a href="{{ ('/tags/' + (tag | slug) + '/') | url }}" class="tag">{{ tag }}</a>
+      {% endfor %}
+    </div>
+    {% endif %}
+  </article>
+  {% else %}
+  <p class="empty-state">No notes yet.</p>
+  {% endfor %}
+</div>
+
+{% include "pagination.njk" %}
+{% endblock %}

package/themes/magazine/pages/tag.njk

@@ -0,0 +1,31 @@
+{% extends "base.njk" %}
+
+{% block content %}
+<header class="listing-header">
+  <span class="tag-label">Topic</span>
+  <h1 class="listing-title">{{ tag.name }}</h1>
+  <p class="listing-description">{{ tag.count }} article{% if tag.count != 1 %}s{% endif %}</p>
+</header>
+
+<div class="articles-list">
+  {% for post in posts %}
+  <article class="article-row">
+    <div class="article-row-content">
+      <h2 class="row-title">
+        <a href="{{ post.url | url }}">{{ post.title }}</a>
+      </h2>
+      <p class="row-excerpt">{{ post.excerpt | excerpt(180) }}</p>
+      <div class="row-meta">
+        <span class="row-author">{{ post.author or site.author }}</span>
+        <span class="meta-separator">·</span>
+        <time datetime="{{ post.date | date('iso') }}">{{ post.date | date('long') }}</time>
+        <span class="meta-separator">·</span>
+        <span>{{ post.content | readingTime }}</span>
+      </div>
+    </div>
+  </article>
+  {% endfor %}
+</div>
+
+{% include "pagination.njk" %}
+{% endblock %}

package/themes/magazine/pages/tags.njk

@@ -0,0 +1,19 @@
+{% extends "base.njk" %}
+
+{% block content %}
+<header class="listing-header">
+  <h1 class="listing-title">Topics</h1>
+  <p class="listing-description">Explore articles by topic</p>
+</header>
+
+<div class="topics-grid">
+  {% for tag in allTags %}
+  <a href="{{ ('/tags/' + tag.slug + '/') | url }}" class="topic-card">
+    <span class="topic-name">{{ tag.name }}</span>
+    <span class="topic-count">{{ tag.count }} article{% if tag.count != 1 %}s{% endif %}</span>
+  </a>
+  {% else %}
+  <p class="empty-state">No topics yet.</p>
+  {% endfor %}
+</div>
+{% endblock %}