From 3bd4effd8fde31c17420481291457697e486e260 Mon Sep 17 00:00:00 2001
From: Greg Shuflin <greg@everydayimshuflin.com>
Date: Mon, 3 Feb 2025 00:59:46 -0800
Subject: [PATCH] semantic html

---
 templates/index.html.tera | 41 ++++++++++++++++++++-------------------
 1 file changed, 21 insertions(+), 20 deletions(-)
diff --git a/templates/index.html.tera b/templates/index.html.tera
index a762362..19a632f 100644
--- a/templates/index.html.tera
+++ b/templates/index.html.tera
@@ -7,21 +7,21 @@
     <link rel="stylesheet" href="/static/css/style.css">
 </head>
 <body class="with-sidebar">
-    <div class="top-bar">
-        <div class="top-bar-buttons">
+    <header class="top-bar">
+        <nav class="top-bar-buttons">
             <button class="add-feed-button" id="addFeedButton">Add Feed</button>
-        </div>
+        </nav>
         <h1 class="top-bar-title">RSS Reader</h1>
         <button class="logout-button" id="logoutButton">Logout</button>
-    </div>
+    </header>
 
     <!-- Add Feed Modal -->
-    <div class="modal" id="addFeedModal">
-        <div class="modal-content">
-            <div class="modal-header">
+    <dialog class="modal" id="addFeedModal">
+        <article class="modal-content">
+            <header class="modal-header">
                 <h2>Add RSS Feed</h2>
-            </div>
-            <div class="modal-body">
+            </header>
+            <section class="modal-body">
                 <form id="addFeedForm">
                     <div class="form-group">
                         <label for="feedUrl">Feed URL</label>
@@ -34,21 +34,22 @@
                         <div>Loading feed information...</div>
                     </div>
                 </form>
-            </div>
-            <div class="modal-footer">
+            </section>
+            <footer class="modal-footer">
                 <button type="button" class="btn-secondary" id="cancelAddFeed">Cancel</button>
                 <button type="button" class="btn-primary" id="confirmAddFeed">Add Feed</button>
-            </div>
-        </div>
-    </div>
+            </footer>
+        </article>
+    </dialog>
 
-    <div class="sidebar">
+    <aside class="sidebar">
         <h2>Feeds</h2>
-        <div id="feedList">
-        </div>
-    </div>
-    <div class="main-content">
-    </div>
+        <nav id="feedList">
+        </nav>
+    </aside>
+    
+    <main class="main-content">
+    </main>
 
     <script src="/static/js/app.js"></script>
 </body>
