@terrymooreii/sia 2.0.2 → 2.1.1

package/_config.yml

@@ -4,6 +4,8 @@ site:
   url: "http://localhost:3000"
   author: "Terry Moore II"
 
+theme: main
+
 input: src
 output: dist
 
@@ -30,3 +32,4 @@ pagination:
 
 server:
   port: 3000
+  showDrafts: false  # Set to true to show draft posts in dev server

package/defaults/layouts/note.njk

@@ -7,7 +7,7 @@
   </div>
   
   <footer class="note-footer">
-    <time datetime="{{ page.date | date('iso') }}">{{ page.date | date('full') }}</time>
+    <time datetime="{{ page.date | date('iso') }}">{{ page.date | date('full_time') }}</time>
     {% if page.tags and page.tags.length %}
     <span class="note-tags">
       {% for tag in page.tags %}

package/defaults/layouts/post.njk

@@ -3,7 +3,10 @@
 {% block content %}
 <article class="post">
   <header class="post-header">
-    <h1 class="post-title">{{ page.title }}</h1>
+    <h1 class="post-title">
+      {{ page.title }}
+      {% if page.draft %}<span class="draft-badge">Draft</span>{% endif %}
+    </h1>
     
     <div class="post-meta">
       <time datetime="{{ page.date | date('iso') }}">{{ page.date | date('long') }}</time>

package/defaults/pages/blog.njk

@@ -11,6 +11,7 @@
   <article class="post-card">
     <h2 class="post-card-title">
       <a href="{{ post.url }}">{{ post.title }}</a>
+      {% if post.draft %}<span class="draft-badge">Draft</span>{% endif %}
     </h2>
     <div class="post-card-meta">
       <time datetime="{{ post.date | date('iso') }}">{{ post.date | date('long') }}</time>

package/defaults/pages/index.njk

@@ -17,6 +17,7 @@
     <article class="post-card">
       <h3 class="post-card-title">
         <a href="{{ post.url }}">{{ post.title }}</a>
+        {% if post.draft %}<span class="draft-badge">Draft</span>{% endif %}
       </h3>
       <div class="post-card-meta">
         <time datetime="{{ post.date | date('iso') }}">{{ post.date | date('short') }}</time>
@@ -48,7 +49,7 @@
     <article class="note-card">
       <div class="note-card-content">{{ note.excerpt }}</div>
       <footer class="note-card-footer">
-        <time datetime="{{ note.date | date('iso') }}">{{ note.date | date('short') }}</time>
+        <time datetime="{{ note.date | date('iso') }}">{{ note.date | date('full_time') }}</time>
         <a href="{{ note.url }}" class="note-card-link">View →</a>
       </footer>
     </article>

package/defaults/pages/notes.njk

@@ -13,7 +13,7 @@
       {{ note.content | safe }}
     </div>
     <footer class="note-item-footer">
-      <time datetime="{{ note.date | date('iso') }}">{{ note.date | date('full') }}</time>
+      <time datetime="{{ note.date | date('iso') }}">{{ note.date | date('full_time') }}</time>
       {% if note.tags and note.tags.length %}
       <div class="note-item-tags">
         {% for tag in note.tags %}

package/defaults/pages/tag.njk

@@ -11,6 +11,7 @@
   <article class="post-card">
     <h2 class="post-card-title">
       <a href="{{ post.url }}">{{ post.title or post.excerpt }}</a>
+      {% if post.draft %}<span class="draft-badge">Draft</span>{% endif %}
     </h2>
     <div class="post-card-meta">
       <time datetime="{{ post.date | date('iso') }}">{{ post.date | date('long') }}</time>

package/defaults/styles/main.css

@@ -250,7 +250,6 @@ img {
 .hero {
   text-align: center;
   padding: var(--spacing-3xl) 0;
-  border-bottom: 1px solid var(--color-border-light);
   margin-bottom: var(--spacing-2xl);
 }
 
@@ -342,6 +341,10 @@ img {
   font-weight: 600;
   margin: 0 0 var(--spacing-sm);
   line-height: 1.3;
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: var(--spacing-sm);
 }
 
 .post-card-title a {
@@ -397,6 +400,10 @@ img {
   letter-spacing: -0.02em;
   margin: 0 0 var(--spacing-md);
   line-height: 1.2;
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: var(--spacing-sm);
 }
 
 .post-meta {
@@ -567,12 +574,29 @@ img {
   font-size: 0.9375rem;
 }
 
-.tags-page {
-  /* Tags page layout */
+/* ===== Draft Badge ===== */
+.draft-badge {
+  display: inline-flex;
+  align-items: center;
+  padding: 0.125em 0.4em;
+  background: #f59e0b;
+  color: white;
+  font-size: 0.65rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  border-radius: var(--radius-sm);
+  line-height: 1;
+  flex-shrink: 0;
+}
+
+[data-theme="dark"] .draft-badge {
+  background: #fbbf24;
+  color: #1a202c;
 }
 
-.tags-detail {
-  /* Tag detail sections */
+.prose .draft-badge {
+  font-size: 0.6rem;
 }
 
 .tag-section {
@@ -829,6 +853,240 @@ img {
   font-weight: 600;
 }
 
+/* ===== Alert Boxes ===== */
+.prose .markdown-alert {
+  margin: 1.5em 0;
+  padding: var(--spacing-md) var(--spacing-lg);
+  border-left: 4px solid;
+  border-radius: var(--radius-md);
+  background: var(--color-bg-alt);
+}
+
+.prose .markdown-alert-title {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-sm);
+  margin: 0 0 var(--spacing-sm) 0;
+  font-weight: 600;
+  font-style: normal;
+}
+
+.prose .markdown-alert-title svg {
+  flex-shrink: 0;
+  width: 16px;
+  height: 16px;
+  fill: currentColor;
+}
+
+/* Make SVG icons lighter in dark mode */
+[data-theme="dark"] .prose .markdown-alert-title svg {
+  fill: currentColor;
+}
+
+.prose .markdown-alert p:last-child {
+  margin-bottom: 0;
+}
+
+/* Note Alert */
+.prose .markdown-alert-note {
+  border-left-color: #0969da;
+  background: rgba(9, 105, 218, 0.1);
+}
+
+.prose .markdown-alert-note .markdown-alert-title {
+  color: #0969da;
+}
+
+[data-theme="dark"] .prose .markdown-alert-note {
+  background: rgba(9, 105, 218, 0.15);
+  border-left-color: #58a6ff;
+}
+
+[data-theme="dark"] .prose .markdown-alert-note .markdown-alert-title {
+  color: #58a6ff;
+}
+
+[data-theme="dark"] .prose .markdown-alert-note .markdown-alert-title svg {
+  fill: #58a6ff;
+}
+
+/* Tip Alert */
+.prose .markdown-alert-tip {
+  border-left-color: #1a7f37;
+  background: rgba(26, 127, 55, 0.1);
+}
+
+.prose .markdown-alert-tip .markdown-alert-title {
+  color: #1a7f37;
+}
+
+[data-theme="dark"] .prose .markdown-alert-tip {
+  background: rgba(26, 127, 55, 0.15);
+  border-left-color: #3fb950;
+}
+
+[data-theme="dark"] .prose .markdown-alert-tip .markdown-alert-title {
+  color: #3fb950;
+}
+
+[data-theme="dark"] .prose .markdown-alert-tip .markdown-alert-title svg {
+  fill: #3fb950;
+}
+
+/* Important Alert */
+.prose .markdown-alert-important {
+  border-left-color: #8250df;
+  background: rgba(130, 80, 223, 0.1);
+}
+
+.prose .markdown-alert-important .markdown-alert-title {
+  color: #8250df;
+}
+
+[data-theme="dark"] .prose .markdown-alert-important {
+  background: rgba(130, 80, 223, 0.15);
+  border-left-color: #a371f7;
+}
+
+[data-theme="dark"] .prose .markdown-alert-important .markdown-alert-title {
+  color: #a371f7;
+}
+
+[data-theme="dark"] .prose .markdown-alert-important .markdown-alert-title svg {
+  fill: #a371f7;
+}
+
+/* Warning Alert */
+.prose .markdown-alert-warning {
+  border-left-color: #9a6700;
+  background: rgba(154, 103, 0, 0.1);
+}
+
+.prose .markdown-alert-warning .markdown-alert-title {
+  color: #9a6700;
+}
+
+[data-theme="dark"] .prose .markdown-alert-warning {
+  background: rgba(154, 103, 0, 0.15);
+  border-left-color: #d29922;
+}
+
+[data-theme="dark"] .prose .markdown-alert-warning .markdown-alert-title {
+  color: #d29922;
+}
+
+[data-theme="dark"] .prose .markdown-alert-warning .markdown-alert-title svg {
+  fill: #d29922;
+}
+
+/* Caution Alert */
+.prose .markdown-alert-caution {
+  border-left-color: #cf222e;
+  background: rgba(207, 34, 46, 0.1);
+}
+
+.prose .markdown-alert-caution .markdown-alert-title {
+  color: #cf222e;
+}
+
+[data-theme="dark"] .prose .markdown-alert-caution {
+  background: rgba(207, 34, 46, 0.15);
+  border-left-color: #f85149;
+}
+
+[data-theme="dark"] .prose .markdown-alert-caution .markdown-alert-title {
+  color: #f85149;
+}
+
+[data-theme="dark"] .prose .markdown-alert-caution .markdown-alert-title svg {
+  fill: #f85149;
+}
+
+/* ===== Task Lists (Checkboxes) ===== */
+.prose ul.contains-task-list,
+.prose ol.contains-task-list {
+  list-style: none;
+  padding-left: 0;
+}
+
+.prose .task-list-item {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--spacing-sm);
+  margin-bottom: 0.5em;
+}
+
+.prose .task-list-item input[type="checkbox"] {
+  margin-top: 0.25em;
+  cursor: pointer;
+  width: 1em;
+  height: 1em;
+  flex-shrink: 0;
+  accent-color: var(--color-primary);
+}
+
+.prose .task-list-item input[type="checkbox"]:checked {
+  accent-color: var(--color-primary);
+}
+
+/* ===== Strikethrough ===== */
+.prose del,
+.prose s {
+  text-decoration: line-through;
+  text-decoration-color: var(--color-text-muted);
+  opacity: 0.7;
+}
+
+/* ===== Footnotes ===== */
+.prose section[data-footnotes],
+.prose .footnotes {
+  margin-top: 2em;
+  padding-top: var(--spacing-lg);
+  border-top: 1px solid var(--color-border);
+}
+
+.prose section[data-footnotes] h2,
+.prose .footnotes h2 {
+  font-size: 1rem;
+  font-weight: 600;
+  margin-bottom: var(--spacing-md);
+  color: var(--color-text-muted);
+}
+
+.prose section[data-footnotes] ol,
+.prose .footnotes ol {
+  padding-left: 1.5em;
+  font-size: 0.9375rem;
+  color: var(--color-text-muted);
+}
+
+.prose section[data-footnotes] li,
+.prose .footnotes li {
+  margin-bottom: var(--spacing-sm);
+}
+
+.prose .footnote-ref {
+  font-size: 0.875em;
+  vertical-align: super;
+  text-decoration: none;
+  color: var(--color-primary);
+  margin-left: 0.2em;
+}
+
+.prose .footnote-ref:hover {
+  text-decoration: underline;
+}
+
+.prose .footnote-backref {
+  text-decoration: none;
+  color: var(--color-primary);
+  margin-left: var(--spacing-xs);
+}
+
+.prose .footnote-backref:hover {
+  text-decoration: underline;
+}
+
 /* ===== Empty State ===== */
 .empty-message {
   text-align: center;