From 693cc27e451371b71ad855fe6493a9e019d10d01 Mon Sep 17 00:00:00 2001
From: Jeremy Stretch <jstretch@netboxlabs.com>
Date: Tue, 2 Jan 2024 15:26:32 -0500
Subject: [PATCH] Remove obsolete sidebar styling

---
 netbox/project-static/styles/netbox.scss  |   2 +-
 netbox/project-static/styles/sidenav.scss | 450 ----------------------
 2 files changed, 1 insertion(+), 451 deletions(-)
 delete mode 100644 netbox/project-static/styles/sidenav.scss

diff --git a/netbox/project-static/styles/netbox.scss b/netbox/project-static/styles/netbox.scss
index 74a227c77..8d0192593 100644
--- a/netbox/project-static/styles/netbox.scss
+++ b/netbox/project-static/styles/netbox.scss
@@ -2,7 +2,7 @@
 
 @use 'sass:map';
 @use 'sass:math';
-@import './sidenav';
+//@import './sidenav';
 @import './overrides';
 @import './utilities';
 @import './variables';
diff --git a/netbox/project-static/styles/sidenav.scss b/netbox/project-static/styles/sidenav.scss
deleted file mode 100644
index 3e2a53ef9..000000000
--- a/netbox/project-static/styles/sidenav.scss
+++ /dev/null
@@ -1,450 +0,0 @@
-@use 'sass:map';
-@use 'sass:math';
-
-@mixin parent-link {
-  .navbar-nav .nav-item .nav-link[data-bs-toggle] {
-    @content;
-  }
-}
-
-@mixin child-link {
-  .collapse .nav .nav-item .nav-link {
-    @content;
-  }
-}
-
-@mixin sidenav-open {
-  body[data-sidenav-show],
-  body[data-sidenav-pinned] {
-    .sidenav {
-      @content;
-    }
-  }
-}
-
-@mixin sidenav-closed {
-  body[data-sidenav-hide],
-  body[data-sidenav-hidden] {
-    .sidenav {
-      @content;
-    }
-  }
-}
-
-@mixin sidenav-pinned {
-  body[data-sidenav-pinned] {
-    .sidenav {
-      @content;
-    }
-  }
-}
-
-@mixin sidenav-show {
-  body[data-sidenav-show] {
-    .sidenav {
-      @content;
-    }
-  }
-}
-
-@mixin sidenav-hide {
-  body[data-sidenav-hide] {
-    .sidenav {
-      @content;
-    }
-  }
-}
-
-@mixin sidenav-peek {
-  .g-sidenav-show:not(.g-sidenav-pinned) {
-    .sidenav {
-      @content;
-    }
-  }
-}
-
-.sidenav {
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  z-index: 1050;
-  display: block;
-  width: 100%;
-  max-width: $sidenav-width-closed;
-  padding-top: 0;
-  padding-right: 0;
-  padding-left: 0;
-  background-color: var(--nbx-sidebar-bg);
-  border-right: 1px solid $border-color;
-  transition: $transition-100ms-ease-in-out;
-
-  // Media fixes for mobile resolutions.
-  @include media-breakpoint-down(lg) {
-    transform: translateX(-$sidenav-width-closed);
-
-    + .content-container[class] {
-      margin-left: 0;
-    }
-
-    .profile-button-container[class] {
-      display: block;
-    }
-  }
-
-  .profile-button-container {
-    display: none;
-    padding: $sidenav-link-spacing-y $sidenav-link-spacing-x;
-  }
-
-  + .content-container {
-    margin-left: $sidenav-width-closed;
-    transition: $transition-100ms-ease-in-out;
-  }
-
-  // Navbar brand
-  .sidenav-brand {
-    margin-right: 0;
-    transition: opacity 0.1s ease-in-out;
-  }
-
-  .sidenav-brand-icon {
-    transition: opacity 0.1s ease-in-out;
-  }
-
-  .sidenav-inner {
-    padding-right: $sidenav-spacing-x;
-    padding-left: $sidenav-spacing-x;
-    @include media-breakpoint-up(md) {
-      padding-right: 0;
-      padding-left: 0;
-    }
-  }
-
-  .sidenav-brand-img,
-  .sidenav-brand > img {
-    max-width: 100%;
-    max-height: calc(#{$sidenav-width-open} - 1rem);
-  }
-
-  .navbar-heading {
-    padding-top: $nav-link-padding-y;
-    padding-bottom: $nav-link-padding-y;
-    font-size: $font-size-xs;
-    text-transform: uppercase;
-    letter-spacing: 0.04em;
-  }
-
-  .sidenav-header {
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    height: 78px;
-    padding: $spacer;
-    transition: $transition-100ms-ease-in-out;
-  }
-
-  .sidenav-toggle {
-    // The sidenav toggle's default state is "hidden". Because modifying the `display` property
-    // isn't ideal for smooth transitions, combine opacity 0 (transparent) and position absolute
-    // to yield a similar result.
-    position: absolute;
-    display: inline-block;
-    opacity: 0;
-    // The transition itself is largely irrelevant, but CSS needs *something* to transition in
-    // order to apply a delay.
-    transition: opacity 10ms ease-in-out;
-    // Offset the transition delay so the icon isn't visible during the logo transition.
-    transition-delay: 0.1s;
-  }
-
-  .sidenav-collapse {
-    display: flex;
-    flex: 1;
-    flex-direction: column;
-    align-items: stretch;
-    padding-right: $sidenav-spacing-x;
-    padding-left: $sidenav-spacing-x;
-    margin-right: -$sidenav-spacing-x;
-    margin-left: -$sidenav-spacing-x;
-
-    > * {
-      min-width: 100%;
-    }
-
-    @include media-breakpoint-up(md) {
-      margin-right: 0;
-      margin-left: 0;
-    }
-  }
-
-  .nav-group-header {
-    padding: math.div($sidenav-link-spacing-y, 2) $sidenav-link-spacing-x;
-    margin-top: 0.5rem;
-    margin-bottom: 0;
-  }
-
-  .nav {
-    margin-bottom: 0.5rem;
-  }
-
-  // Child Link nav-item
-  .nav .nav-item {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    width: 100%;
-
-    &.no-buttons {
-      padding-right: 0.5rem;
-    }
-  }
-
-  @include child-link() {
-    width: 100%;
-    padding-top: math.div($sidenav-link-spacing-y, 2);
-    padding-right: map.get($spacers, 1);
-    padding-bottom: math.div($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-mini-icon {
-      width: $sidenav-link-spacing-x;
-      text-align: center;
-      transition: $transition-100ms-ease-in-out;
-    }
-  }
-
-  @include parent-link() {
-    width: unset;
-    height: 100%;
-    padding-left: math.div($sidenav-link-spacing-x, 2);
-    font-weight: $font-weight-bold;
-    color: var(--nbx-sidenav-parent-color);
-
-    &:after {
-      display: inline-block;
-      margin-left: auto;
-      /* stylelint-disable */
-      font-family: 'Material Design Icons';
-      /* stylelint-enable */
-      font-style: normal;
-      font-weight: 700;
-      font-variant: normal;
-      color: $text-muted;
-      text-rendering: auto;
-      -webkit-font-smoothing: antialiased;
-      content: '\f0142';
-      transition: $transition-100ms-ease-in-out;
-    }
-
-    // Expanded
-    &[aria-expanded='true'] {
-      &.active:after {
-        color: $accordion-button-active-color;
-      }
-      &:after {
-        color: $primary;
-        transform: rotate(90deg);
-      }
-    }
-
-    .nav-link-text {
-      padding-left: 0.25rem;
-      transition: $transition-100ms-ease-in-out;
-    }
-  }
-
-  .navbar-nav {
-    flex-direction: column;
-    margin-right: -$sidenav-spacing-x;
-    margin-left: -$sidenav-spacing-x;
-
-    .nav-item {
-
-      &.disabled {
-        cursor: not-allowed;
-        opacity: 0.8;
-      }
-
-      // All Links
-      .nav-link {
-        position: relative;
-        display: flex;
-        align-items: center;
-        width: 100%;
-        padding: $sidenav-link-spacing-y $sidenav-link-spacing-x;
-        font-size: $font-size-sm;
-        color: var(--nbx-sidenav-link-color);
-        white-space: nowrap;
-        transition-duration: 0ms;
-
-        &.active {
-          background-color: var(--nbx-sidebar-link-active-bg);
-        }
-
-        &:hover:not(.active) {
-          color: var(--nbx-body-color);
-          background-color: var(--nbx-sidebar-link-hover-bg);
-        }
-
-        // Icon
-        > i {
-          min-width: $sidenav-icon-width;
-          font-size: calc(45px / 2);
-          text-align: center;
-        }
-      }
-    }
-
-    .nav-group-label {
-      display: block;
-      font-size: $font-size-xs;
-      font-weight: $font-weight-bold;
-      // color: $secondary;
-      color: var(--nbx-sidenav-group-color);
-      text-transform: uppercase;
-      white-space: nowrap;
-    }
-  }
-}
-
-@include sidenav-pinned() {
-  .sidenav-toggle-icon {
-    color: var(--nbx-sidenav-pin-color);
-    transform: rotate(90deg);
-  }
-  @include media-breakpoint-up(xl) {
-    + .content-container {
-      margin-left: $sidenav-width-open;
-    }
-  }
-}
-
-@include sidenav-peek() {
-  .sidenav-toggle-icon {
-    transform: rotate(0deg);
-  }
-}
-
-@include sidenav-open() {
-  max-width: $sidenav-width-open;
-
-  .sidenav-brand,
-  .navbar-heading {
-    display: block;
-  }
-
-  .sidenav-brand {
-    opacity: 1;
-    transform: translateX(0);
-  }
-
-  .sidenav-brand-icon {
-    position: absolute;
-    opacity: 0;
-  }
-
-  @include media-breakpoint-down(lg) {
-    transform: translateX(0);
-  }
-}
-
-@include sidenav-closed() {
-  .sidenav-header {
-    padding: $spacer * 0.5;
-  }
-
-  .sidenav-brand {
-    position: absolute;
-    opacity: 0;
-  }
-
-  .sidenav-brand-icon {
-    opacity: 1;
-  }
-
-  .sidenav-toggle {
-    // Immediately hide the toggle when the sidenav is closed, so it doesn't linger and overlap
-    // with the logo elements.
-    opacity: 0;
-    position: absolute;
-    transition: unset;
-    transition-delay: 0ms;
-  }
-
-  .navbar-nav > .nav-item {
-    > .nav-link {
-      &:after {
-        content: '';
-      }
-    }
-  }
-
-  .nav-item .collapse {
-    display: none;
-  }
-
-  .nav-link-text {
-    opacity: 0;
-  }
-
-  @include parent-link() {
-    &.active {
-      margin-right: 0;
-      margin-left: 0;
-      border-radius: unset;
-    }
-  }
-}
-
-@include sidenav-show() {
-  .sidenav-brand {
-    display: block;
-  }
-
-  .nav-item .collapse {
-    height: auto;
-    transition: $transition-100ms-ease-in-out;
-  }
-
-  .nav-item .nav-link .nav-link-text {
-    opacity: 1;
-  }
-
-  .nav-item .sidenav-mini-icon {
-    opacity: 0;
-  }
-
-  @include media-breakpoint-up(lg) {
-    .sidenav-toggle {
-      position: relative;
-      opacity: 1;
-    }
-  }
-}
-
-.simplebar-track.simplebar-vertical {
-  right: 0;
-  width: 6px;
-  background-color: transparent;
-
-  .simplebar-scrollbar {
-    transition: none;
-
-    &:before {
-      right: 0;
-      width: 3px;
-      background: var(--nbx-sidebar-scroll);
-      border-radius: $border-radius;
-    }
-  }
-
-  &.simplebar-hover .simplebar-scrollbar:before {
-    width: 5px;
-  }
-}