Files
libra/docs/tasks/12-2.md
T
Naser Mansour 0f9d12c3cf Prepare project for pipeline takeover: task tracker, UX doc, CLAUDE.md pointers
Adds docs/tasks/ (16 epics + 102 stories converted to task/subtask files with
statuses.md as the new status source of truth) and docs/ux-design.md
(retrospective design-system reference), and points CLAUDE.md at them.
docs/prd.md and docs/architecture.md are kept as BMAD wrote them; the legacy
docs/stories/, docs/epics/, docs/qa/gates/ and .bmad-core/ stay in place as
historical/traceability records, superseded but not deleted.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-09-27 22:02:23 +03:00

1.8 KiB

id, title, status, date, parent
id title status date parent
12-2 12-2 Core CSS Theme Update - Dark Charcoal & Warm Gold Palette QA Review 2026-09-27 12

Description

As a developer I want to update the Tailwind CSS theme to use the new dark charcoal and warm gold color palette So that the application reflects the refined LIBRA for Rights brand colors. - resources/css/app.css - Main theme file. Full implementation history: docs/stories/story-12.2-core-css-theme-update.md

Acceptance Criteria

  • AC1: Update Color Variables in resources/css/app.css: Given the current theme uses Olive Green palette; When I update the @theme block; Then the following color mappings are applied:
  • AC2: Add Color Variants for UI States: Given the new palette needs hover and active states; When I update the theme; Then these additional variants are defined:
  • AC3: Update Button Styles: Given button classes use the primary/accent colors; When theme is updated; Then .btn-primary and .btn-secondary use new palette:
  • AC4: Update Form Focus States: Given form inputs have focus rings; When theme is updated; Then focus states use Warm Gold:
  • AC5: Update Link Colors: Given links use accent colors; When theme is updated; Then link colors use warm gold:
  • AC6: Status Colors Unchanged: Given status colors serve functional purposes; When theme is updated; Then these remain unchanged:
  • AC7: WCAG AA Contrast Compliance: Given accessibility requirements; When new colors are applied; Then all text/background combinations meet WCAG AA:
  • AC8: Update Prose Class: Given .prose-brand class exists for blog content; When theme is updated; Then prose colors use new palette:
  • AC9: Build Succeeds: Given CSS changes are made; When I run npm run build; Then the build completes successfully without errors