# Logo-led Home/About comp: implementation map

Status: Home/About visual direction approved by the owner on 2026-09-25. [Home](d-logo-led-home.html) and [About](d-logo-led-about.html) are static review comps. They use the association's current logo, its sampled teal `#28626E`, pale gold `#F9E697`, and charcoal `#313332`. The event posters are copies of existing backend media. Blog titles and artwork in the Home comp are explicitly illustrative.

The frontend already has Shadcn/ui source components under `src/components/ui/` and `lucide-react`. Production implementation should compose those local components with theme tokens, not copy this comp's static HTML or inline SVG sprite:

| Comp element | Frontend composition |
| --- | --- |
| Primary/secondary action | `Button` with `asChild`, `variant="default"` or `variant="outline"`, and the app's `Link`. Use semantic theme tokens for the logo palette. |
| Event/post preview | `Card`, `CardHeader`, `CardTitle`, `CardDescription`, `CardContent`, `CardFooter`; image from event/blog domain record. |
| Archive/category label | `Badge` with `secondary` or `outline` variant. |
| Footer and article dividers | `Separator` where a semantic divider helps. |
| Mobile navigation | Existing `MobileBottomNav` pattern, adjusted for brand tokens and content clearance. |
| Icons | Existing `lucide-react`: `ArrowUpLeft`, `CalendarDays`, `BookOpen`, `Newspaper`, `GraduationCap`, `UsersRound`, `Mail`, `Send`, `Instagram`. The comp's SVG sprite uses their icon paths. |

Home order is fixed: association intro → featured events → featured blog posts → participation CTA → footer. The CMS supplies intro/CTA and shared identity/contact copy. The event and blog sections read their existing APIs. The events model currently has no editorial `is_featured` flag; proposed first pass selects the next three published future events, then clearly labeled recent archive items if none are upcoming. Blog has `is_featured`; proposed first pass selects published featured posts, then recent published posts as fallback. Dates, prices, capacity, and registration status must come from each event record at render time, never from the static comp. A later owner decision can add manual curation if needed.

The comp is the approved visual and structural direction for T04. T05 CMS/API contract approval remains open; no production Home/About route or business rule changed.