From 98cdda266a0deb9d5fafe5abe156aa3e03a81567 Mon Sep 17 00:00:00 2001
From: Torsten Dittmann <torsten.dittmann@googlemail.com>
Date: Wed, 27 Sep 2023 02:44:00 +0200
Subject: [PATCH 1/3] fix: scrollbar

---
 src/lib/layouts/Sidebar.svelte        |  5 +----
 src/scss/7-components/_side-nav.scss  |  6 +++---
 src/scss/abstract/mixins/_scroll.scss | 12 +++++++++---
 3 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/src/lib/layouts/Sidebar.svelte b/src/lib/layouts/Sidebar.svelte
index a399e6f493..36c07fc280 100644
--- a/src/lib/layouts/Sidebar.svelte
+++ b/src/lib/layouts/Sidebar.svelte
@@ -33,10 +33,7 @@
 	}
 </script>
 
-<nav
-	class="aw-side-nav is-transparent"
-	class:is-transparent={$layoutState.currentVariant !== 'two-side-navs'}
->
+<nav class="aw-side-nav">
 	<div class="aw-side-nav-wrapper">
 		<button
 			class="aw-input-text aw-is-not-desktop"
diff --git a/src/scss/7-components/_side-nav.scss b/src/scss/7-components/_side-nav.scss
index 8dafa71120..1f94f346f3 100644
--- a/src/scss/7-components/_side-nav.scss
+++ b/src/scss/7-components/_side-nav.scss
@@ -18,14 +18,14 @@
 
 
   position:sticky; z-index:25; inset-block-start:pxToRem(74); inset-block-end:0;
-  block-size:calc(100vh - pxToRem(81));
+  block-size:calc(100vh - pxToRem(75));
   .#{$p}-icon-button { transition:var(--transition); margin-block-end:pxToRem(-4); margin-inline-end:pxToRem(6); }
 
 
 
   &-wrapper {
     display:flex; flex-direction:column; block-size:100%; gap:pxToRem(16);
-    padding:pxToRem(16); padding-block-end:pxToRem(32);
+    padding-inline:pxToRem(16);
     background-color:hsl(var(--p-side-nav-bg-color)); transition:var(--transition);
     
     &-parent {
@@ -39,7 +39,7 @@
     @include scroll(); overflow-y:auto; overflow-x:hidden;
     flex:1;
     display:flex; flex-direction:column; gap:pxToRem(24);
-    padding-inline:pxToRem(16); margin-inline:pxToRem(-16); 
+    padding:pxToRem(16); margin-inline:pxToRem(-16); 
 
     .#{$p}-is-only-mobile  & {
       border-block-start: 1px solid hsl(var(--aw-color-smooth));
diff --git a/src/scss/abstract/mixins/_scroll.scss b/src/scss/abstract/mixins/_scroll.scss
index 7db2b61521..1f3f3a5d19 100644
--- a/src/scss/abstract/mixins/_scroll.scss
+++ b/src/scss/abstract/mixins/_scroll.scss
@@ -2,7 +2,7 @@
 @use '../../abstract/variables/common' as *;
 @mixin scroll {
   &::-webkit-scrollbar {
-    opacity: 0.7;
+    opacity: 0.5;
     width: pxToRem(8);
     height: pxToRem(8);
   }
@@ -14,13 +14,19 @@
 
   &::-webkit-scrollbar-thumb {
     border-radius: pxToRem(4);
-    background: hsl(var(--aw-color-tertiary));
+    background-color: transparent;
   }
 
   &::-webkit-scrollbar-corner {
-    background: hsl(var(--aw-color-tertiary));
+    background-color: transparent;
     border-radius: pxToRem(6);
   }
+
+  &:hover {
+    &::-webkit-scrollbar-thumb, &::-webkit-scrollbar-corner {
+      background-color: hsl(var(--aw-color-border));
+    }
+  }
 }
 
 @mixin tableScroll {

From f6b8aeed43ee6c6557cbc780e23a866aab1268c5 Mon Sep 17 00:00:00 2001
From: Torsten Dittmann <torsten.dittmann@googlemail.com>
Date: Wed, 27 Sep 2023 02:48:38 +0200
Subject: [PATCH 2/3] fix: opacity

---
 src/scss/abstract/mixins/_scroll.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/scss/abstract/mixins/_scroll.scss b/src/scss/abstract/mixins/_scroll.scss
index 1f3f3a5d19..fc7aadcecf 100644
--- a/src/scss/abstract/mixins/_scroll.scss
+++ b/src/scss/abstract/mixins/_scroll.scss
@@ -2,7 +2,7 @@
 @use '../../abstract/variables/common' as *;
 @mixin scroll {
   &::-webkit-scrollbar {
-    opacity: 0.5;
+    opacity: 0.7;
     width: pxToRem(8);
     height: pxToRem(8);
   }

From 93c85153b6bfe342f728f4889f793d22cb722e37 Mon Sep 17 00:00:00 2001
From: Torsten Dittmann <torsten.dittmann@googlemail.com>
Date: Wed, 27 Sep 2023 03:12:04 +0200
Subject: [PATCH 3/3] fix: gradient

---
 src/scss/7-components/_side-nav.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/scss/7-components/_side-nav.scss b/src/scss/7-components/_side-nav.scss
index 1f94f346f3..3bf60ec707 100644
--- a/src/scss/7-components/_side-nav.scss
+++ b/src/scss/7-components/_side-nav.scss
@@ -17,7 +17,7 @@
   --p-side-nav-bg-color: var(--p-body-bg-color);
 
 
-  position:sticky; z-index:25; inset-block-start:pxToRem(74); inset-block-end:0;
+  position:sticky; z-index:35; inset-block-start:pxToRem(74); inset-block-end:0;
   block-size:calc(100vh - pxToRem(75));
   .#{$p}-icon-button { transition:var(--transition); margin-block-end:pxToRem(-4); margin-inline-end:pxToRem(6); }