Bundle fonts with web assets

[zainab-ali]

The site displays text using the free fonts Adobe Source Serif Pro and Adobe Source Sans Pro. These are not distributed with the site. If a user doesn't have them installed on their PC, we use their defaults instead. This causes styling issues. We should bundle the fonts with the site assets such that all users see the correct fonts.

Potential Solution

The mill build must be adjusted to include bundling fonts. A task should be added under the web module to download and unzip the fonts from their GitHub releases:

• https://github.com/adobe-fonts/source-serif-pro/releases/download/3.001R/source-serif-pro-3.001R.zip
  • https://github.com/adobe-fonts/source-sans-pro/releases/tag/3.028R/source-sans-pro-3.028R.zip We should make sure the version string can be incremented easily (though not automatically). The fonts themselves are specified in the fonts.scss file. This should be amended to use @fontface to fetch the font.

Tests

Manual testing is satisfactory.

Prerequisites

• The basics of CSS and font families
• Enough familiarity with Scala to work with mill

  What you'll learn

  This is a great introduction to mill, outside of standard Scala projects

• How to create a mill target
• How to use @fontface to bundle fonts

  Getting started

  Read our Contributor Guide to get set up.

[mazhara]

I would like to take this one