Use font-display: swap to ensure faster Web font display (#742)

See https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display
for more information.
This commit is contained in:
Hugo Locurcio 2019-06-26 21:25:07 +02:00 committed by Aaron Carlisle
parent 2a832aeb77
commit 020f5a4bd0
2 changed files with 8 additions and 1 deletions

View File

@ -4,6 +4,7 @@
src: url('../fonts/Lato/lato-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato/lato-regular.woff2') format('woff2'), url('../fonts/Lato/lato-regular.woff') format('woff'), url('../fonts/Lato/lato-regular.ttf') format('truetype')
font-weight: 400
font-style: normal
font-display: $font-display
@font-face
font-family: 'Lato'
@ -11,7 +12,7 @@
src: url('../fonts/Lato/lato-bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato/lato-bold.woff2') format('woff2'), url('../fonts/Lato/lato-bold.woff') format('woff'), url('../fonts/Lato/lato-bold.ttf') format('truetype')
font-weight: 700
font-style: normal
font-display: $font-display
@font-face
font-family: 'Lato'
@ -19,6 +20,7 @@
src: url('../fonts/Lato/lato-bolditalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato/lato-bolditalic.woff2') format('woff2'), url('../fonts/Lato/lato-bolditalic.woff') format('woff'), url('../fonts/Lato/lato-bolditalic.ttf') format('truetype')
font-weight: 700
font-style: italic
font-display: $font-display
@font-face
font-family: 'Lato'
@ -26,6 +28,7 @@
src: url('../fonts/Lato/lato-italic.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato/lato-italic.woff2') format('woff2'), url('../fonts/Lato/lato-italic.woff') format('woff'), url('../fonts/Lato/lato-italic.ttf') format('truetype')
font-weight: 400
font-style: italic
font-display: $font-display
@font-face
font-family: 'Roboto Slab'
@ -33,6 +36,7 @@
font-weight: 400
src: url('../fonts/RobotoSlab/roboto-slab.eot')
src: url('../fonts/RobotoSlab/roboto-slab-v7-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/RobotoSlab/roboto-slab-v7-regular.woff2') format('woff2'), url('../fonts/RobotoSlab/roboto-slab-v7-regular.woff') format('woff'), url('../fonts/RobotoSlab/roboto-slab-v7-regular.ttf') format('truetype')
font-display: $font-display
@font-face
font-family: 'Roboto Slab'
@ -40,3 +44,4 @@
font-weight: 700
src: url('../fonts/RobotoSlab/roboto-slab-v7-bold.eot')
src: url('../fonts/RobotoSlab/roboto-slab-v7-bold.eot?#iefix') format('embedded-opentype'), url('../fonts/RobotoSlab/roboto-slab-v7-bold.woff2') format('woff2'), url('../fonts/RobotoSlab/roboto-slab-v7-bold.woff') format('woff'), url('../fonts/RobotoSlab/roboto-slab-v7-bold.ttf') format('truetype')
font-display: $font-display

View File

@ -65,3 +65,5 @@ $base-font-family: "Lato", "proxima-nova", "Helvetica Neue",
$custom-font-family: "Roboto Slab", "ff-tisa-web-pro", "Georgia", Arial, sans-serif
$custom-font-family2: Georgia, serif
$code-font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", Courier, monospace
$font-display: swap