[landing] Fix "fluid" `font-size` for `footer:navigation a`
ClosedPublic
Actions

Authored by atul on Mar 15 2022, 12:56 PM.

Details

Reviewers

• jacek
tomek
• benschac

Commits

rCOMMa97182d344c3: [landing] Fix "fluid" `font-size` for `footer:navigation a`

Summary

Interpolate from 16px to 24px for width of 320px to 1850px.

Test Plan

Continues to look as expected:
(towards end)

Diff Detail

Repository

rCOMM Comm

Lint

Lint Not Applicable

Unit

Tests Not Applicable

Event Timeline

atul created this revision.Mar 15 2022, 12:56 PM

Herald added subscribers: • karol, • adrian, ashoat. · View Herald TranscriptMar 15 2022, 12:56 PM

atul published this revision for review.Mar 15 2022, 12:56 PM

Harbormaster failed remote builds in B7395: Diff 10408!Mar 15 2022, 12:57 PM

atul edited the test plan for this revision. (Show Details)Mar 15 2022, 1:06 PM

Looks ok, but not sure what is the relation to other diffs. We had a diff D3392 which limits the text to two lines, but in the video there's a moment where the text has 3 lines.

This revision is now accepted and ready to land.Mar 16 2022, 3:40 AM

• benschac accepted this revision.Mar 16 2022, 7:00 AM

• benschac added inline comments.

landing/footer.css
47 ↗	(On Diff #10408)	16 * 1.5 = 24? Max font size. could you maybe comment about the slope here? Like it's 24px after x width, then is 16px after hitting y width? I have a feeling we're going to forget what this is doing in like a month.
47 ↗	(On Diff #10408)	Could you add this (or something like it) as a comment here?

Looks ok, but not sure what is the relation to other diffs. We had a diff D3392 which limits the text to two lines, but in the video there's a moment where the text has 3 lines. (@palys-swm)

I rebased such that the two-line diff is at the end of the stack so that moment in the video isn't a surprise.

Basically re-ordered the commits to:

Fix up all of the existing "fluid" text after removing the clamp() from root (html css selector)
Make the changes necessary to support the SubscriptionForm being included in the hero (D3392)

atul added inline comments.Mar 16 2022, 11:01 AM

landing/footer.css
47 ↗	(On Diff #10408)	Yeah, I can add comments to all of these that translate the font-sizes (in px) we want to interpolate over the widths (in px) and then convert them to rem units. Would totally link the CSS Tricks article, but I don't know if the links are "stable" the way StackOverflow ones are.
47 ↗	(On Diff #10408)	I'll do this in a separate diff just to land these.