From 705929ee47023b0565a4b3af1921d2d5e9b4e4bd Mon Sep 17 00:00:00 2001
From: Greg Shuflin <greg@everydayimshuflin.com>
Date: Wed, 5 Feb 2025 04:19:47 -0800
Subject: [PATCH] More layout tweaks

---
 static/css/components/layout.css | 13 +++++++++----
 static/css/components/topbar.css |  1 -
 static/css/style.css             | 12 ------------
 static/js/app.js                 |  6 +++---
 templates/index.html.tera        |  6 +++---
 5 files changed, 15 insertions(+), 23 deletions(-)

diff --git a/static/css/components/layout.css b/static/css/components/layout.css
index 8238fa6..925fad6 100644
--- a/static/css/components/layout.css
+++ b/static/css/components/layout.css
@@ -11,18 +11,23 @@ body.with-sidebar {
     display: flex;
 }
 
-.main-content {
+.main-content-area {
     flex: 1;
-    padding: 20px 40px;
+    min-width: 0; /* Prevents flex item from overflowing */
 }
 
-.main-content h1 {
+#main-content {
+    flex: 1;
+    padding: 1rem;
+}
+
+#main-content h1 {
     color: var(--primary-red);
     font-size: 2.5em;
     margin-bottom: 0.5em;
 }
 
-.main-content p {
+#main-content p {
     line-height: 1.6;
     color: var(--text-muted);
     margin-bottom: 1.5em;
diff --git a/static/css/components/topbar.css b/static/css/components/topbar.css
index ac58dd1..49c7e90 100644
--- a/static/css/components/topbar.css
+++ b/static/css/components/topbar.css
@@ -7,7 +7,6 @@
     grid-template-columns: 1fr auto 1fr;
     align-items: center;
     margin-bottom: 1rem;
-    border-radius: 8px;
 }
 
 .top-bar-title {
diff --git a/static/css/style.css b/static/css/style.css
index 949a1bb..98c12e3 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -15,18 +15,6 @@ body {
     color: var(--text-color);
 }
 
-.main-content h1 {
-    color: var(--primary-red);
-    font-size: 2.5em;
-    margin-bottom: 0.5em;
-}
-
-.main-content p {
-    line-height: 1.6;
-    color: var(--text-muted);
-    margin-bottom: 1.5em;
-}
-
 .login-container {
     display: flex;
     justify-content: center;
diff --git a/static/js/app.js b/static/js/app.js
index e24a025..5aedfa9 100644
--- a/static/js/app.js
+++ b/static/js/app.js
@@ -36,8 +36,8 @@ function formatDate(dateStr) {
 }
 
 function renderFeedEntries(entries) {
-    const feedContent = document.querySelector('#feed-content');
-    feedContent.innerHTML = '';
+    const mainContent = document.querySelector('#main-content');
+    mainContent.innerHTML = '';
 
     entries.forEach(entry => {
         const entryDiv = document.createElement('article');
@@ -135,7 +135,7 @@ function renderFeedEntries(entries) {
         entryDiv.appendChild(title);
         entryDiv.appendChild(meta);
         entryDiv.appendChild(summary);
-        feedContent.appendChild(entryDiv);
+        mainContent.appendChild(entryDiv);
     });
 }
 
diff --git a/templates/index.html.tera b/templates/index.html.tera
index d0f7d57..536d88b 100644
--- a/templates/index.html.tera
+++ b/templates/index.html.tera
@@ -46,7 +46,7 @@
         </nav>
     </aside>
     
-    <main class="main-content">
+    <div class="main-content-area">
         <header class="top-bar">
             <h1 class="top-bar-title">RSS Reader</h1>
             <div class="user-menu">
@@ -58,8 +58,8 @@
                 </div>
             </div>
         </header>
-        <div id="feed-content"></div>
-    </main>
+        <main id="main-content"></main>
+    </div>
 
     <script src="/static/js/app.js"></script>
 </body>