Use semantic color name instead of absolute color name (#2792)

Co-authored-by: Chris Swithinbank <[email protected]>
withastro · Jan 13, 2025 · 412effb · 412effb
1 parent d9d415b
commit 412effb
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/.changeset/grumpy-terms-accept.md b/.changeset/grumpy-terms-accept.md
@@ -0,0 +1,5 @@
+---
+"@astrojs/starlight": patch
+---
+
+Uses semantic `var(--sl-color-hairline)` for the page sidebar border instead of `var(--sl-color-gray-6)`. This is visually the same as previously but makes it easier to override the hairline color consistently across a site.
diff --git a/packages/starlight/components/TwoColumnContent.astro b/packages/starlight/components/TwoColumnContent.astro
@@ -32,7 +32,7 @@ import type { Props } from '../props';
 		.right-sidebar {
 			position: fixed;
 			top: 0;
-			border-inline-start: 1px solid var(--sl-color-gray-6);
+			border-inline-start: 1px solid var(--sl-color-hairline);
 			padding-top: var(--sl-nav-height);
 			width: 100%;
 			height: 100vh;