TrueGrowth/openspec/changes/refactor-truegrowth-ui-system/specs/workbench-shell/spec.md

ADDED Requirements

Requirement: Workbench Pages SHALL Follow The Image Golden Page Layout

Workbench pages SHALL use the approved /image AI 图片生成 page as the concrete layout and polish reference: wide left navigation, no global topbar, full-height page content, white or near-black operation surfaces, soft gray or near-black result surfaces, compact grids, thin borders, soft shadows, and orange primary actions.

Scenario: Page has a primary workflow

• WHEN a workbench page presents a primary workflow
• THEN it SHALL place the workflow in structured sections or cards using TrueGrowth UI tokens
• AND it SHALL keep forms dense, labeled, and readable

Scenario: Page is a generator workflow

• WHEN the page creates images, videos, digital-human outputs, audio, clips, or other generated media
• THEN it SHALL follow the /image pattern of left configuration panel plus right result/task feed
• AND it SHALL group results by batch with full-ratio media rails and compact batch actions

Scenario: Page is a library/status/settings workflow

• WHEN the page manages assets, tasks, publishing, models, settings, or workflow history
• THEN it SHALL adapt the /image rhythm into media-first grids, dense status lists, or grouped configuration panels
• AND it SHALL avoid nested cards, always-visible button clutter, and page-local basic controls

Scenario: Page supports dark mode

• WHEN the app is in dark mode
• THEN the page SHALL use near-black surfaces, visible borders, and orange focus/active states
• AND controls SHALL remain readable without overlapping or wrapping button text

Scenario: Page is visually completed

• WHEN a page migration is claimed complete
• THEN the route SHALL have browser screenshot evidence from http://127.0.0.1:7200/...
• AND the verification SHALL include no framework overlay, no relevant console errors, and at least one primary interaction check

Requirement: Page Templates SHALL Guide New Workbench Surfaces

Workbench implementation SHALL start from documented page templates for list, form, generator, media-library, status, asset, task, and detail surfaces.

Scenario: Codex adds a new page

• WHEN Codex adds a new workbench page
• THEN it SHALL follow the closest page template
• AND it SHALL use PageShell, Section, FormGrid, and Card from @/ui where applicable