1848219 - Update text styles of Review Quality Check UI after copy is finalized

Status: RESOLVED WONTFIX

(Firefox for Android Graveyard :: Shopping, task, P2)

Description

[Noah Bond [:007]]

The copy within the Review Quality Check UI has some substring formatting that will require some composable annotated string styling once the copy is finalized.

As part of this ticket:

• Make sure the copy of the subcomponents is up-to-date.
• Ensure any appropriate styling is applied (high level styling like body 1, body 2, etc)
• Ensure any appropriate substring styling is applied (e.g. substring bolding/re-coloring).

For more context:
https://github.com/mozilla-mobile/firefox-android/pull/3147#discussion_r1288194788

Comment 1

[Chris Peterson [:cpeterson]]

Attachment: How_reliable_are_the_reviews_screenshot.png

Some differences in the "How we determine review quality" section compared to the Figma design:

• Missing bullet points for the higher and lower grade descriptions.
• Missing bold text for "letter grade", "adjusted rating", and "Highlights".
• Tapping the "Learn more about how Fakespot determines review quality" link doesn't do anything. I expected it would open a new page describing Fakespot's review analysis.

Comment 2

[Chris Peterson [:cpeterson]]

Attachment: Highlights_screenshot.png

Changes for the review highlights card:

• The toolbar icon has changed from a shopping cart to a wallet.
• The section headers, like Quality, should be bold text.
• The review highlights should be in quotes.

Comment 3

[Rahul Sainani [:rsainani]]

Thanks Chris, the icon will be updated as part of Bug 1841600 and the review highlights quotes will be added with Bug 1852748.

The highlight section headers appear bold for me. Can you please confirm that it's still the case that they appear as in the screenshot you shared above?

Comment 4

[Noah Bond [:007]]

Closing this in favor of a new UX feedback meta