I created two typography scales, for text and headings. The preview in the scale generator is as expected and the behaviour on the front-end is as expected too.
However, Iāve had reports from several of my students that the exact same settings arenāt producing the correct/expected font sizes in their own installs. The sizes are way too big, and are not limited by the maximum viewport size.
Since I recorded the video below, Iāve found that I think itās because āGenerate Variablesā isnāt working as it should.
I tried clicking it many times, as have my students (one said she lost track of how many times she clicked it). But then suddenly, it works.
For example, in the ānot working as expectedā site I show you, Iād personally clicked āGenerate Variablesā for both scales, many times. Then, in the spirit of never giving up, I tried it again just now, and that worked. Now the clamp values are correct, and itās all behaving as expected.
This happened with another student too, which makes me think this is probably the issue (unless itās a massive coincidence).
Hi Dave,
Thanks so much for your report and the detailed video!
I believe that I already spotted the issue in your video. It looks like the one reported here:
Even if the placeholder shows ā100%ā, itās still using 62.5% for the calculations. Please deliberately select 100% from the dropdown in the style manager settings, and regenerate the variables. Then it should work as expected.
Ps: Iām watching the last few minutes of the video right now, but I havenāt seen you regenerating the variables (unless I missed it) after setting the HTML font size to 100%. So I still think thatās exactly whatās causing the problem.
When I set up the type size scales in my own install I specifically set 100% HTML font size.
And in the studentās install I showed in the video, I could very well have set that myself while testing, but didnāt try generating variables again until after the video.
Iāve asked all the people who reported this issue to me to set 100% HTML font size specifically and then generate variables again. Confident this must be the issue, but Iāll report back either way.
I did this several times, resaving each time. Switching from the default grayed out 100% to the 100% (1rem = 16px) in the dropdown and back resaving each time. I must have clicked Generate Variables a dozen times. I think there might be a glitch some where. Honestly, I am glad others are having the same issue just so I know I am not crazy.
Unfortunately, I donāt know how to reproduce this because it always works for me on the first try ā and believe me, Iāve tested it more than a dozen times (just to track down the known bug). I think we can rule out caching (which is always my first thought in situations like this), right?
Perhaps your student could also provide a detailed screen recording and/or access data for his installation so that we can test it ourselves?
Yes, I appreciate itās impossible to track down bugs when they canāt be reproduced. Iāve also had two others so far tell me they specifically chose 100% again, regenerated variables, and now the problem is fixed.
Iāll keep an eye on other responses but Iām inclined to say that this one is solved.