andre/30-seconds-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add focus-visible polyfill

Browse Source
This commit is contained in:
atomiks
2018-03-03 17:50:56 +10:00
parent 0059fa8110
commit 86c4bbd05d
4 changed files with 11 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
package-lock.json generated
View File

@ -3161,6 +3161,11 @@
"integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I=", "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I=",
"dev": true "dev": true
}, },
"focus-visible": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/focus-visible/-/focus-visible-4.1.0.tgz",
"integrity": "sha512-K+bqYCQOPs5qHFag28o36TyILpqx43Qlq8/YxWdXEOWy3LZmxk8P+dhI5oPzuC28nwwIcerRNwRNiT3Msk0MqA=="
},
"for-in": { "for-in": {
"version": "1.0.2", "version": "1.0.2",
"resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz", "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",

3
package.json
View File

@ -27,6 +27,7 @@
"prismjs": "^1.11.0" "prismjs": "^1.11.0"
}, },
"dependencies": { "dependencies": {
"feather-icons": "^4.7.0" "feather-icons": "^4.7.0",
"focus-visible": "^4.1.0"
} }
} }

6
src/css/components/tags.scss
View File

@ -15,7 +15,7 @@
text-transform: uppercase; text-transform: uppercase;
color: #8385aa; color: #8385aa;
white-space: nowrap; white-space: nowrap;
border: 1px solid lighten(#8385aa, 15); border: 1px solid #c8cbf2;
border-radius: 2px; border-radius: 2px;
vertical-align: middle; vertical-align: middle;
line-height: 2; line-height: 2;
@ -57,7 +57,7 @@
color: white; color: white;
} }
&:focus { &.focus-visible:focus {
box-shadow: 0 0 0 0.25rem transparentize(#8385aa, 0.5); box-shadow: 0 0 0 0.25rem transparentize(#8385aa, 0.5);
} }
@ -72,7 +72,7 @@
border-color: #7983ff; border-color: #7983ff;
color: white; color: white;
&:focus { &.focus-visible:focus {
box-shadow: 0 0 0 0.25rem transparentize(#7983ff, 0.5); box-shadow: 0 0 0 0.25rem transparentize(#7983ff, 0.5);
} }
} }

1
src/js/index.js
View File

@ -1,4 +1,5 @@
// Deps // Deps
import 'focus-visible'
import 'normalize.css' import 'normalize.css'
import 'prismjs' import 'prismjs'
import feather from 'feather-icons' import feather from 'feather-icons'