Misc cleanup & refactoring

netbox/project-static/styles/overrides/_tabler.scss

@@ -11,16 +11,38 @@ pre {
   color: inherit;
 }
 
-// Buttons
+// Slightly increase alert contrast between bg and text
+.alert {
+  background: var(--#{$prefix}bg-surface);
+}
+
+// Button adjustments
 .btn {
   // Tabler sets display: flex
   display: inline-block;
+
+  &:focus {
+    // Add button focus state
+    border: 1px solid var(--tblr-primary-fg);
+    outline: 2px solid var(--tblr-primary) !important;
+  }
 }
 .btn-sm {
   // $border-radius-sm (2px) is too small
   border-radius: $border-radius;
 }
 
+// Dropdown items
+.dropdown-item {
+  // Tabler sets display: flex
+  display: inline-block;
+}
+
+// Set footer icon color
+.footer .text-primary {
+  color: $rich-black !important;
+}
+
 // Tabs
 .nav-tabs {
   .nav-link {
@@ -29,15 +51,12 @@ pre {
   }
 }
 
-// Dropdown items
-.dropdown-item {
-  // Tabler sets display: flex
-  display: inline-block;
+// Altering background colors
+.page, .page-tabs .nav-tabs .nav-link.active {
+  background-color: var(--#{$prefix}bg-surface-tertiary) !important;
 }
-
-// Override background color alpha value
-[data-bs-theme=dark] ::selection {
-  background-color: rgba(var(--tblr-primary-rgb),.48);
+.page-body .card .card-header {
+  background: var(--tblr-bg-surface-secondary) !important;
 }
 
 // Dark mode colors
@@ -55,41 +74,12 @@ pre {
   }
 }
 
-// Slightly increase alert contrast between bg and text
-.alert {
-  background: var(--#{$prefix}bg-surface);
-}
-
-// Altering background colors
-.page, .page-tabs .nav-tabs .nav-link.active {
-  background-color: var(--#{$prefix}bg-surface-tertiary)!important;
-}
-.page-body .card .card-header {
-  background: var(--tblr-bg-surface-secondary)!important;
-}
-
-.footer .text-primary {
-  color: $rich-black!important;
-}
-
-// Add button focus state
-.btn:focus {
-  border: 1px solid var(--tblr-primary-fg);
-  outline: 2px solid var(--tblr-primary)!important;
-}
-
-// Fix secondary combo button contrast
-.btn-outline-secondary {
-  &.active {
-    color: var(--tblr-primary-fg);
-  }
-  &:hover {
-    color: var(--tblr-primary-fg);
-  }
-}
-
 // Dark mode overrides
 body[data-bs-theme=dark] {
+  // Override background color alpha value
+  ::selection {
+    background-color: rgba(var(--tblr-primary-rgb),.48);
+  }
 
   .btn-primary {
     color: $rich-black !important;

netbox/project-static/styles/transitional/_navigation.scss

@@ -94,6 +94,7 @@
 
 // Light theme styling
 body[data-bs-theme=light] .navbar-vertical.navbar-expand-lg {
+  // Background Gradient
   background: linear-gradient(180deg, rgba(0, 133, 125, 0.00) 0%, rgba(0, 133, 125, 0.10) 100%), #FFF;
 }
 

netbox/templates/base/layout.html

@@ -37,7 +37,7 @@ Blocks:
           <a href="{% url 'home' %}">
             <img src="{% static 'logo_netbox_dark_teal.svg' %}" alt="{% trans "NetBox Logo" %}" class="navbar-brand-image hide-theme-dark">
             <img src="{% static 'logo_netbox_bright_teal.svg' %}" alt="{% trans "NetBox Logo" %}" class="navbar-brand-image hide-theme-light">
-            <div class="netbox-edition fw-semibold text-center fs-5 mt-2">{{ settings.RELEASE.edition }}</div>
+            <div class="netbox-edition fw-semibold text-center fs-5 my-1">{{ settings.RELEASE.edition }}</div>
           </a>
         </h1>