Update nav.css

Author: weizhi-lin

assets/css/nav.css

@@ -58,8 +58,9 @@
     .topnav {
         flex-direction: column; /* Stacks items vertically */
         align-items: flex-start; /* Aligns items to the left */
-        padding: 0; /* Removes padding for a tighter fit */
-        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Adds a subtle shadow */
+        padding: 0; /* Removes all padding */
+        margin: 0; /* Removes all margin */
+        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Adds a shadow below the bar */
         width: 100%; /* Ensures full width */
     }
 
@@ -75,12 +76,13 @@
         font-size: 14px; /* Slightly smaller font size */
         background-color: #808080;
         color: #ffffff; /* White text for better contrast */
-        padding: 6px; /* Minimal padding for a thinner icon */
+        padding: 6px 10px; /* Minimal padding for a thinner icon */
+        margin: 0; /* Removes all margins */
         cursor: pointer;
-        margin: 0; /* Removes margin for alignment */
-        order: -1; /* Ensures the icon appears first in the flex container */
         border-radius: 0; /* Removes rounded edges */
         align-self: flex-start; /* Aligns the icon to the left */
+        width: 100%; /* Ensures full width for the icon */
+        box-sizing: border-box; /* Includes padding in width calculation */
     }
 
     .topnav a.normal {