From cfb992bdca8730c7748dc0ee0c7a09577b65b479 Mon Sep 17 00:00:00 2001
From: Greg Shuflin <greg@everydayimshuflin.com>
Date: Sun, 16 Feb 2025 14:34:06 -0800
Subject: [PATCH] clear content button

---
 static/css/components/topbar.css | 17 +++++++++++++++++
 static/js/app.js                 | 11 +++++++++++
 templates/index.html.tera        |  3 +++
 3 files changed, 31 insertions(+)

diff --git a/static/css/components/topbar.css b/static/css/components/topbar.css
index deded8a..1b134ea 100644
--- a/static/css/components/topbar.css
+++ b/static/css/components/topbar.css
@@ -163,4 +163,21 @@
 
 .user-menu-item#logoutButton:hover {
     background-color: rgba(244, 63, 63, 0.1);
+}
+
+.clear-content-button {
+    background: none;
+    border: none;
+    color: var(--text-color);
+    padding: 8px;
+    cursor: pointer;
+    font-size: 1.1em;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: color 0.2s ease;
+}
+
+.clear-content-button:hover {
+    color: var(--primary-red);
 } 
diff --git a/static/js/app.js b/static/js/app.js
index 68354e6..4862c2b 100644
--- a/static/js/app.js
+++ b/static/js/app.js
@@ -5,6 +5,7 @@ document.addEventListener('DOMContentLoaded', function() {
     const sidebar = document.getElementById('sidebar');
     const userMenuButton = document.getElementById('userMenuButton');
     const userMenuDropdown = document.getElementById('userMenuDropdown');
+    const clearContentButton = document.getElementById('clearContentButton');
 
     // Create a hidden file input for OPML upload
     const opmlFileInput = document.createElement('input');
@@ -202,6 +203,16 @@ document.addEventListener('DOMContentLoaded', function() {
         }
     });
 
+    // Clear content button handler
+    clearContentButton.addEventListener('click', () => {
+        const mainContent = document.getElementById('main-content');
+        mainContent.innerHTML = '';
+        // Remove any active states from feed list
+        document.querySelectorAll('#feedList .feed-item.active').forEach(item => {
+            item.classList.remove('active');
+        });
+    });
+
     // Initialize feeds
     handleFeeds();
 });
diff --git a/templates/index.html.tera b/templates/index.html.tera
index 86ec415..1eb2297 100644
--- a/templates/index.html.tera
+++ b/templates/index.html.tera
@@ -70,6 +70,9 @@
                 <button class="add-feed-button" id="addFeedButton" title="Add Feed">
                     <i class="fas fa-plus"></i>
                 </button>
+                <button class="clear-content-button" id="clearContentButton" title="Clear Content">
+                    <i class="fas fa-broom"></i>
+                </button>
                 <div class="job-status" id="jobStatus" style="display: none">
                     <i class="fas fa-sync fa-spin"></i>
                     <span class="job-status-text"></span>