studio/integration
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

gaufre: update font subset with new characters

Browse Source 
command used (assuming Marianne-Regular.woff2 is in website/public/fonts
dir, taken from the dsfr):

glyphhanger \
  --subset="./Marianne-Regular.woff2" \
  --formats=woff2 \
--whitelist="DémarchessimplifiéesFranceTransfertGristNotepaddel'ÉtatRDVServicePublicResanaTchapWebConférencedel'ÉtatWebinairedel'ÉtatFermer✕
"

we had feedback where text in the popup was rendered with completely
random characters… adding the unicode range should help?
This commit is contained in:
Emmanuel Pelletier
2024-06-21 14:19:40 +02:00
parent 7eb38d93f7
commit f29325a7f4
3 changed files with 7 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
website/public/fonts/Marianne-Regular-subset.woff2
View File

Binary file not shown.

5
website/public/fonts/readme.md
View File

@@ -10,4 +10,9 @@ glyphhanger \
--whitelist="DeskLaSuiteNumériqueMessagerieTchapResanaFranceTransfertContactsGristLePadWebConférencedel'ÉtatWebinaire  " --whitelist="DeskLaSuiteNumériqueMessagerieTchapResanaFranceTransfertContactsGristLePadWebConférencedel'ÉtatWebinaire  "
``` ```
## ⚠
Make sure to also update the `unicode-range` on the `@font-face` CSS rule. You can get it on the
glyphhanger command output.
Assuming you have the Marianne-Regular.woff2 file (you can take it from the DSFR). Assuming you have the Marianne-Regular.woff2 file (you can take it from the DSFR).

2
website/src/components/GaufrePage.astro
View File

@@ -22,6 +22,8 @@ const { services } = Astro.props
@font-face { @font-face {
font-family: "La Gaufre"; font-family: "La Gaufre";
src: url("/fonts/Marianne-Regular-subset.woff2") format("woff2"); src: url("/fonts/Marianne-Regular-subset.woff2") format("woff2");
unicode-range: U+20, U+27, U+43, U+44, U+46, U+47, U+4E, U+50, U+52-54, U+56, U+57,
U+61-66, U+68, U+69, U+6C-70, U+72-76, U+A0, U+C9, U+E9, U+2715;
font-weight: 400; font-weight: 400;
font-display: swap; font-display: swap;
} }