Replace home-page emoji icons and stack mobile nav buttons - #65
Merged
Conversation
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
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
lucide-reacticons, so the interface graphics read as one consistent system instead of a grab-bag of platform emoji.flex-col sm:flex-row) so Folders sits below Red Flags instead of squeezing onto one row.lucide-reactas 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 passednpm test— 28 tests passednpm run lint— passed with the same 3 pre-existing warnings asmain(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