From b8091f562908eaea6fe8385308348a542d2e872e Mon Sep 17 00:00:00 2001
From: Ugric <epicugric@gmail.com>
Date: Tue, 7 Apr 2026 14:55:44 +0100
Subject: [PATCH] fix navbar drop down going off the screen and move messages
 button to the drop down

---
 database/db_init.py    |  1 -
 static/styles.css      |  2 +-
 templates/navbar.jinja | 60 ++++++++++++++++++++----------------------
 3 files changed, 29 insertions(+), 34 deletions(-)

diff --git a/database/db_init.py b/database/db_init.py
index 1764976..c7b2acf 100644
--- a/database/db_init.py
+++ b/database/db_init.py
@@ -127,7 +127,6 @@ def init_database():
             photoid TEXT
         )
         """)
-    init_accounts_database()
     print("Database initialised.")
     seed_species()
 
diff --git a/static/styles.css b/static/styles.css
index 499ea75..e499668 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -544,7 +544,7 @@ input:focus {
   display: none;
   position: absolute;
   top: 100%;
-  left: 0;
+  right: 0;
   background-color: rgb(0, 0, 0);
   min-width: 160px;
   box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
diff --git a/templates/navbar.jinja b/templates/navbar.jinja
index a57665e..492d43b 100644
--- a/templates/navbar.jinja
+++ b/templates/navbar.jinja
@@ -24,11 +24,14 @@
         </div>
         <a href="/admin">Admin</a>
         {% endif %}
-        
-        <!-- Messages link with unread badge -->
-        <a href="/messages" class="messages-link" style="position: relative;">
-            Messages
-            <span id="unread-badge" style="
+
+        <a href="/about">About</a>
+
+        <div class="dropdown">
+            <a class="dropbtn">{{user["username"]}} ▾</a>
+            <div class="dropdown-content">
+                <a href="/messages">Messages
+                    <span id="unread-badge" style="
                 background: #e74c3c;
                 color: white;
                 border-radius: 10px;
@@ -36,14 +39,7 @@
                 font-size: 0.7rem;
                 margin-left: 5px;
                 display: none;
-            ">0</span>
-        </a>
-        
-        <a href="/about">About</a>
-        
-        <div class="dropdown">
-            <a class="dropbtn">{{user["username"]}} ▾</a>
-            <div class="dropdown-content">
+            ">0</span></a>
                 <a href="/dashboard">Dashboard</a>
                 <a href="/settings">Settings</a>
                 <a href="/logout">Logout</a>
@@ -57,24 +53,24 @@
 </div>
 
 <script>
-function updateUnreadCount() {
-    fetch('/messages/unread-count')
-        .then(response => response.json())
-        .then(data => {
-            const badge = document.getElementById('unread-badge');
-            if (data.count > 0) {
-                badge.textContent = data.count;
-                badge.style.display = 'inline-block';
-            } else {
-                badge.style.display = 'none';
-            }
-        })
-        .catch(error => console.error('Error fetching unread count:', error));
-}
+    function updateUnreadCount() {
+        fetch('/messages/unread-count')
+            .then(response => response.json())
+            .then(data => {
+                const badge = document.getElementById('unread-badge');
+                if (data.count > 0) {
+                    badge.textContent = data.count;
+                    badge.style.display = 'inline-block';
+                } else {
+                    badge.style.display = 'none';
+                }
+            })
+            .catch(error => console.error('Error fetching unread count:', error));
+    }
 
-// Update immediately on page load
-updateUnreadCount();
+    // Update immediately on page load
+    updateUnreadCount();
 
-// Then update every 30 seconds
-setInterval(updateUnreadCount, 30000);
-</script>
+    // Then update every 30 seconds
+    setInterval(updateUnreadCount, 30000);
+</script>
\ No newline at end of file