Revamp header, home UX and components: icons, toasts, styles and compare UI

[chake111]

Motivation

• Modernize the top navigation and brand presentation with icons and a sticky header to improve discoverability and usability.
• Improve the home hero and search interaction by surfacing a richer input area, rotating placeholders and quick scene entry points for faster task discovery.
• Make the compare flow more visible and actionable by showing toasts on add and a persistent bottom compare entry for desktop and mobile.
• Polish visual design and Chinese support by updating color tokens and adding a Chinese font stack.

Description

• Updated ui/app/[locale]/layout.tsx to use lucide-react icons for nav items, render a sticky header with a branded link, and include the global <Toaster /> component.
• Modified ui/app/[locale]/page.tsx to refactor HomeHero usage, call toast when a tool is added to compare, and forward compareTools to the compare entry component.
• Reworked multiple home components: HomeHero now accepts inputArea and quickScenes; HomeQuickScenes adds icon mapping and updated button styles; SearchInput adds rotating placeholders, refined focus/suggestion UI, and style improvements; HomeResults gets an updated card layout, empty-state samples, ratings, favorite button and layout adjustments; HomeResultsFilters and HomeCompareEntry were reimplemented for accessibility, responsive bottom bar behavior, and visual improvements.
• Adjusted global styles in ui/app/globals.css to set --primary, --primary-foreground, --destructive, and --ring color tokens, and added a Chinese font fallback to body.

Testing

• Ran TypeScript type checking with tsc --noEmit, which completed successfully.
• Ran project linting with pnpm lint, which passed without errors.
• Executed the test suite with pnpm test, and all tests completed successfully.

---

Codex Task

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
ai-tool-picker	Ready	Preview, Comment	Apr 20, 2026 9:09am