✨ markdown support for author notes

app.py

@@ -49,6 +49,17 @@ def format_comic_date(date_str):
         return date_str
 
 
+def get_author_note(date_str):
+    """Load author note from markdown file if it exists, using date as filename"""
+    note_path = os.path.join(os.path.dirname(__file__), 'content', 'author_notes', f'{date_str}.md')
+    try:
+        with open(note_path, 'r', encoding='utf-8') as f:
+            content = f.read()
+        return markdown.markdown(content)
+    except FileNotFoundError:
+        return None
+
+
 def enrich_comic(comic):
     """Add computed properties to comic data"""
     if comic is None:
@@ -57,6 +68,16 @@ def enrich_comic(comic):
     enriched['full_width'] = is_full_width(comic)
     enriched['plain'] = is_plain(comic)
     enriched['formatted_date'] = format_comic_date(comic['date'])
+
+    # Check for markdown author note, fall back to data field if not found
+    markdown_note = get_author_note(comic['date'])
+    if markdown_note:
+        enriched['author_note'] = markdown_note
+        enriched['author_note_is_html'] = True
+    else:
+        # No markdown file, use plain text from comic data if it exists
+        enriched['author_note_is_html'] = False
+
     return enriched
 
 

content/author_notes/2025-01-01.md

@@ -0,0 +1,7 @@
+This is where your comic journey begins!
+
+You can use **markdown** for author notes with support for:
+
+- **Bold** and *italic* text
+- [Links](https://example.com)
+- Lists and more!

static/css/style.css

@@ -324,6 +324,19 @@ main {
     font-size: 0.9rem;
 }
 
+.comic-transcript ul,
+.comic-transcript ol {
+    margin-left: 1.5rem;
+    margin-bottom: 1rem;
+    color: #000;
+    line-height: 1.6;
+    font-size: 0.9rem;
+}
+
+.comic-transcript li {
+    margin-bottom: 0.3rem;
+}
+
 /* Archive Content */
 .archive-content {
     margin-top: 1rem;

templates/comic.html

@@ -52,7 +52,11 @@
     {% if comic.author_note %}
     <div class="comic-transcript">
         <h3>Author Note</h3>
+        {% if comic.author_note_is_html == True %}
+        <div>{{ comic.author_note|safe }}</div>
+        {% else %}
         <p>{{ comic.author_note }}</p>
+        {% endif %}
     </div>
     {% endif %}
 </div>

templates/index.html

@@ -44,7 +44,11 @@
     {% if comic.author_note %}
     <div class="comic-transcript">
         <h3>Author Note</h3>
+        {% if comic.author_note_is_html == True %}
+        <div>{{ comic.author_note|safe }}</div>
+        {% else %}
         <p>{{ comic.author_note }}</p>
+        {% endif %}
     </div>
     {% endif %}
 </div>