1983565 - Update redesigned onboarding UX to match the Figma design ‘carousel style’ for Mobile

Status: RESOLVED FIXED

(Firefox for Android :: Onboarding, task, P2)

Description

[twhite]

• Design doc
• Jira Theme
• Spike doc

---

Mobile specific design Figma link

• Add new background (red/orange gradient)
• Add carousel ‘wrapper’ (include page gaps)
• Wrap existing cards in a Card UI element. The Card height is roughly 70% of the device height, width is roughly 85% of the device width
• The min width supported for the portrait view is 360dp
• Ensure spacing of system bars and the page indicator
• Trim unused code
• Add the ‘peek’ view of the cards

Note

• This does not include updates to each card.
• This is focused on the Mobile design. Follow-up tasks will ensure the implementation is correct across Tablets, Small screens and Mobile Landscape mode.

Comment 2

[twhite]

Attachment: Bug 1983565 - Part 1: Add gradient background and carousel scrolling behaviour.

Comment 3

[twhite]

Attachment: Bug 1983565 - Part 2: Add parent `Card` for the redesigned onboarding pages.

Comment 4

[twhite]

Attachment: Bug 1983565 - Part 3: Delete redundant ThemeOnboardingPageRedesign.kt

Comment 5

[twhite]

Attachment: Bug 1983565 - Part 4: Fix duplicated desc doc in the onboarding screens

Comment 6

[twhite]

Attachment: WIP: Bug 1983565 - Part 2: Add parent `Card` for the redesigned onboarding pages.

Comment 7

[twhite]

Attachment: Bug 1983565 - Part 5: Add minimum sizes for page content

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/0cc5869c542a
https://hg.mozilla.org/integration/autoland/rev/a05e1130cac3
Part 1: Add gradient background and carousel scrolling behaviour. r=android-reviewers,rebecatudor273
https://github.com/mozilla-firefox/firefox/commit/6a7b70a2fa59
https://hg.mozilla.org/integration/autoland/rev/a87ab266358d
Part 2: Add parent `Card` for the redesigned onboarding pages. r=android-reviewers,rebecatudor273
https://github.com/mozilla-firefox/firefox/commit/5fe2ab716727
https://hg.mozilla.org/integration/autoland/rev/81241e500435
Part 3: Delete redundant ThemeOnboardingPageRedesign.kt r=android-reviewers,rebecatudor273
https://github.com/mozilla-firefox/firefox/commit/aa41991cfbe7
https://hg.mozilla.org/integration/autoland/rev/bc8b0c8b62e3
Part 4: Fix duplicated desc doc in the onboarding screens r=android-reviewers,rebecatudor273
https://github.com/mozilla-firefox/firefox/commit/b6667d19278b
https://hg.mozilla.org/integration/autoland/rev/85a4e08c2fd3
Part 5: Add minimum sizes for page content r=android-reviewers,rebecatudor273

Comment 9

[agoloman]

https://hg.mozilla.org/mozilla-central/rev/a05e1130cac3
https://hg.mozilla.org/mozilla-central/rev/a87ab266358d
https://hg.mozilla.org/mozilla-central/rev/81241e500435
https://hg.mozilla.org/mozilla-central/rev/bc8b0c8b62e3
https://hg.mozilla.org/mozilla-central/rev/85a4e08c2fd3