Skip to content

feat(mobile): show full setting descriptions - #187

Draft
Lint111 wants to merge 1 commit into
Ark0N:masterfrom
Lint111:agent/split-mobile-setting-descriptions
Draft

feat(mobile): show full setting descriptions#187
Lint111 wants to merge 1 commit into
Ark0N:masterfrom
Lint111:agent/split-mobile-setting-descriptions

Conversation

@Lint111

@Lint111 Lint111 commented Jul 29, 2026

Copy link
Copy Markdown

Summary

Let phone users open the full description of an App Settings option without toggling or editing that option.

Compact mobile setting tiles truncate long explanations. This adds an accessible bottom-sheet description layer while leaving the existing controls and desktop title tooltips unchanged.

Behavior

  • Marks titled settings as description-capable on phone layouts.
  • Opens the full title text by tapping the setting's text area.
  • Keeps switches, inputs, selects, links, and action buttons on their existing direct-interaction path.
  • Supports keyboard activation with Enter or Space.
  • Closes from the backdrop, close button, or Escape.
  • Temporarily makes the parent settings content inert and hands focus trapping to the description dialog.
  • Restores the parent settings focus trap after closing.
  • Removes mobile-only roles and trigger styling on wider layouts.

Accessibility

  • role="dialog" and aria-modal="true" on the description panel.
  • Labelled/described relationships for title and body text.
  • Trigger metadata via role="button", tabindex, aria-haspopup, and aria-controls.
  • 44px close target and visible focus treatment.
  • Long labels and descriptions wrap within the phone viewport.

Scope Correction

The original test referenced the terminal-controls setting from another feature branch. This split uses the existing upstream Wheel Scrolls Local History setting instead, so the PR targets master independently.

Verification

  • Focused Playwright regression:
    • npx vitest run --config test/mobile/vitest.config.ts test/mobile/settings.test.ts -t "opens the full option description"
    • 1 passed, 19 skipped
  • Full mobile settings file:
    • 18 passed, 2 failed
    • Both failures reproduce unchanged on origin/master:
      • mobile defaults: all panels hidden, subagent tracking OFF, ralph OFF
      • settings survive page reload
  • npx prettier --check test/mobile/settings.test.ts
  • npm run check:frontend-syntax
  • npm run check:public-assets
  • npm run build

Non-Goals

  • Rewriting or shortening existing setting copy
  • Changing desktop settings layout or tooltip behavior
  • Changing any setting value, persistence policy, or default

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.

1 participant