Repository navigation
Closed
Labels
ready-for-agentScoped and ready for an agent to pick upScoped and ready for an agent to pick upui-uxUI/UX polish and consistency workUI/UX polish and consistency work
Description
Parent
Épico: revisão visual dark-mode / Apple-like do OpenCode Desktop. Depende da fundação de tokens (#164).
What to build
Auditar e ajustar apenas visual/tokens, sem alterar comportamento, os seguintes arquivos:
components/settings-v2/general.tsx,general-controllers.ts,general-controller-behavior.ts
Passos:
- Revisar cada componente em light e dark mode usando os tokens
--v2-*depackages/ui/src/v2/styles/theme.css(já corrigidos por [Design] Dark-mode token contrast pass — packages/ui/src/v2/styles/theme.css #164) — nenhum hex cru, apenas tokens semânticos. - Aplicar refinamento estilo Apple HIG: hierarquia por peso/tamanho (não só cor), 1 CTA primário por tela, transições 150-300ms (
ease-outao entrar /ease-inao sair), cantos e sombras usando a escala--v2-elevation-*existente (sem valores de shadow ad-hoc), focus ring visível em todo elemento interativo, scrim de modal 40-60% preto reservado para contexto de dismissal. - Garantir que texto muted/faint, bordas e estados de hover/pressed permanecem legíveis nos dois temas (retestar após [Design] Dark-mode token contrast pass — packages/ui/src/v2/styles/theme.css #164).
- Verificar botões só-ícone têm
aria-label, e que nenhuma informação é passada só por cor.
Acceptance criteria
- Nenhuma mudança de comportamento/UX — apenas visual (cor, espaçamento, tipografia, elevação, motion)
- Sem hex cru — só tokens
--v2-*semânticos - Contraste de texto ≥4.5:1 (corpo) / ≥3:1 (grande, ícones, bordas) confirmado em light e dark
- Estados de foco visíveis via teclado em todos os elementos interativos da página
- Botões ícone-apenas têm
aria-label - Testado manualmente em light e dark antes de abrir o PR
Blocked by
Verification
Screenshots antes/depois em light e dark mode desta página/superfície, anexados ao PR.
Metadata
Metadata
Assignees
Labels
ready-for-agentScoped and ready for an agent to pick upScoped and ready for an agent to pick upui-uxUI/UX polish and consistency workUI/UX polish and consistency work
Activity
alltomatos commentedon Sep 9, 2026
Audited `components/settings-v2/general.tsx` and `components/settings-keybinds.tsx` (both v2 and legacy shortcuts views). Found and fixed two icon-only "clear search" buttons missing `aria-label`: the v2 view's in #182, and the legacy view's own separate button in #183. Everything else clean — no raw hex, no ad-hoc box-shadow, no non-token color classes.
Closing as verified (fixes in #182 + #183).