scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-27 01:25:52 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Hide Firefox focus ring

Browse source 
See this StackOverflow answer: https://stackoverflow.com/a/18853002/4633828

This isn't a perfect fix - we have to set `color` explicitly, rather
than use `inherit`, because we want the text color to be the same when
the select element is focused. That means both `color` and
`text-shadow`'s color have to be explicitly set to the same thing
(otherwise they might not match). Yay, hacks!
This commit is contained in:
Florrie 2018-01-05 13:37:04 -04:00
parent 870b916db3
commit ab107f865c
1 changed files with 6 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/forms/select.scss
View file

@ -12,6 +12,7 @@
border: 1px solid $active-gray;
border-radius: 5px;
background: $ui-light-gray url("../../../static/svgs/forms/carot.svg") no-repeat right center;
color: $type-gray;
padding-right: 4rem;
width: 100%;
height: 3rem;
@ -34,6 +35,11 @@
border: 1px solid $ui-blue;
}
&:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 $type-gray;
}
&:focus,
&:hover {
background: $ui-light-gray url("../../../static/svgs/forms/carot-hover.svg") no-repeat right center;