WAIT: Typography Scale: Base font size generates wrong rem values

Bugs
1

Browser: Firefox 147
OS: Windows
URL: LocalWP

Environment: HTML font-size: 100% (16px)
Expected: --text-m: 1rem (= 16px)
Actual: --text-m: 1.6rem (= 25.6px)

Steps to reproduce:

  1. Open Style Manager → Theme Styles → Typography → HTML:font-size: 100%
  2. Open Style Manager → Typography
  3. Set Base font size: 16px
  4. Generate Variables
  5. Check --text-m value: clamp(1.6rem, calc(0 * (100vw - 36rem) + 1.6rem), 1.6rem); }

Workaround: - Enter “10” instead of “16” to get 1rem output

2

Hi @Astwert,

it should generate something like this: --text-m: clamp(1rem, calc(0.003703703703703704 * (100vw - 22.5rem) + 1rem), 1.25rem);

Can you record a video showing the settings and generating variables? I can’t replicate it, but maybe I missed some steps.

Best reagrds,
Matej

3

I have the same issue with 2.2 RC2. If I change the font-size from 62.5% to 100%, the variables for the font sizes (text, headings) and for the spacing stay the same, as if the font-size was still 62.5%.

I tried changing the value of the base font size from 16px to 10px, back to 16px to see if the new 100% value would be considered then, but it wasn’t. I haven’t tried deleting the variables completely and creating them fresh, would that work?

Ideally when changing the font-size %, the variables would automatically adjust to reflect the new %.

Thanks for any help with this!

1 Like
4

Hi @adminmax,

that’s correct. Current behaviour is that the variables will update only if your regenerate them, not if you change the font size.

This, however, will be updated in one of the future versions, where once you update the font size or screen sizes, you will see a button that will allow you to recalculate the variables.

As for now, you can regenerate them manually.

Matej