mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-08-03 21:21:14 -04:00
102 lines
1.6 KiB
SCSS
102 lines
1.6 KiB
SCSS
/* For image replacement */
|
|
.ir {
|
|
display: block;
|
|
text-indent: -999em;
|
|
overflow: hidden;
|
|
background-repeat: no-repeat;
|
|
text-align: left;
|
|
direction: ltr;
|
|
|
|
br {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
/* Hide for both screenreaders and browsers */
|
|
.hidden {
|
|
display: none;
|
|
visibility: hidden;
|
|
}
|
|
|
|
/* Hide only visually, but have it available for screenreaders */
|
|
.visually-hidden,
|
|
.visuallyhidden {
|
|
position: absolute;
|
|
left: -9999em;
|
|
|
|
/*
|
|
* Extends the .visuallyhidden class to allow the element to be
|
|
* focusable when navigated to via the keyboard
|
|
*/
|
|
&.focusable:active,
|
|
&.focusable:focus {
|
|
clip: auto;
|
|
height: auto;
|
|
margin: 0;
|
|
overflow: visible;
|
|
position: static;
|
|
width: auto;
|
|
}
|
|
}
|
|
|
|
/* Hide visually and from screenreaders, but maintain layout */
|
|
.invisible {
|
|
visibility: hidden;
|
|
}
|
|
|
|
/* Give a strong clear visual idea as to what is currently in focus */
|
|
a {
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
a:focus {
|
|
background-color: $focus-colour;
|
|
outline: 3px solid $focus-colour;
|
|
}
|
|
|
|
/* Make skiplinks visible when they are tabbed to */
|
|
|
|
.skiplink {
|
|
position: absolute;
|
|
left: -9999em;
|
|
}
|
|
|
|
.skiplink:focus {
|
|
position: static;
|
|
}
|
|
|
|
#skiplink-container {
|
|
text-align: center;
|
|
background: $black;
|
|
|
|
div {
|
|
text-align: left;
|
|
margin: 0 auto;
|
|
max-width: 1020px;
|
|
}
|
|
|
|
.skiplink {
|
|
@include inline-block;
|
|
margin: 0.75em 0 0 30px;
|
|
}
|
|
}
|
|
|
|
input:focus,
|
|
textarea:focus,
|
|
select:focus,
|
|
button:focus,
|
|
#global-header input:focus {
|
|
outline: 3px solid $focus-colour;
|
|
}
|
|
|
|
#global-header {
|
|
h1 a:focus {
|
|
background-color: transparent;
|
|
outline: none;
|
|
}
|
|
|
|
a:focus {
|
|
color: $black;
|
|
}
|
|
}
|