Skip to content

Instantly share code, notes, and snippets.

@widoz
Last active February 29, 2020 12:47
Show Gist options
  • Save widoz/73df4f766789c9c4b1d1 to your computer and use it in GitHub Desktop.
Save widoz/73df4f766789c9c4b1d1 to your computer and use it in GitHub Desktop.
Wp Screen Reader Text Less Mixin
@mixin screen-reader-text {
& {
clip : rect(1px, 1px, 1px, 1px);
position : absolute !important;
height : 1px;
width : 1px;
overflow : hidden;
&:focus {
background-color : #F1F1F1;
border-radius : 3px;
box-shadow : 0 0 2px 2px rgba(0, 0, 0, 0.6);
clip : auto !important;
color : #21759B;
display : block;
font-size : 14px;
font-size : 0.875rem;
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. */
}
}
}
.screen-reader-text {
@include screen-reader-text;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment