UI testing agent / audit report

Generated 2026-09-29

Report with findings

Visual audit dashboard

A clear view of interface quality across Lennar Mortgage. Review findings, compare categories, and prepare the next fixes.

System details

`base-nova``lucide``app/globals.css`

What this run covered

Audit scope

The inspected files, visual rules, and steps behind this report.

Files inspected

31 files

app/lennar-mortgage
components/unlumen-ui

This audit covered Lennar Mortgage dashboard, preview, and shared mortgage-specific UI components only. Run `/ui-test` for the full project.

Checks in this run

Styling and Theme

3 findings

Theme tokens, color choices, spacing, typography, and conditional classes.

2 errors · 1 warnings

Layout and Composition

2 findings

Page rhythm and whether cards, badges, and other UI follow the shadcn baseline.

0 errors · 2 warnings

Forms and Controls

0 findings

Field structure, input adornments, option groups, states, and control sizing.

0 errors · 0 warnings

Files scanned

Included in this audit

Total findings

Issues requiring review

Errors

High-priority corrections

Warnings

Quality improvements

Severity mix

Distribution of errors and warnings.

Findings by category

Error and warning density across active audit categories.

Audit summary

A category-level view of scanned files and finding severity.

Category	Files	Errors	Warnings	Total
Styling and Theme	31	2	1	3
Layout and Composition	31	0	2	2
Forms and Controls	31	0	0	0
Total	31	2	3	5

Delivery queue

Jira-ready stories

Every finding is translated into a clear engineering story with rationale, acceptance criteria, and a paste-ready Jira payload.

ErrorSTYLE-01Styling and Theme

Raw Colors

app/lennar-mortgage/components/loan-item-card.tsx:32

Why it matters

Status and priority colors are hard-coded across cards and tables, bypassing the semantic theme tokens and creating inconsistent mappings for the same statuses.

View Jira payload

Summary: [STYLE-01] Raw Colors - app/lennar-mortgage/components/loan-item-card.tsx:32
Issue Type: Bug
Priority: High
Component: UI Audit
Labels: ui-test, shadcn, visual-consistency

Description:
The UI audit found a error in Styling and Theme.

File: app/lennar-mortgage/components/loan-item-card.tsx
Line: 32
Rule: [STYLE-01] Raw Colors
Severity: Error

Found:
"In Progress": "bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-400",

Expected shadcn-aligned pattern:
"In Progress": "bg-muted text-muted-foreground",

Why this matters:
Status and priority colors are hard-coded across cards and tables, bypassing the semantic theme tokens and creating inconsistent mappings for the same statuses.

Acceptance Criteria:
- Replace the violating pattern with the shadcn-aligned pattern.
- Keep styling on semantic tokens or component variants.
- Re-run /ui-test for the affected scope and confirm this finding is gone.

ErrorSTYLE-02Styling and Theme

Manual Dark Mode Colors

components/unlumen-ui/loan-stepper.tsx:93

Why it matters

Completion styling uses manually paired light and dark colors instead of theme driven semantic colors.

View Jira payload

Summary: [STYLE-02] Manual Dark Mode Colors - components/unlumen-ui/loan-stepper.tsx:93
Issue Type: Bug
Priority: High
Component: UI Audit
Labels: ui-test, shadcn, visual-consistency

Description:
The UI audit found a error in Styling and Theme.

File: components/unlumen-ui/loan-stepper.tsx
Line: 93
Rule: [STYLE-02] Manual Dark Mode Colors
Severity: Error

Found:
isCompleted && "border-green-500/30 bg-green-50/40 dark:bg-green-950/10",

Expected shadcn-aligned pattern:
isCompleted && "border-primary/30 bg-primary/5",

Why this matters:
Completion styling uses manually paired light and dark colors instead of theme driven semantic colors.

Acceptance Criteria:
- Replace the violating pattern with the shadcn-aligned pattern.
- Keep styling on semantic tokens or component variants.
- Re-run /ui-test for the affected scope and confirm this finding is gone.

WarningSTYLE-05Styling and Theme

Typography Overrides

app/lennar-mortgage/components/dashboard-chat-shell.tsx:125

Why it matters

The breadcrumb page overrides size, weight, and tracking in a shared shell, making its heading hierarchy depend on route-specific styling.

View Jira payload

Summary: [STYLE-05] Typography Overrides - app/lennar-mortgage/components/dashboard-chat-shell.tsx:125
Issue Type: Bug
Priority: Medium
Component: UI Audit
Labels: ui-test, shadcn, visual-consistency

Description:
The UI audit found a warning in Styling and Theme.

File: app/lennar-mortgage/components/dashboard-chat-shell.tsx
Line: 125
Rule: [STYLE-05] Typography Overrides
Severity: Warning

Found:
"text-[15px] font-semibold tracking-[-0.01em] text-foreground",

Expected shadcn-aligned pattern:
"font-medium text-foreground",

Why this matters:
The breadcrumb page overrides size, weight, and tracking in a shared shell, making its heading hierarchy depend on route-specific styling.

Acceptance Criteria:
- Replace the violating pattern with the shadcn-aligned pattern.
- Keep styling on semantic tokens or component variants.
- Re-run /ui-test for the affected scope and confirm this finding is gone.

WarningCOMP-02Layout and Composition

Custom Badges

app/lennar-mortgage/components/app-sidebar.tsx:379

Why it matters

The notification count recreates badge styling with a raw span and a fixed red palette, which can drift from the project's badge variants and theme.

View Jira payload

Summary: [COMP-02] Custom Badges - app/lennar-mortgage/components/app-sidebar.tsx:379
Issue Type: Bug
Priority: Medium
Component: UI Audit
Labels: ui-test, shadcn, visual-consistency

Description:
The UI audit found a warning in Layout and Composition.

File: app/lennar-mortgage/components/app-sidebar.tsx
Line: 379
Rule: [COMP-02] Custom Badges
Severity: Warning

Found:
<span className="... rounded-full ... bg-red-500 ... text-white">

Expected shadcn-aligned pattern:
<Badge variant="destructive">{notifications.length}</Badge>

Why this matters:
The notification count recreates badge styling with a raw span and a fixed red palette, which can drift from the project's badge variants and theme.

Acceptance Criteria:
- Replace the violating pattern with the shadcn-aligned pattern.
- Keep styling on semantic tokens or component variants.
- Re-run /ui-test for the affected scope and confirm this finding is gone.

WarningCOMP-10Layout and Composition

Layout Density and Alignment

components/unlumen-ui/pinned-list.tsx:364

Why it matters

The pinned-list heading uses several arbitrary typography values while adjacent dashboard components use the shared type scale, which can make the header feel visually detached.

View Jira payload

Summary: [COMP-10] Layout Density and Alignment - components/unlumen-ui/pinned-list.tsx:364
Issue Type: Bug
Priority: Medium
Component: UI Audit
Labels: ui-test, shadcn, visual-consistency

Description:
The UI audit found a warning in Layout and Composition.

File: components/unlumen-ui/pinned-list.tsx
Line: 364
Rule: [COMP-10] Layout Density and Alignment
Severity: Warning

Found:
<h1 className="font-bricolage text-[2.125rem] leading-[1.15] font-semibold tracking-[-0.04em] text-foreground">

Expected shadcn-aligned pattern:
<h1 className="text-3xl font-semibold tracking-tight text-foreground">

Why this matters:
The pinned-list heading uses several arbitrary typography values while adjacent dashboard components use the shared type scale, which can make the header feel visually detached.

Acceptance Criteria:
- Replace the violating pattern with the shadcn-aligned pattern.
- Keep styling on semantic tokens or component variants.
- Re-run /ui-test for the affected scope and confirm this finding is gone.