1711858 - [Onboarding] The last three letters of the "Fire starts here" string are barely visible when the browser inner window is 700 x 500

Status: VERIFIED FIXED

(Firefox :: Messaging System, defect, P2)

Description

[Ciprian Muresan [:cmuresan], Ecosystem QA]

Attachment: image.png

[Affected versions]:

• Firefox Nightly 90.0a1, Build ID 20210518213628
• Firefox Beta 89.0b13, Build ID 20210516190025

[Affected Platforms]:

• Windows 10
• macOS 10.15
• Linux MX 4.19

[Prerequisites]:

• Have a new Firefox profile.
• Have the browser window resized to have an inner window size of 700 x 500 (use this site for help).

[Steps to reproduce]:

1. Open the browser with the profile from prerequisites.
2. Navigate to the about:welcome page and observe the "Fire starts here" string.

[Expected results]:

• The string is fully visible and is displayed on 3 rows.

[Actual results]:

• The last three letters of the starts string are barely visible and are overlapped by the noodle.

[Notes]:

• 700 x 500 is the minimum resolution supported that does not force scrollbars to appear.
• Attached a screenshot of the issue.

Comment 1

[Ed Lee :Mardak]

Looks like part of the reason this overlap happens is because the text has specified widths instead of flexing to the available space that isn't used by main-content/noodles:

https://searchfox.org/mozilla-central/rev/443f87caa5fadba920b0382e12874693d6c6133a/browser/components/newtab/content-src/aboutwelcome/aboutwelcome.scss#787,793,798,804,810

Comment 2

[Ed Lee :Mardak]

Attachment: Bug 1711858 - Avoid "Fire starts here" from getting hidden by noodles r?pdahiya

Remove explicit section-left children widths to allow the parent to flex with a static width section-main for initial screen. Clean up some breakpoint sizing with percent/viewport widths.

Comment 3

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/963d33545e08
Avoid "Fire starts here" from getting hidden by noodles r=pdahiya

Comment 4

[Atila Butkovits]

https://hg.mozilla.org/mozilla-central/rev/963d33545e08

Comment 5

[Ciprian Muresan [:cmuresan], Ecosystem QA]

I have verified that the issue is no longer reproducible on the latest Firefox Nightly 90.0a1 (BuildID 20210525093431) using Windows 10, macOS 11.3.1, and Linux MX 4.19. The "Fire starts here" string is fully displayed even when the browser is resized to the minimum size.