You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
matrix-spec/assets/css/fonts
Kévin Commaille 0ce83512fc
Update Inter font and set `display: swap` (#2000)
The version of Inter is updated to use a variable font, which is supported widely among modern browsers.

Using `display: swap` means that the browser will render the text of the spec even before Inter is loaded, making the website appear to load faster on mobile.

Allow the browser to use the local Inter font if it exists.
4 days ago
..
Inter.css Update Inter font and set `display: swap` (#2000) 4 days ago
README.md Update Inter font and set `display: swap` (#2000) 4 days ago
download_google_fonts_css.py Update Inter font and set `display: swap` (#2000) 4 days ago
requirements.txt Fix relative URLs when serving the specification with a custom `baseURL` (#1984) 1 week ago

README.md

Fonts

Inter.css

Inter.css is a local copy of https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,100..900&display=swap, modified to pull font files (.woff2) from local sources. It was created using download_google_fonts_css.py.

download_google_fonts_css.py

download_google_fonts_css.py is a script that takes a google fonts CSS URL, downloads the file and linked fonts, then saves the fonts locally along with a modified CSS file to load them. Example call:

python3 download_google_fonts_css.py \
  "https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,100..900&display=swap" \
  ../../../static/fonts \
  ../../fonts

Which would pop out a Inter.css file that should be @import url("Inter.css")d somewhere in the site's SCSS (currently in /assets/scss/_variables_project.scss).

Re-running the script and committing any new files is only necessary when a desired font updates (not very often), or we want to change the font we're using. In that case, remove the existing font files at /static/fonts/*.woff2 and re-run the script with a different URL.