From ba759b2821b527aef1adbf3be05db4c94509b07b Mon Sep 17 00:00:00 2001
From: Corban-Lee Jones <corbz.jones@gmail.com>
Date: Sat, 7 Sep 2024 21:15:53 +0100
Subject: [PATCH] sidebar less janky on smaller screens

---
 apps/templates/includes/navbar.html | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/apps/templates/includes/navbar.html b/apps/templates/includes/navbar.html
index 2740cfe..ee55a1b 100644
--- a/apps/templates/includes/navbar.html
+++ b/apps/templates/includes/navbar.html
@@ -16,15 +16,16 @@
                 </div>
                 <div class="offcanvas-body">
                     <ul class="navbar-nav justify-content-end flex-grow-1 pe-3 align-items-center">
-                        <li class="nav-item">
-                            <button type="button" id="themeToggle" class="me-3 btn btn-link p-0 text-body">
+                        <li class="nav-item w-lg-100 py-lg-0 py-3 px-lg-0 px-1">
+                            <button type="button" id="themeToggle" class="me-0 btn btn-link p-0 text-body text-decoration-none">
                                 <i class="bi bi-sun"></i>
+                                <span class="d-lg-none ms-2 text-body-secondary">Change Theme</span>
                             </button>
                         </li>
                         {% if request.user.is_authenticated %}
-                        <li class="nav-item">
+                        <li class="nav-item w-lg-100">
                             <div class="dropdown">
-                                <button type="button" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
+                                <button type="button" class="nav-link dropdown-toggle ms-lg-3" data-bs-toggle="dropdown">
                                     <img src="{{ request.user.avatar_url }}" alt="User Icon" width="30" class="rounded-circle me-2">
                                     <span>{{ request.user.global_name }}</span>
                                 </button>