From 95b1029e50d87f549d96db5e933a6025fc1a9d3e Mon Sep 17 00:00:00 2001
From: jeremystretch <jstretch@ns1.com>
Date: Fri, 6 Aug 2021 11:05:27 -0400
Subject: [PATCH] Clean up nav menu spacing & link colors

---
 netbox/project-static/dist/netbox-dark.css    | Bin 806224 -> 806164 bytes
 netbox/project-static/dist/netbox-light.css   | Bin 501086 -> 501026 bytes
 netbox/project-static/styles/sidenav.scss     |  34 +++++++++---------
 netbox/project-static/styles/theme-base.scss  |   3 +-
 netbox/templates/inc/profile_button.html      |   6 ++--
 .../templates/navigation/nav_items.html       |   8 ++---
 6 files changed, 25 insertions(+), 26 deletions(-)

diff --git a/netbox/project-static/dist/netbox-dark.css b/netbox/project-static/dist/netbox-dark.css
index 6ef1beacb22b6cada9df3e09598e2ea8f122f80b..a598ddcdb6dc5ba7ec94fef6b9de5ef816517a8a 100644
GIT binary patch
delta 290
zcmcaG%W%pp!-f{d7N!>F7M2#)7Pc1l7LF~PZ?m?)&*EIes;iq`lwVq)n~|EBl3G+<
zkeHH^nU`**XJlHGnyX+4B&>52i_$ambW8FJtfmXjWEGiyU@oib^ne^r&gs&HoV?qY
z7I3mLii4Cxbs=k>{82=DdQ%pw)bs;FY+}<3Vp(~o_wQoWhUo7p;?$n*)yc^<eNHjw
zlj)4X9KzG>T3J;fvIUi#a?|g&af)w$RKod?WwO;{k?A)pIp<9m4rCRa{^2Dz*YvwV
zoE+2pt2p_lpReNdo<1>zO9D+|J5Yj+ku5PL$uuctdf;Df$@VYRoIuRA{Yy1>%tZh{
CnrV3e

delta 334
zcmbO-%kaW1!-f{d7N!>F7M2#)7Pc1l7LF~PZ?l-p%(uVI;#|Wzy|0jyYrAM6CmUnE
zk+HFviHU_-QEIM&o{=e(LKZcK2wUeS7NuwA>6YXdSm_xVn3zH!Py<XRDZiv7KNnpx
zEkCbBw>YyZ)k@DCWW04!eo;zl5y%|fqRi<IqHNsL4+yb|O)rRL<(=NYi&cC2{{l|V
z>HCT}wb}FXi*gflswbacWrz@EgNRPQ8pvrjt&o#rJ5Z@4<Kz`{R6uHYrhh2q)Sj-}
z4wUdM;e5aX^!9Y!O3qEwHx+Y=O#fHODK!0H5U0v?{z;sy+q<eb`5D>FQWGuGQl~G-
U<&<jQS<MN=T-$e6b4OnU0K5BgZvX%Q

diff --git a/netbox/project-static/dist/netbox-light.css b/netbox/project-static/dist/netbox-light.css
index cb8ad40a8d22991daf0c86c8ba636254e18474d8..0d946ac9b94853e2bb4709bd89d919d6dd777b01 100644
GIT binary patch
delta 250
zcmcb2N^a39xrP?T7N!>F7M3ln|MyPcy_K1BJJ&wem&|&)=|%aa1-coji7BZ?)dh(u
zDVcfcR(eLJMX9+8hCsqPH?b%^Gf%f9zradwdO<3)*!1TIS#OAg<e|!tRZo7%Cq4a>
z3$xU8g%W1==>dmXBd0qYVLc;k4K-UgCpE3aN)KfI^o7S*EvM^WVrAd%bCmTuGss<B
zlVdWuCO?p8nQnWMwPJd*C9~jkhij}{)A{q+Ii~+V$!b2mNQ_MaRqO(rS+cpQdCFuR
RdCB&7r&zbYJH=LT3jiqaUC00c

delta 288
zcmZ2<O77k%xrP?T7N!>F7M3ln|MxPPnQ#BUm-Q3#bjL%iXJU+ujm=C<EX;~ha~1TA
zOraFAs4+y?IybQ>Ju^?YB)`B)&&a^U6as-7U@}ShB_;W}NRrdn?`IX8zI+F>#B_xc
zX7=d`hgl;<^74yv6LYGQ^K<fxtdz}?%}vcyrk^^*sxy84VOB12h_qEkepzZ!b$&r&
za%M@Tm7WD$#kJ{yCs;M7?>ojSFx~eOE64VmM_8{h13fi;{R!3y(+}=pm6(3-HY@M+
rk5^e`rxzSyWtqPJB<mG+gA}vWv=r;<f?4bm?VC=qZr^l@t>6{_s;X<A

diff --git a/netbox/project-static/styles/sidenav.scss b/netbox/project-static/styles/sidenav.scss
index 0c7bbfb1e..25f9a886c 100644
--- a/netbox/project-static/styles/sidenav.scss
+++ b/netbox/project-static/styles/sidenav.scss
@@ -163,6 +163,12 @@
     }
   }
 
+  .nav-group-header {
+    padding: $sidenav-link-spacing-y / 2 $sidenav-link-spacing-x;
+    margin-top: 0.5rem;
+    margin-bottom: 0;
+  }
+
   // Child Link nav-item
   .nav .nav-item {
     display: flex;
@@ -178,25 +184,15 @@
 
   @include child-link() {
     width: 100%;
-    padding-top: $sidenav-link-spacing-y / 2.675;
+    padding-top: $sidenav-link-spacing-y / 2;
     padding-right: map.get($spacers, 1);
-    padding-bottom: $sidenav-link-spacing-y / 2.675;
-    /* stylelint-disable */
-    padding-left: $sidenav-link-spacing-x + $sidenav-icon-width + $sidenav-link-spacing-x / 4;
-    /* stylelint-enable */
-    margin-top: $sidenav-link-spacing-y / 3.3;
-    margin-bottom: $sidenav-link-spacing-y / 3.3;
-    font-size: $font-size-xs;
+    padding-bottom: $sidenav-link-spacing-y / 2;
+    padding-left: $sidenav-link-spacing-x;
+    margin-top: 0;
+    margin-bottom: 0;
     border-top-right-radius: $border-radius;
     border-bottom-right-radius: $border-radius;
 
-    .sidenav-normal {
-      color: $text-muted;
-      &:hover {
-        opacity: 0.8;
-      }
-    }
-
     .sidenav-mini-icon {
       width: $sidenav-link-spacing-x;
       text-align: center;
@@ -209,6 +205,7 @@
     height: 100%;
     font-weight: $font-weight-bold;
     color: var(--nbx-sidenav-parent-color);
+    padding-left: $sidenav-link-spacing-x / 2;
 
     &.active {
       color: $accordion-button-active-color;
@@ -273,7 +270,10 @@
 
         &.active {
           position: relative;
-          color: var(--nbx-sidebar-link-hover-bg);
+          background-color: var(--nbx-sidebar-link-hover-bg);
+        }
+
+        &:hover {
           background-color: var(--nbx-sidebar-link-hover-bg);
         }
 
@@ -290,7 +290,7 @@
       display: block;
       font-size: $font-size-xs;
       font-weight: $font-weight-bold;
-      color: $primary;
+      color: $secondary;
       text-transform: uppercase;
       white-space: nowrap;
     }
diff --git a/netbox/project-static/styles/theme-base.scss b/netbox/project-static/styles/theme-base.scss
index 9b7fa5c72..06e59355f 100644
--- a/netbox/project-static/styles/theme-base.scss
+++ b/netbox/project-static/styles/theme-base.scss
@@ -146,7 +146,6 @@ $transition-100ms-ease-in-out: all 0.1s ease-in-out;
 $sidenav-width-closed: 4rem;
 $sidenav-width-open: 16rem;
 $sidenav-icon-width: 2rem;
-$sidenav-link-px: 1rem;
 $sidenav-spacing-x: 1.5rem;
 $sidenav-link-spacing-x: 1rem;
-$sidenav-link-spacing-y: 0.675rem;
+$sidenav-link-spacing-y: 0.5rem;
diff --git a/netbox/templates/inc/profile_button.html b/netbox/templates/inc/profile_button.html
index bec87f271..0c66cc203 100644
--- a/netbox/templates/inc/profile_button.html
+++ b/netbox/templates/inc/profile_button.html
@@ -1,10 +1,10 @@
 {% if request.user.is_authenticated %}
-<span class="dropdown ms-0 ms-md-3 profile-button">
+<span class="dropdown profile-button">
   <button
     type="button"
     aria-expanded="false"
     data-bs-toggle="dropdown"
-    class="btn btn-outline-secondary dropdown-toggle"
+    class="btn btn-outline-secondary dropdown-toggle w-100"
   >
     <i class="mdi mdi-account"></i>
     <span id="navbar_user">{{ request.user|truncatechars:"30" }}</span>
@@ -37,7 +37,7 @@
   </ul>
 </span>
 {% else %}
-<div class="btn-group ms-0 ms-md-3">
+<div class="btn-group">
   <a
     class="btn btn-primary ws-nowrap"
     type="button"
diff --git a/netbox/utilities/templates/navigation/nav_items.html b/netbox/utilities/templates/navigation/nav_items.html
index d9aa63173..dfc85968a 100644
--- a/netbox/utilities/templates/navigation/nav_items.html
+++ b/netbox/utilities/templates/navigation/nav_items.html
@@ -13,8 +13,8 @@
                     {% for group in menu.groups %}
                         {# Within each main menu, there are groups of menu items #}
                             <li class="nav-item">
-                                <div class="nav-link">
-                                    {# Group Label #}
+                                {# Group Label #}
+                                <div class="nav-group-header">
                                     <span class="nav-group-label">{{ group.label }}</span>
                                 </div>
                             </li>
@@ -24,7 +24,7 @@
                             {% if request.user|has_perms:item.permissions %}
                             <li class="nav-item{% if not item.buttons %} no-buttons{% endif %}">
                                 <a href="{% url item.link %}" class="nav-link">
-                                    <span class="sidenav-normal">{{ item.link_text }}</span>
+                                    {{ item.link_text }}
                                 </a>
 
                                 {# Menu item buttons (if any) #}
@@ -45,7 +45,7 @@
                                 <li class="nav-item disabled">
                                     <a href="#" class="nav-link disabled" aria-disabled="true" disabled>
                                         <i class='mdi mdi-lock small'></i>
-                                        <span class="sidenav-normal">{{ item.link_text }}</span>
+                                        {{ item.link_text }}
                                     </a>
                                 </li>
                             {% endif %}