From 3ba52c8609439e7e0d95b492d057fddf3c6400ad Mon Sep 17 00:00:00 2001
From: rmroot <rootrm@ornl.gov>
Date: Thu, 10 Oct 2024 12:05:49 -0500
Subject: [PATCH] fix scrollbar always showing up bug

---
 .../setup-wizard-help-panel.component.css     |  2 +-
 .../setup-wizard-sidebar.component.css        |  2 +-
 src/styles.css                                | 34 ++++++++++++++-----
 3 files changed, 28 insertions(+), 10 deletions(-)

diff --git a/src/app/setup-wizard/setup-wizard-help-panel/setup-wizard-help-panel.component.css b/src/app/setup-wizard/setup-wizard-help-panel/setup-wizard-help-panel.component.css
index a92c1969..4907a9a0 100644
--- a/src/app/setup-wizard/setup-wizard-help-panel/setup-wizard-help-panel.component.css
+++ b/src/app/setup-wizard/setup-wizard-help-panel/setup-wizard-help-panel.component.css
@@ -1,7 +1,7 @@
 .navbar{
     width: 20rem;
     background-color: #ffffff;
-    overflow-y: scroll;
+    overflow-y: auto;
     /* height: 100%; */
     /* max-height: 100%; */
     flex-wrap: nowrap;
diff --git a/src/app/setup-wizard/setup-wizard-sidebar/setup-wizard-sidebar.component.css b/src/app/setup-wizard/setup-wizard-sidebar/setup-wizard-sidebar.component.css
index e60f6d12..9b2ffc03 100644
--- a/src/app/setup-wizard/setup-wizard-sidebar/setup-wizard-sidebar.component.css
+++ b/src/app/setup-wizard/setup-wizard-sidebar/setup-wizard-sidebar.component.css
@@ -1,7 +1,7 @@
 .navbar{
     width: 20rem;
     background-color: #ffffff;
-    overflow-y: scroll;
+    overflow-y: auto;
     /* height: 100%; */
     /* max-height: 100%; */
     flex-wrap: nowrap;
diff --git a/src/styles.css b/src/styles.css
index 6bf6d107..9fb01ac9 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -9,7 +9,7 @@
 
 
 
-.btn.btn-outline-neb{
+.btn.btn-outline-neb {
     font-weight: bolder;
     --bs-btn-color: var(--neb-color);
     --bs-btn-border-color: var(--neb-color);
@@ -27,7 +27,7 @@
     --bs-gradient: none;
 }
 
-.btn.btn-outline-metric{
+.btn.btn-outline-metric {
     font-weight: bolder;
     --bs-btn-color: var(--metric-color);
     --bs-btn-border-color: var(--metric-color);
@@ -45,7 +45,7 @@
     --bs-gradient: none;
 }
 
-.btn.btn-outline-energy-opp{
+.btn.btn-outline-energy-opp {
     font-weight: bolder;
     --bs-btn-color: var(--energy-opp-color);
     --bs-btn-border-color: var(--energy-opp-color);
@@ -66,7 +66,7 @@
 
 
 
-.neb-button{
+.neb-button {
     background-color: var(--neb-color);
 }
 
@@ -75,16 +75,34 @@
     cursor: pointer;
 }
 
-.overflow-scroll{
-    overflow-y: auto;
+.neb-container .overflow-scroll {
+    overflow-y: auto !important;
 }
 
-.bold{
+.neb-container ::-webkit-scrollbar {
+    -webkit-appearance: none;
+    width: 10px;
+    height: 10px;
+}
+
+.neb-container ::-webkit-scrollbar-thumb {
+    border-radius: 10px;
+    /*background-color: rgba(0, 0, 0, 0.3);*/
+    background-color: rgb(0 0 0 / 15%);
+    -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
+}
+
+.neb-container ::-webkit-scrollbar-button {
+    display:none;
+}
+
+
+.bold {
     font-weight: bold;
 }
 
 
-a.click-link:hover{
+a.click-link:hover {
     cursor: pointer;
 }