mafoo.org.uk/selfdefined
1
0
Fork 0
mirror of https://github.com/fooflington/selfdefined.git synced 2025-01-22 17:30:00 +00:00
Code Issues Projects Releases Wiki Activity

🎨 Enhance :focus style for a11y

Browse Source 
* Adding link changes with text-decoration and background

* Update assets/css/base/_a.scss

Co-Authored-By: EJ Mason <eliasjmason@gmail.com>

* Add SCSS variable

Co-authored-by: Conlin Durbin <conlin@lessonly.com>
Co-authored-by: EJ Mason <eliasjmason@gmail.com>
Co-authored-by: Tatiana Mac <github@tatianamac.com>
This commit is contained in:
Conlin Durbin 2020-05-01 22:06:27 -04:00 committed by GitHub
parent 40fd302d4c
commit beb2f5db69
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 15 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.tool-versions Normal file
View File

@ -0,0 +1 @@
nodejs 12.16.1

2
assets/css/abstracts/_variables.scss
View File

@ -12,3 +12,5 @@ $light-grey: hsl(0, 0%, 93.3%); // for backgrounds only
$browser-context: 16; $browser-context: 16;
$lt-background-color: $pink;

12
assets/css/base/_a.scss
View File

@ -1,16 +1,18 @@
a { a {
border-bottom: $dark-grey solid 0.1em;
color: $black; color: $black;
font-family: $ext-sans; font-family: $ext-sans;
margin: 1rem 0; margin: 1rem 0;
text-decoration: none; text-decoration-color: $dark-grey;
text-decoration-line: underline;
text-decoration-thickness: 0.1em;
&:hover, &:hover,
&:focus { &:focus {
border-bottom: $primary-color solid 0.1rem; text-decoration-color: $primary-color;
} }
&:focus { &:focus {
outline: pxToRem(3) solid $primary-color; background-color: $lt-background-color;
outline-offset: pxToRem(5); color: $black;
outline: 0;
} }
} }

5
assets/css/structures/_grid.scss
View File

@ -64,5 +64,10 @@
a { a {
color: white; color: white;
&:focus {
background-color: $lt-background-color;
color: $black;
}
} }
} }