Re: [csswg-drafts] [css-fonts-5] Dynamic text size (#3708)

@AmeliaBR Yes, I covered it a bit in [this comment](https://github.com/w3c/csswg-drafts/issues/3708#issuecomment-477692038). You can also set `font-family: initial` if you want to keep the browser default. That's actually how cookiecrook caught on that, for accessibility purposes, we shouldn't be resetting font-weight .

But now that I read what you were saying about `medium` and thinking it over, that wouldn't solve another issue. Mac OS X has no resizing of system font. Even if the user scales up their text in the browser (uses "Very Large"), then `font:system` should still set it to the whatever Mac OS X (16px). It would work on iOS, Android, and Windows because those operating systems allow font scaling. Unless, we say that `font:system` can only be implemented on OS's with font-scaling support (most except Mac OS X). But even that gets messy.

That means effectively, we will still need another property for the size itself. I do like `font-size:medium`, personally, but I think most resistance you'll find is existing content would change. People have, perhaps, already built styles expecting `font-size:medium` to be 16px on Chrome Mobile and iOS (assuming they're not using Dynamic Type). That means, we unfortunately need a new property, (eg: `font-size:preferred` or `font-size: env(user-font-size)`).

Regardless, the property in question should be `SYSTEM_FONT_SIZE * BROWSER_FONT_SCALE`.  On iOS and Android, `BROWSER_FONT_SIZE` would likely always be `100%` with `SYSTEM_FONT_SIZE` being variable. But on Mac OS X, it would be the opposite. Windows would likely support both. So now I'm envisioning:

````
html {
  /* iOS Dynamic Type */
  font: -apple-system-body;
  /* New CSS Spec to get system font-family and system font-weight */
  font: system;
  /* New CSS Spec to get preferred font size Option 1 */
  font-size: preferred;
  /* New CSS Spec to get preferred font size Option 2 */
  font-size: env(user-font-size);
  /* Fallback to get system font-family */
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
````

Which would cover a native-like experience (for PWAs or Electron), allow font-scaling on browsers that support it, while providing a fallback for those that don't. (Style authors can always change `font-family`).

-- 
GitHub Notification of comment by clshortfuse
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3708#issuecomment-492363730 using your GitHub account

Received on Tuesday, 14 May 2019 18:52:24 UTC