thegamer/Cable-Desktop
2
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Install flow accessibility tweaks

Browse source 
* Make everything bigger and bolder to account for inverse (light on
  dark) text.
* Give links better hover/focus state for the sake of tab navigation.

// FREEBIE
This commit is contained in:
lilia 2015-11-07 21:39:36 -08:00
parent 6fc4bada2e
commit 7105307dd9
2 changed files with 25 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
stylesheets/options.css
View file

@ -858,7 +858,9 @@ input, button, select, textarea {
p {
max-width: 30em;
margin: 1em auto;
line-height: 1.5em; }
line-height: 1.5em;
font-size: 1.2em;
font-weight: bold; }
a {
cursor: pointer; }
@ -896,10 +898,14 @@ a {
.nav .dot.selected {
background: #a2d2f4; }
.link:hover, .link:focus {
background: rgba(255, 255, 255, 0.3);
outline: none; }
.link, .link:visited, .link:hover {
padding: 0 3px;
color: white;
font-weight: bold;
border-bottom: dashed 1px white;
border-bottom: dashed 2px white;
text-decoration: none; }
.container {
@ -947,7 +953,9 @@ h3.step {
color: #454545;
background: white; }
#device-name:focus {
outline: white auto 5px; }
outline: none; }
#device-name:hover, #device-name:focus {
background: rgba(255, 255, 255, 0.3); }
#verifyCode,
#code,

16
stylesheets/options.scss
View file

@ -58,6 +58,8 @@ p {
max-width: 30em;
margin: 1em auto;
line-height: 1.5em;
font-size: 1.2em;
font-weight: bold;
}
a {
@ -107,10 +109,15 @@ a {
}
.link {
&:hover, &:focus {
background: rgba(255,255,255,0.3);
outline: none;
}
&, &:visited, &:hover {
padding: 0 3px;
color: white;
font-weight: bold;
border-bottom: dashed 1px white;
border-bottom: dashed 2px white;
text-decoration: none;
}
}
@ -174,8 +181,13 @@ h3.step {
}
&:focus {
outline: white auto 5px;
outline: none;
}
&:hover, &:focus {
background: rgba(255,255,255,0.3);
}
}
#verifyCode,