Skip to content

Conversation

@Jeremy-Walton
Copy link
Member

Why?

According to recommendations here https://developers.google.com/fonts/docs/material_symbols#optimize_the_icon_font we should be using the display block option to prevent the icon text from rendering during load. See https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for details on what this setting actually does.

What Changed

  • Add &display=block to icon font import

Sanity Check

  • [ ] Have you updated any usage of changed tokens?
  • [ ] Have you updated the docs with any component changes?
  • [ ] Have you updated the dependency graph with any component changes?
  • Have you run linters?
  • Have you run prettier?
  • Have you tried building the css?
  • Have you tried building storybook?
  • [ ] Do you need to update the package version?

@Jeremy-Walton Jeremy-Walton added the Components Changes to a component label Dec 13, 2024
@Jeremy-Walton Jeremy-Walton self-assigned this Dec 13, 2024
@Jeremy-Walton Jeremy-Walton merged commit fc96366 into main Dec 14, 2024
1 check passed
@Jeremy-Walton Jeremy-Walton deleted the icon-font-loading-improvement branch December 14, 2024 21:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Components Changes to a component

Development

Successfully merging this pull request may close these issues.

3 participants