Move to mixins in base-styles

WordPress · Feb 16, 2024 · 3f9c376 · 3f9c376
1 parent 17551da
commit 3f9c376
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 6 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/base-styles/_mixins.scss b/packages/base-styles/_mixins.scss
@@ -357,6 +357,15 @@
 	}
 }
 
+@mixin link-reset {
+	&:focus {
+		color: var(--wp-admin-theme-color--rgb);
+		/* stylelint-disable-next-line declaration-property-value-disallowed-list */
+		box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #007cba));
+		border-radius: $radius-block-ui;
+	}
+}
+
 // The editor input reset with increased specificity to avoid theme styles bleeding in.
 @mixin editor-input-reset() {
 	font-family: $editor-html-font !important;

diff --git a/packages/dataviews/package.json b/packages/dataviews/package.json
@@ -30,6 +30,7 @@
 		"@ariakit/react": "^0.3.12",
 		"@babel/runtime": "^7.16.0",
 		"@wordpress/a11y": "file:../a11y",
+		"@wordpress/base-styles": "file:../base-styles",
 		"@wordpress/components": "file:../components",
 		"@wordpress/compose": "file:../compose",
 		"@wordpress/element": "file:../element",

diff --git a/packages/dataviews/src/style.scss b/packages/dataviews/src/style.scss
@@ -1,3 +1,5 @@
+@import "../../base-styles/mixins";
+
 .dataviews-wrapper {
 	width: 100%;
 	height: 100%;
@@ -228,11 +230,7 @@
 		&:hover {
 			color: $gray-900;
 		}
-		&:focus {
-			color: var(--wp-admin-theme-color--rgb);
-			box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #007cba));
-			border-radius: $radius-block-ui;
-		}
+		@include link-reset();
 	}
 
 	button.components-button.is-link {