From 6dea184b0374b5429171e657623853c698329f10 Mon Sep 17 00:00:00 2001
From: Keavon Chambers <keavon@keavon.com>
Date: Tue, 23 Dec 2025 14:47:45 -0800
Subject: [PATCH] Update the color of scrollbars to match the latest design

---
 frontend/src/components/Editor.svelte         | 37 +------------------
 .../widgets/inputs/ScrollbarInput.svelte      |  2 +-
 2 files changed, 3 insertions(+), 36 deletions(-)

diff --git a/frontend/src/components/Editor.svelte b/frontend/src/components/Editor.svelte
index ecbd24b8..c6b64d24 100644
--- a/frontend/src/components/Editor.svelte
+++ b/frontend/src/components/Editor.svelte
@@ -261,42 +261,8 @@
 		.scrollable-x,
 		.scrollable-y {
 			overflow: hidden;
-
 			scrollbar-width: thin;
-			// Not supported in Safari
-			scrollbar-color: var(--color-5-dullgray) transparent;
-
-			// Safari (more capable, removed from recent versions of Chromium, possibly still supported in Safari but not tested)
-			&::-webkit-scrollbar {
-				width: calc(2px + 6px + 2px);
-				height: calc(2px + 6px + 2px);
-			}
-
-			&::-webkit-scrollbar-track {
-				box-shadow: inset 0 0 0 1px var(--color-5-dullgray);
-				border: 2px solid transparent;
-				border-radius: 10px;
-			}
-
-			&:hover::-webkit-scrollbar-track {
-				box-shadow: inset 0 0 0 1px var(--color-6-lowergray);
-			}
-
-			&::-webkit-scrollbar-thumb {
-				background-clip: padding-box;
-				background-color: var(--color-5-dullgray);
-				border: 2px solid transparent;
-				border-radius: 10px;
-				margin: 2px;
-			}
-
-			&:hover::-webkit-scrollbar-thumb {
-				background-color: var(--color-6-lowergray);
-			}
-
-			&::-webkit-scrollbar-corner {
-				background: none;
-			}
+			scrollbar-color: var(--color-4-dimgray) transparent;
 		}
 
 		.scrollable-x.scrollable-y {
@@ -304,6 +270,7 @@
 		}
 
 		.scrollable-x:not(.scrollable-y) {
+			scrollbar-width: none;
 			overflow: auto hidden;
 		}
 
diff --git a/frontend/src/components/widgets/inputs/ScrollbarInput.svelte b/frontend/src/components/widgets/inputs/ScrollbarInput.svelte
index 2f57b716..8347fa43 100644
--- a/frontend/src/components/widgets/inputs/ScrollbarInput.svelte
+++ b/frontend/src/components/widgets/inputs/ScrollbarInput.svelte
@@ -284,7 +284,7 @@
 			.scroll-thumb {
 				position: absolute;
 				border-radius: 4px;
-				background: var(--color-5-dullgray);
+				background: var(--color-4-dimgray);
 
 				&:hover,
 				&.dragging {