Use focus-visible

WordPress · Jan 23, 2024 · 2f5b1e9 · 2f5b1e9
1 parent 431e5cc
commit 2f5b1e9
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 3 deletions.
diff --git a/packages/edit-site/src/components/page-pages/style.scss b/packages/edit-site/src/components/page-pages/style.scss
@@ -37,7 +37,7 @@
 	width: 100%;
 	border-radius: 3px 3px 0 0;
 
-	&:focus {
+	&:focus-visible {
 		box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 		// Windows High Contrast mode will show this outline, but not the box-shadow.
 		outline: 2px solid transparent;

diff --git a/packages/edit-site/src/components/page-patterns/style.scss b/packages/edit-site/src/components/page-patterns/style.scss
@@ -253,7 +253,7 @@
 			height: 100%;
 			border-radius: 3px 3px 0 0;
 
-			&:focus {
+			&:focus-visible {
 				box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 				// Windows High Contrast mode will show this outline, but not the box-shadow.
 				outline: 2px solid transparent;

diff --git a/packages/edit-site/src/components/page-templates/style.scss b/packages/edit-site/src/components/page-templates/style.scss
@@ -15,7 +15,7 @@
 		height: 100%;
 		border-radius: 3px 3px 0 0;
 
-		&:focus {
+		&:focus-visible {
 			box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 			// Windows High Contrast mode will show this outline, but not the box-shadow.
 			outline: 2px solid transparent;