Skip to content

fix(accounts): PQ-010 QA visual fixes for Quantum add-account [PERA-4483]#1021

Merged
fmsouza merged 1 commit into
mainfrom
fmsouza/pera-4483
Jul 24, 2026
Merged

fix(accounts): PQ-010 QA visual fixes for Quantum add-account [PERA-4483]#1021
fmsouza merged 1 commit into
mainfrom
fmsouza/pera-4483

Conversation

@fmsouza

@fmsouza fmsouza commented Jul 24, 2026

Copy link
Copy Markdown
Contributor

Description

Addresses the QA feedback on the Add Quantum Account entry (Add an account screen) reported on PERA-4483:

  • "NEW" badge color — Added a solid-mint new variant to PWBadge using the Figma tokens wallet4 (#8BF4DB) fill + wallet4Icon (#136880) text, and switched the quantum badge to it. The previous positive variant rendered a faint translucent teal that didn't match Figma. The shared positive variant (used in ~20 places) is left untouched.
  • "Learn more" link color — Switched the PanelButton learn-more link from variant='link' to variant='linkPositive'. The link variant resolves to linkPrimary, which is the brand yellow in dark mode; linkPositive keeps the teal link tone in both themes (#1F8E9D light / turquoise[600] dark), per the updated Figma.
  • Title wrapping — "Add Quantum Account" wrapped to a second line on high-density devices (Galaxy S25) because the scaled title + inline badge exceeded the row width. The title now stays on one line (truncate) when a badge is present; other panel rows are unaffected.

Related Issues

Checklist

  • Have you tested your changes locally?
  • Have you reviewed the code for any potential issues?
  • Have you documented any necessary changes in the project's documentation?
  • Have you added any necessary tests for your changes?
  • Have you updated any relevant dependencies?

Additional Notes

  • Only the quantum row currently uses badge/learnMore, so these PanelButton changes are effectively scoped to it — but they apply generically (any future badged row keeps its title on one line; any learn-more link is teal). Happy to make either opt-in via a prop if preferred.
  • The title fix uses ellipsis (worst case Add Quantum Acc…). If keeping the full text on one line is preferred, adjustsFontSizeToFit is a drop-in alternative.
  • Verified: PWBadge 3/3, PanelButton 8/8, useAddAccountScreen 43/43, quantum-create integration 1/1; format/copyright/i18n/secret checks clean.

🤖 Generated with Claude Code

…483]

Address QA feedback on the Add Quantum Account entry:

- "NEW" badge: add a solid-mint PWBadge `new` variant (wallet4 /
  wallet4Icon tokens) matching Figma, replacing the faint `positive`
  variant.
- "Learn more" link: use `linkPositive` so the link keeps the teal tone
  in dark mode (the `link` variant resolves to the brand yellow in dark).
- Title wrap: keep the panel title on one line when a badge is present,
  so "Add Quantum Account" no longer breaks to two lines on high-density
  devices (e.g. Galaxy S25).
@fmsouza
fmsouza requested a review from a team as a code owner July 24, 2026 13:46
@fmsouza
fmsouza merged commit 4979027 into main Jul 24, 2026
9 checks passed
@fmsouza
fmsouza deleted the fmsouza/pera-4483 branch July 24, 2026 14:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants