Files
notifications-admin/app/assets/stylesheets/govuk_template/_accessibility.scss
Rebecca Law 11d79951f3 Moved the templates into the app directory.
Added Manager to the app.py
2015-11-23 16:07:19 +00:00

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;
}
}