[Trailhead] The banner doesn't correspond to the specifications when using the Responsive Design Mode - Githubissues

mozilla-lockwise / mozilla-lockwise.github.io

Take your passwords everywhere

https://lockwise.firefox.com

Mozilla Public License 2.0

46 stars 11 forks source link

[Trailhead] The banner doesn't correspond to the specifications when using the Responsive Design Mode #130

Closed SoftVision-CarmenFat closed 5 years ago

SoftVision-CarmenFat commented 5 years ago

[Notes]:

This was tested on Desktop using the Responsive Design Mode since we have the website saved locally and cannot be tested on mobile.

[Affected versions]:

Firefox Release 67 and up

[Affected Platforms]:

All Windows
All Linux
All Mac

[Prerequisites]:

Have the static HTML/CSS/JS extracted to .zip.

[Steps to reproduce]:

Open the browser.
Open the index.html file with the browser.
Press Ctrl+Shift+M keys.
Observe the way the text is displayed inside the banner.

[Expected result]:

The "Join Firefox. Learn more" strings are displayed on the left side, on the second row.

[Actual result]:

The "Join Firefox. Learn more" strings are displayed on the first row.

[Additional Notes]:

Here are the mock-ups describing the banner in mobile view.
Attached a screenshot of the issue:

Lockwise mobile

devinreams commented 5 years ago

Thanks for catching that, @SoftVision-CarmenFat. I just pushed an update that will make sure "Join Firefox" stays together as one and wraps: