BlazorHybrid does not scale to system font size on iOS

[roughiain]

trafficstars

Description

When setting accessibility font and text size to maximum the font size in the Blazor hybrid stays the same. See comparison images. Note it works correctly on Android

Steps to Reproduce

1. Create new Blazor Hybrid app from Microsoft template.
2. run/install app on iOS
3. Set system text in settings > accessibility to max.
4. View app on iOS
5. Close App on iOS
6. Open App on iOS

Font size does not change

Link to public reproduction project repository

n/a as basic template provided by Microsoft

Version with bug

7.0 (current)

Last version that worked well

Unknown/Other

Affected platforms

iOS

Affected platform versions

iOS 16

Did you find any workaround?

No

Relevant log output

No response

[XamlTest]

Verified this on Visual Studio Enterprise 17.7.0 Preview 2.0. This issue does not repro on Android 13.0-API33, repro on iOS 16.4 with below Project: MauiApp9.zip

[nzdrgn]

Hey guys is this still a thing? I am building my first blazor hybrid app, and my blazor fonts are not scaling with the platform on IOS like they do with windows and android, maui xaml font are fine on ios interestly.

[Felix-Dev]

We are also affected by this issue.

[NigrolasDotFr]

Hello if I can help the community, it's not a MAUI bug, it's simply that iOS doesn't support only its own font in accessibility. You need to add the following condition to your CSS file:

@supports (font: -apple-system-body) {
    html, body {
        font: -apple-system-body !important;
    }
}

https://dev.to/colingourlay/how-to-support-apple-s-dynamic-text-in-your-web-content-with-css-40c0