fix: load primary font in a non-blocking manner

[rupl]

Refs: CD-514

Types of changes

• ✔️ Improvement (non-breaking change which iterates on an existing feature)
• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Security update (dependency updates, or to fix a vulnerability)

Description

Adds the media="print" attribute to the primary Google Fonts entry to load them in a non-blocking manner. The attribute gets stripped when JS is enabled and the file has loaded. Non-JS browsers will fail to load this font file entirely.

I didn't touch the special fonts in our libraries definitions because the Arabic and Chinese fonts are more necessary to render text properly, so applying this JS-dependent optimization felt like a bad move. Happy to discuss if people disagree.

Steps to reproduce the problem or Steps to test

1. View source and see if the markup comes down the pipe with media="print" onload="..."
2. Inspect the same <link> element to see if the DOM got modified to remove media="print"

Impact

No impact. We already used display:swap on our fonts so the behavior is identical.

PR Checklist

• I have followed the Conventional Commits guidelines.