Fix site title focus ring (#2704)

withastro · Dec 16, 2024 · fd16470 · fd16470
1 parent 02d16f3
commit fd16470
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/.changeset/wicked-insects-refuse.md b/.changeset/wicked-insects-refuse.md
@@ -0,0 +1,5 @@
+---
+'@astrojs/starlight': patch
+---
+
+Fixes display of focus indicator around site title
diff --git a/packages/starlight/components/Header.astro b/packages/starlight/components/Header.astro
@@ -41,7 +41,10 @@ const shouldRenderSearch =
 
 	.title-wrapper {
 		/* Prevent long titles overflowing and covering the search and menu buttons on narrow viewports. */
-		overflow: hidden;
+		overflow: clip;
+		/* Avoid clipping focus ring around link inside title wrapper. */
+		padding: 0.25rem;
+		margin: -0.25rem;
 	}
 
 	.right-group,