Reduce first-load icon flicker with font-display: block and preload guidance

[Copilot]

Summary

This PR focuses on reducing first-load icon flicker through loading guidance and CSS behavior for both Material Symbols and Material Icons, while keeping full packaged fonts and existing generator/font packaging behavior.

Changes

• Reverted GoogleMaterialDesignIconsGenerator IconHttpClientService changes so Material Symbols font acquisition remains as before (full variable-font assets).
• Restored packaged Material Symbols font files in src/MudBlazor.FontIcons.MaterialSymbols/wwwroot/font/ to the original full versions.
• Kept font-display: block in Material Symbols @font-face declarations.
• Updated documentation/material_symbols_usage.md with explicit preload recommendations for:
  • MaterialSymbolsRounded.woff2
  • MaterialSymbolsOutlined.woff2
  • MaterialSymbolsSharp.woff2
  • plus stylesheet include order.
• Applied the same flicker mitigation to Material Icons:
  • Added font-display: block to Material Icons @font-face declarations in font.css and font.min.css.
  • Updated documentation/material_icons_usage.md with preload guidance (preload only the variants in use), including optional variant paths.

Compatibility

• Existing public constants (e.g. MudBlazor.FontIcons.MaterialSymbols.Rounded.Weight) remain unchanged.
• No consumer code changes are required; docs now recommend preload for better first-load behavior.

Validation

• dotnet build src/GoogleMaterialDesignIconsGenerator/GoogleMaterialDesignIconsGenerator.csproj --configuration Release
• dotnet build src/MudBlazor.FontIcons.MaterialIcons/MudBlazor.FontIcons.MaterialIcons.csproj --configuration Release
• dotnet build src/MudBlazor.FontIcons.MaterialSymbols/MudBlazor.FontIcons.MaterialSymbols.csproj --configuration Release
• Parallel validation:
  • Code Review: no comments
  • CodeQL: no alerts

[danielchalmers]

From #22 (comment)

[ScarletKuro]

No, revert the IconHttpClientService changes. The whole point is to get the full font with axis, weight and so on, so you could easily change settings with font-variation-settings globally, or per icon. If someone doesn't want full fonts they use either cdn with tuned settings, or get the specific font themselves and reference it. The package should provide full icons to be user friendly.
Only useful advice is preload + block. Other suggestions are not so useful.
The preload seems to have good results:

Just need to get feedback from customer.

[ScarletKuro]

@copilot revert changes except the font-display: block; in readme add advice to use:

    <link rel="preload"
          href="_content/MudBlazor.FontIcons.MaterialSymbols/font/MaterialSymbolsRounded.woff2"
          as="font"
          type="font/woff2"
          crossorigin>
    <link rel="preload"
          href="_content/MudBlazor.FontIcons.MaterialSymbols/font/MaterialSymbolsOutlined.woff2"
          as="font"
          type="font/woff2"
          crossorigin>
    <link rel="preload"
          href="_content/MudBlazor.FontIcons.MaterialSymbols/font/MaterialSymbolsSharp.woff2"
          as="font"
          type="font/woff2"
          crossorigin>
    <link href="_content/MudBlazor.FontIcons.MaterialSymbols/css/font.min.css" rel="stylesheet" />

to avoid flicker as it proven to solve the issue

[Copilot]

No, revert the IconHttpClientService changes. The whole point is to get the full font with axis, weight and so on, so you could easily change settings with font-variation-settings globally, or per...

Implemented in commit be09e49: reverted IconHttpClientService and restored the full Material Symbols font files, while keeping font-display: block and adding explicit preload guidance in the Material Symbols docs.

@copilot revert changes except the font-display: block; in readme add advice to use:

    <link rel="preload"

...

Done in commit be09e49: reverted prior generator/font packaging changes, kept font-display: block, and updated material_symbols_usage.md with the requested preload snippet for Rounded/Outlined/Sharp plus the stylesheet link.

[ScarletKuro]

@copilot do the same for MudBlazor.FontIcons.MaterialIcons

[Copilot]

@copilot do the same for MudBlazor.FontIcons.MaterialIcons

Implemented for MudBlazor.FontIcons.MaterialIcons in commits 8eae80c and bfa5ba4: added font-display: block to Material Icons @font-face rules and updated material_icons_usage.md with preload guidance (preload only the variants you use).