Skip to content

Fix/design md compliance#3

Merged
mikewoo merged 30 commits into
mainfrom
fix/design-md-compliance
May 23, 2026
Merged

Fix/design md compliance#3
mikewoo merged 30 commits into
mainfrom
fix/design-md-compliance

Conversation

@mikewoo

@mikewoo mikewoo commented May 23, 2026

Copy link
Copy Markdown
Owner

Change Type

  • Bug fix (fix)
  • New feature (feat)
  • Documentation (docs)
  • Refactoring (refactor)
  • Other

Description

DESIGN.md Compliance Fix (19 Vue files)

Replaced hardcoded colors and font-sizes across all Vue components with --eify-* CSS custom properties and .text-* utility classes, aligning with the DESIGN.md design system specification.

  • Color replacements: #6366f1var(--eify-primary), #ef4444var(--eify-error), and 15 more mappings
  • Font-size replacements: font-size: 14px.text-base, font-size: 12px.text-xs, and 5 more mappings
  • Exemptions preserved: SVG <stop> tags, workflow node type colors, Catppuccin log viewer theme, Vue Flow props, var() fallback values, #0f0f1a login background

Version Display Bug Fix

start.sh used grep to extract <eify.version> from pom.xml, but eify.version references ${revision} which shell cannot resolve. The login page displayed v${revision} instead of the actual version. Fixed by reading the <revision> property directly.

Visual Regression Testing

Added Playwright screenshot script (eify-web/screenshot-check.cjs) covering login page + 9 authenticated pages + sidebar hover state (11 screenshots total). Uses API-based JWT authentication.

Documentation Restructure

  • Streamlined CLAUDE.md: removed duplicated Flyway template and log index, unified checklist items
  • Added E2E-TESTING.md (Playwright patterns) and SECURITY.md (risk checklist)
  • Added ClickHouse monitoring queries to DATABASE.md
  • Removed outdated EXAMPLES.md and SIDEBAR-COMPONENT.md

Testing

  • mvn test passes locally
  • Core functionality manually verified
  • New features have test coverage
  • vue-tsc --noEmit type-check passes
  • vitest run (11/11) passes
  • 12-page visual verification via Playwright screenshots

Checklist

  • Database indexes: N/A (no DB changes)
  • Workspace isolation: N/A (no Service changes)
  • Error handling: N/A
  • Log format: N/A
  • Config security: no hardcoded passwords / API keys
  • XSS protection: v-html uses DOMPurify.sanitize

Related Issue

Closes #2

Screenshots (if applicable)

Screenshots are generated to logs/screenshots/ (11 pages). To capture:

cd eify-web && node screenshot-check.cjs

mikewoo and others added 29 commits May 23, 2026 15:16
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…AUDE.md

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…list

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
20 tasks across 4 batches, shared replacement rules, final verification.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Replaced #ffffff background with var(--eify-bg-base)
- Replaced #ffffff text color with var(--eify-text-inverse)
- Replaced font-size: 14px with .text-base utility class on buttons

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Replaced #ffffff backgrounds with var(--eify-bg-base)
- Replaced #ffffff text color with var(--eify-text-inverse)
- Replaced font-size: 14px with .text-base utility class on empty text

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Replaced color: #e11d48 with var(--eify-error)
- Replaced background: #f8fafc with var(--eify-bg-secondary)
- Replaced 8 font-size: Npx declarations with .text-* utility classes
- Preserved all existing var(--eify-*, fallback) patterns

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Replaced #ef4444, #fef2f2, #fecaca, #dc2626 with --eify-error* tokens
- Replaced hardcoded gradient with --eify-gradient-primary
- Replaced #1e293b with --eify-gray-800, #e2e8f0 with --eify-gray-200
- Added text-xl/text-sm utility classes for sidebar title and new-chat button

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Replaced #ffffff with var(--eify-bg-base) in card backgrounds
- Replaced gradient #6366f1/#8b5cf6 with var(--eify-gradient-primary)
- Replaced #fff text with var(--eify-text-inverse)
- Replaced #fef2f2/#fecaca with --eify-error-light/--eify-error-200
- Replaced #dc2626 with var(--eify-error-600)
- Replaced #f8fafc with var(--eify-bg-secondary)
- Replaced #1e293b with var(--eify-gray-800), #e2e8f0 with var(--eify-gray-200)

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Replaced #ffffff with var(--eify-bg-base) in card and tooltip backgrounds
- Replaced var(--eify-danger, #ef4444) with var(--eify-error) (--eify-danger does not exist)

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Replaced #ffffff with var(--eify-bg-base) in card, schema, and tooltip backgrounds
- Replaced var(--eify-danger) with var(--eify-error)
- Catppuccin theme colors (#1e1e2e, #a6e3a1, #f38ba8) in log viewer kept as exempt

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…sses

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…kflowCreate, NodePanel

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Fix start.sh extracting ${revision} literally instead of resolved version
- Add design system and visual regression testing docs to eify-web/README.md
- Add Playwright screenshot script for visual verification (screenshot-check.cjs)

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Consolidate code review checklist in CLAUDE.md, remove duplicated sections
- Move Flyway idempotent migration template to DATABASE.md with monitoring queries
- Add E2E-TESTING.md (Playwright patterns) and SECURITY.md (risk checklist)
- Remove outdated EXAMPLES.md and SIDEBAR-COMPONENT.md
- Add Playwright dependency for visual regression screenshots

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
@mikewoo mikewoo self-assigned this May 23, 2026
- CI workflow uses Node 22 (was 20) to match vue-i18n@11.x engine requirement
- Regenerate package-lock.json to resolve missing @emnapi dependencies

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
@mikewoo mikewoo merged commit c9de913 into main May 23, 2026
1 of 2 checks passed
@mikewoo mikewoo deleted the fix/design-md-compliance branch May 23, 2026 08:58
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