feat(shared): add sidebar shortcut utility#45
Conversation
- Add theme-fouc.js for FOUC-free synchronous theme application on load - Add theme.js runtime module (LabelSuiteTheme API, localStorage persistence) - Add dark-mode CSS tokens to tokens.css - Wire shared sidebar appearance toggle (sun/moon/monitor icons) to theme API - Apply data-theme attribute switching across all 10 prototype pages - system mode resolves to light (app default, not OS prefers-color-scheme) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…settings - spec 008 v1.2.0: add US6, FR-015/A/B/C/D, SC-008/A/B/C, AppearanceState entity, APPEARANCE_STORAGE_KEY/MODES/DEFAULT_RESOLVED constants, and process flow step 6 - spec 005 v1.2.5: add US6, FR-013/A, SC-009, AppearanceState reference to spec 008, and APPEARANCE_STORAGE_KEY constant - Document that system mode is fixed light (not OS prefers-color-scheme) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-authored-by: OpenAI Codex <noreply@openai.com>
There was a problem hiding this comment.
The implementation of the sidebar shortcut utility and theme toggle is well-executed with comprehensive test coverage. The code demonstrates good practices including proper error handling, accessibility support, and internationalization. All changes are working as intended with no critical defects identified that would block merge.
You can now have the agent implement changes and create commits directly on your pull request's source branch. Simply comment with /q followed by your request in natural language to ask the agent to make changes.
There was a problem hiding this comment.
Code Review
This pull request implements a global theme management system (light, dark, and system modes) with FOUC prevention and migrates hardcoded styles to CSS variables across several prototype pages. Additionally, it introduces a keyboard shortcut overview modal within the shared sidebar. The review feedback highlights a potential ReferenceError due to an undefined utility function in the sidebar script and identifies naming inconsistencies for the theme storage key across the project's documentation and implementation.
Co-authored-by: OpenAI Codex <noreply@openai.com>
Co-authored-by: OpenAI Codex <noreply@openai.com>
…tail prototype - Remove standalone stage breakdown section; merge selected-round progress bar into the overall summary panel (above metric grid) - Add IAA as 6th summary metric; layout all 6 metrics in a single row - Round pills now drive per-round progress bar rendering (only selected round shown); suppress redundant IAA text inside progress bar card - Sync spec v1.7.8 with all prototype changes Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…sults tab Add independent footer pagination bar to the export history table, keeping its page/pageSize state separate from the annotation results table. Update spec to v1.7.11 with FR-015e-1. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Qodo reviews are paused for this user.Troubleshooting steps vary by plan Learn more → On a Teams plan? Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center? |
… placement Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…olors Reviewer badge uses primary (indigo) token set; annotator badge uses success (green) token set for clear visual distinction in member-management and work-log tables. Adds missing --color-primary-border token to tokens.css (light: #C7D2FE, dark: #3730A3). Syncs spec.md to v1.7.13. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…n system - Fix workflow connector arrows invisible in dark mode by applying brightness(0) invert(1) filter to connector img elements - Add badge-warning dark override (was missing, showing jarring light bg) - Adjust badge-task-type-single and -relation text from cyan-300 to cyan-200 for consistent visual weight across task-type badges - Add dark mode overrides for sidebar navbar border and dialog shadows - Raise --color-text-muted in dark from zinc-500 to slate-400 for WCAG AA - Add Dark Mode Tokens section to MASTER.md with implementation rules and badge dark override reference table (rule 5) - Add four dark mode checklist items to MASTER.md pre-delivery checklist Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
… layout - Migrate remaining prototype pages to use external sidebar.css + theme-fouc.js - Fix task-new.html sidebar layout break caused by missing sidebar.css link - Fix user-management.html modal/form hardcoded white backgrounds for dark mode - Update MASTER.md with dark mode token and theming documentation Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…type pages - sidebar.js: support roleLabel in applyGlobalLanguage to update #roleIndicator - annotation-list: fix TEXT SUMMARY column to switch between ZH/EN sample text; add getSampleText() helper and textEn for all 30 sample texts across 6 task types - annotation-list, dataset-analysis-list: pass roleLabel in applyGlobalLanguage so user chip shows localized role in EN mode - dataset-analysis-list: add roleIndicatorLabel (Project Leader) to i18n - annotation-workspace, dataset-analysis-detail, task-detail, task-new: add nav label i18n keys and apply them on lang switch Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Summary
Validation
pnpm playwright test tests/shared/sidebar-shortcuts.spec.ts --workers=1pnpm playwright test tests/shared/language-switch-consistency.spec.ts tests/shared/sidebar-shortcuts.spec.ts --workers=1Review Resolutions
Round 1 — 2026-05-13
design/prototype/pages/shared/sidebar.js: extended interactive-target detection so the?shortcut does not open shortcut help while focus is inside editable content.design/prototype/tests/shared/sidebar-shortcuts.spec.ts: added regression coverage for the editable-content shortcut suppression case.specs/account/005-profile-settings/spec.md: alignedAPPEARANCE_STORAGE_KEYandAppearanceState.storage_keywith the implementedlabel-suite-themekey.