changed accesibility class to mixin

seedlet/assets/sass/base/_accessibility.scss

@@ -1,5 +1,7 @@
-/* Text meant only for screen readers. */
-.screen-reader-text {
+@mixin screen-reader-text() {
+
+	/* Text meant only for screen readers. */
+
 	border: 0;
 	clip: rect(1px, 1px, 1px, 1px);
 	clip-path: inset(50%);
@@ -32,6 +34,10 @@
 	}
 }
 
+.screen-reader-text {
+	@include screen-reader-text();
+}
+
 /* Do not show the outline on the skip link target. */
 #content[tabindex="-1"]:focus {
 	outline: 0;

seedlet/style-rtl.css

@@ -967,8 +967,8 @@ a {
 	outline-color: var(--global--color-secondary);
 }
 
-/* Text meant only for screen readers. */
 .screen-reader-text {
+	/* Text meant only for screen readers. */
 	border: 0;
 	clip: rect(1px, 1px, 1px, 1px);
 	clip-path: inset(50%);

seedlet/style.css

@@ -967,8 +967,8 @@ a {
 	outline-color: var(--global--color-secondary);
 }
 
-/* Text meant only for screen readers. */
 .screen-reader-text {
+	/* Text meant only for screen readers. */
 	border: 0;
 	clip: rect(1px, 1px, 1px, 1px);
 	clip-path: inset(50%);

spearhead/assets/sass/_accesibility.scss

@@ -1,38 +0,0 @@
-/* Text meant only for screen readers. */
-.screen-reader-text {
-	border: 0;
-	clip: rect(1px, 1px, 1px, 1px);
-	clip-path: inset(50%);
-	height: 1px;
-	margin: -1px;
-	overflow: hidden;
-	padding: 0;
-	position: absolute !important;
-	width: 1px;
-	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
-
-	&:focus {
-		background-color: var(--global--color-background);
-		border-radius: 3px;
-		box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
-		clip: auto !important;
-		clip-path: none;
-		color: var(--global--color-foreground);
-		display: block;
-		font-size: var(--global--font-size-md);
-		font-weight: bold;
-		height: auto;
-		left: 5px;
-		line-height: normal;
-		padding: 15px 23px 14px;
-		text-decoration: none;
-		top: 5px;
-		width: auto;
-		z-index: 100000; /* Above WP toolbar. */
-	}
-}
-
-/* Do not show the outline on the skip link target. */
-#content[tabindex="-1"]:focus {
-	outline: 0;
-}

spearhead/assets/sass/style.scss

@@ -14,9 +14,9 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 */
 
 @import "../../../seedlet/assets/sass/abstracts/mixins";
+@import "../../../seedlet/assets/sass/base/accesibility";
 @import "breakpoints";
 @import "responsive";
-@import "accesibility";
 @import "posts-and-pages";
 @import "text";
 @import "header";