From 935f915cb58de7f2ac6c45a6d602fd928327e800 Mon Sep 17 00:00:00 2001
From: Joshua T Flowers <joshuatf@gmail.com>
Date: Fri, 10 Jun 2022 12:24:02 -0400
Subject: [PATCH] Update scrollbar hover styles in new navigation (#33313)

* Update scrollbar hover styles in new navigation

* Update contrast ratio

* Add Firefox scrollbar properties

* Fix scrollbar-color and scrollbar-width values

Co-authored-by: Matt Sherman <matt@jam123.com>
---
 .../client/navigation/style.scss              | 23 +++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/plugins/woocommerce-admin/client/navigation/style.scss b/plugins/woocommerce-admin/client/navigation/style.scss
index d652d0368be..3a87239a005 100644
--- a/plugins/woocommerce-admin/client/navigation/style.scss
+++ b/plugins/woocommerce-admin/client/navigation/style.scss
@@ -21,6 +21,29 @@
 	.components-navigation__menu-title {
 		overflow: visible;
 	}
+
+	.components-navigation__menu {
+		scrollbar-color: $gray-700 $gray-900;
+		scrollbar-width: thin;
+
+		&::-webkit-scrollbar-thumb {
+			border-radius: 10px;
+			background-color: $gray-700;
+		}
+
+
+		&::-webkit-scrollbar-thumb:hover {
+			background-color: $gray-700;
+			width: 8px;
+			height: 8px;
+		}
+
+
+		&::-webkit-scrollbar {
+			width: 8px;
+			height: 8px;
+		}
+	}
 }
 
 .woocommerce-navigation__wrapper {