datat.fi/_sass/basically-basic/utilities/_accessibility.scss

44 lines
1007 B
SCSS

/* ==========================================================================
Accessibility Modules
========================================================================== */
/* Text meant only for screen readers */
.screen-reader-text,
.screen-reader-text span,
.screen-reader-shortcut {
position: absolute !important;
width: 1px;
height: 1px;
clip: rect(0, 0, 0, 0);
border: 0;
overflow: hidden;
&:focus {
display: block;
top: 5px;
left: 5px;
width: auto;
height: auto;
padding: 0.75em 1em;
clip: auto !important;
border-radius: 0.125em;
background-color: $base-color;
color: #fff;
font-weight: bold;
line-height: normal;
text-decoration: none;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
z-index: 100000;
}
}
.screen-reader-text:focus,
.screen-reader-shortcut:focus {
width: auto;
height: auto;
clip: auto !important;
text-decoration: none;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
z-index: 100000;
}