Skip to content

Replace home-page emoji icons and stack mobile nav buttons - #65

Merged
OwenTanzer merged 1 commit into
mainfrom
claude/next-stage-project-status-m163fn
Jul 22, 2026
Merged

Replace home-page emoji icons and stack mobile nav buttons#65
OwenTanzer merged 1 commit into
mainfrom
claude/next-stage-project-status-m163fn

Conversation

@OwenTanzer

Copy link
Copy Markdown
Owner

Summary

  • Replace the ad-hoc emoji used across the home page (trainer/dog avatar placeholders, Red Flags/My Folders nav buttons, pinned-folder heading, and the four "Your Dogs" stat tiles) with lucide-react icons, so the interface graphics read as one consistent system instead of a grab-bag of platform emoji.
  • Stack the Red Flags / My Folders nav buttons vertically on mobile (flex-col sm:flex-row) so Folders sits below Red Flags instead of squeezing onto one row.
  • Adds lucide-react as a dependency (tree-shakeable — only the ~8 icons actually used are bundled; production gzip size grew by ~2 kB).

Why

Issue #54 asks for a selective aesthetic pass on the home page: a consistent icon system in place of emoji, and a more balanced mobile nav layout with Folders below Red Flags. The third bullet — removing the "look back at your training career" copy — was already handled in #64. Together these close out #54's concrete scope; #15 (the guide-dog illustration) remains separate as noted in the issue.

Validation

  • npm run build — production TypeScript and Vite build passed
  • npm test — 28 tests passed
  • npm run lint — passed with the same 3 pre-existing warnings as main (unrelated to this change)

Note: this app's login flow depends on a deployed Cloudflare Worker backend that isn't reachable from this sandbox, so I wasn't able to do a full logged-in visual pass in a live browser — verification here is build/lint/test plus manual review of the JSX. Worth a quick look on your end before merging.

Closes #54


Generated by Claude Code

Swap the ad-hoc emoji used across the trainer dashboard (avatar
placeholders, nav buttons, section headings, stat tiles) for
lucide-react icons so the interface graphics read as one system
instead of a grab-bag of platform emoji. Also stack the Red
Flags/My Folders nav buttons vertically on mobile so Folders sits
below Red Flags instead of squeezing onto one row.

Part of #54
@OwenTanzer
OwenTanzer merged commit dbbff9e into main Jul 22, 2026
1 check passed
@OwenTanzer
OwenTanzer deleted the claude/next-stage-project-status-m163fn branch July 22, 2026 22:00
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.

Aesthetic Overhaul

2 participants