Skip to content

fix(frontend): associate asset info labels and liquidity amount label with their values - #3985

Open
JayPokale wants to merge 1 commit into
interledger:mainfrom
JayPokale:fix/3969-a11y-label-markup
Open

JayPokale wants to merge 1 commit into
interledger:mainfrom
JayPokale:fix/3969-a11y-label-markup

Conversation

@JayPokale

Copy link
Copy Markdown

Changes proposed in this pull request

  • Asset Information panel (Peer and Wallet Address detail pages): the Code / Scale / Withdrawal threshold pairs are now a <dl> with <dt>/<dd>, using Radix asChild on the existing Flex/Text components so classes and layout stay the same.
  • LiquidityDialog: the "Amount" text is now a real <label htmlFor={amountId}> (via Text as='label'), pointing at the input's existing useId() id.

Context

fixes #3969 (WCAG 1.3.1 Info and Relationships).

  • Rendered the new markup with react-dom/server to confirm the output: <dl class="rt-Flex ..."><div ...><dt ...>Code</dt><dd ...>USD</dd></div>...</dl> and <label for="...">Amount</label>. A div wrapping each dt/dd group is valid inside dl.
  • Tailwind's base layer resets the default dl/dd margins, so nothing shifts visually.
  • tsc and eslint pass for packages/frontend; files formatted with Prettier.

Checklist

  • Related issues linked using fixes #number
  • Tests added/updated (no existing frontend unit tests for these routes)
  • Make sure that all checks pass
  • Bruno collection updated (if necessary): n/a
  • Documentation issue created with user-docs label (if necessary): n/a
  • OpenAPI specs updated (if necessary): n/a

Prepared with help from Claude (AI assistant) and reviewed by me before submitting.

@netlify

netlify Bot commented Oct 1, 2026 •

Copy link
Copy Markdown

✅ Deploy Preview for brilliant-pasca-3e80ec canceled.

Name Link
🔨 Latest commit f4e61b5
🔍 Latest deploy log https://app.netlify.com/projects/brilliant-pasca-3e80ec/deploys/6abe0afcd0f6870008701d47

@github-actions github-actions Bot added the pkg: frontend Changes in the frontend package. label Oct 1, 2026

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

pkg: frontend Changes in the frontend package.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Asset Information fields and Liquidity amount input use unassociated label/value markup (WCAG 1.3.1)

1 participant