Tweak css

static/css/components/sidebar.css

@@ -16,7 +16,7 @@
     align-items: center;
 }
 
-.sidebar-add-feed {
+.add-feed-button {
     background: none;
     border: none;
     color: var(--text-muted);
@@ -26,7 +26,7 @@
     transition: color 0.2s ease;
 }
 
-.sidebar-add-feed:hover {
+.add-feed-button:hover {
     color: var(--primary-red);
 }
 
@@ -112,4 +112,4 @@
     margin-left: 8px;
     min-width: 20px;
     text-align: center;
-} 
+} 

static/css/components/topbar.css

@@ -3,8 +3,8 @@
     background-color: var(--topbar-bg);
     color: white;
     padding: 0.5rem 1rem;
-    display: grid;
-    grid-template-columns: 1fr auto 1fr;
+    display: flex;
+    justify-content: space-between;
     align-items: center;
     margin-bottom: 1rem;
 }

templates/index.html.tera

@@ -38,9 +38,6 @@
     <aside class="sidebar">
         <h2>
             Feeds
-            <button class="sidebar-add-feed" id="addFeedButton" title="Add Feed">
-                <i class="fas fa-plus"></i>
-            </button>
         </h2>
         <nav id="feedList">
         </nav>
@@ -48,6 +45,9 @@
     
     <div class="main-content-area">
         <header class="top-bar">
+            <button class="add-feed-button" id="addFeedButton" title="Add Feed">
+                <i class="fas fa-plus"></i>
+            </button>
             <h1 class="top-bar-title">RSS Reader</h1>
             <div class="user-menu">
                 <button class="user-menu-button" id="userMenuButton">