Fix REPL colors

lukastaegert · lukastaegert · commit 5368e8065aae · 2023-02-03T15:48:13.000+01:00
diff --git a/docs/.vitepress/theme/custom.css b/docs/.vitepress/theme/custom.css
@@ -23,6 +23,12 @@
     hsl(358 58% 47% / 80%)
   );
   --vp-home-hero-image-filter: blur(40px);
+
+  --vp-c-gray-light-3: #d1d1d1;
+  --vp-c-gray-light-5: #f2f2f2;
+  --vp-c-gray-dark-2: #484848;
+  --vp-c-gray-dark-3: #3a3a3a;
+
 }
 
 @media (min-width: 640px) {
diff --git a/docs/repl/components/BundleOptions.vue b/docs/repl/components/BundleOptions.vue
@@ -81,7 +81,7 @@ const getLinkForOption = (option: string) =>
 	--bg-inactive: var(--vp-c-gray-light-3);
 	--bg-active: var(--vp-c-bg);
 	--bg-default: var(--vp-c-gray-light-5);
-	border: 1px solid var(--vp-c-divider-light);
+	border: 1px solid var(--vp-c-divider);
 	line-height: 2rem;
 	background-color: var(--bg-default);
 	border-radius: 8px;
@@ -90,7 +90,6 @@ const getLinkForOption = (option: string) =>
 .dark .options {
 	--bg-inactive: var(--vp-c-gray-dark-3);
 	--bg-default: var(--vp-c-bg);
-	background-color: var(--bg-default);
 }
 
 h3 {
diff --git a/docs/repl/helpers/editor.ts b/docs/repl/helpers/editor.ts
@@ -66,7 +66,7 @@ const theme = EditorView.baseTheme({
 		backgroundColor: 'var(--vp-code-block-bg)',
 		border: 'none',
 		borderBottomLeftRadius: '8px',
-		borderRight: '1px solid var(--vp-c-divider-dark-2)',
+		borderRight: '1px solid var(--vp-code-block-divider-color)',
 		borderTopLeftRadius: '8px',
 		color: 'var(--vp-code-line-number-color)',
 		minWidth: '32px'
