mirror of
https://github.com/alanorth/hugo-theme-bootstrap4-blog.git
synced 2025-05-08 05:26:00 +02:00
Use Font Awesome SVGs via JavaScript
This is a bit of "one step forward, two steps back" in that we are now using the much more lean SVG icons—and only the ones we are ac tually using—instead of having to download the two ~70KiB web font files, but it means we need to use JavaScript. This approache was inspired by the work @xekon did in #127. See: https://fontawesome.com/how-to-use/on-the-web/advanced/svg-javascript-core See: https://github.com/alanorth/hugo-theme-bootstrap4-blog/pull/127
This commit is contained in:
13
source/js/fontawesome.js
Normal file
13
source/js/fontawesome.js
Normal file
@ -0,0 +1,13 @@
|
||||
import { library, dom } from '@fortawesome/fontawesome-svg-core'
|
||||
import { faFolder, faTag } from '@fortawesome/free-solid-svg-icons'
|
||||
import { faFacebookF, faTwitter, faLinkedinIn } from '@fortawesome/free-brands-svg-icons'
|
||||
|
||||
// Add solid icons to our library
|
||||
library.add(faFolder, faTag)
|
||||
|
||||
// Add brand icons to our library
|
||||
library.add(faFacebookF, faTwitter, faLinkedinIn)
|
||||
|
||||
// Replace any existing <i> tags with <svg> and set up a MutationObserver to
|
||||
// continue doing this as the DOM changes.
|
||||
dom.watch()
|
Reference in New Issue
Block a user