fontsizes on mobiles

  • Chris

    (@christianmuellerdhv)


    1 year, 1 month ago

    Hi,

    I’m trying to get inside fluid font-sizes but don’t understand the logic behind in TT3…

    As far as I understand right now Text in general and most of the blocks are allready fluid with a rule and CCS with the factor 0.75. On the other site there is the option for clamp, where in theory you can define Min & Max in the theme.json for predefined font-sizes.

    When I look to the frontend right now, h1 and h2 are realized with clamp, what makes sense, because they are the biggest headers. h3-h6 dont work with clamp. So far so good.

    What i don’t understand: where Min & Max are defined for h1 and h2? If I look to the theme.json, only the predefined fontsizes (small, medium…) are defindes for clamp, but h1 and h2 are not defined with this predefined sizes.

    If you go to the global styles typografie-settings for headings and change h1 and h2 to a predefind size, it’s not working with clamp any longer. For the other headings it’s the other way round. As standard they are defined with predefined sizes, and if you change them to an individual sitze it’s suddenly working with clamp?

    I would like to understand that, but most important: can I change the Min & Max for h1 and h2, if yes, where?

    Best regards

    Chris

Viewing 4 replies - 1 through 4 (of 4 total)

  • same problem — I mean the fluid type on mobile, for me, was way too small. And if I tried to adjust on the json, it simply ignored any changes I tried to make. if I change the size directly using the editor to a custom size it made no difference at all. it all had to be changed with css in the old fashion way in the editor customizer.

    If you look in theme.json at settings.typography.fontSizes, you can see where each of these are defined: https://themes.trac.www.ads-software.com/browser/twentytwentythree/1.2/theme.json#L249

    There’s also a new documentation page for typography that goes into detail on how font sizes work.

    I forgot to answer the question about changing in the UI. Fluid font sizes should still work from the UI as long as the size isn’t smaller than the minimum (default of 14px) and the theme has enabled fluid typography (which TT3 has). I haven’t figured out what version this feature is in (might only be in the upcoming WP 6.4).

    Thread Starter Chris

    (@christianmuellerdhv)

    Hi Justin,

    thank’s for the answers. Unfortunately I have overseen the section for h2 anf h1 in the theme.json of my tt3-parent-theme, seems that my search was defect…

    OK, but that means: To define max & min in the theme.json for child-themes or theme-developement the theme.json can be configured like the standard theme.json of the parent theme, without changing or registering anything in the functions.php?

    Regards

    Chris

    • This reply was modified 1 year, 1 month ago by Chris.
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘fontsizes on mobiles’ is closed to new replies.