Give Avatar initials, person-mark, and load-error fallbacks so missing photos still look like the design-system atom.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-26 13:18:33 -06:00
parent 95781452bd
commit 4c4cf99572
6 changed files with 395 additions and 29 deletions
@@ -202,7 +202,7 @@ Full folder map and PNG audit: **[guides/static-assets.md](./guides/static-asset
 - **`public/assets/`** — lowercase kebab-case folders: **`icons/`**, **`logos/`** (incl. **`logos/partners/`**), **`marketing/`**, **`case-study/`**, **`shapes/`**, **`vector/`**, **`template-mark/`**, **`share/`**. Use helpers in **`lib/assetUtils.ts`** (`ASSETS`, `partnerLogoPath`, `vectorMarkPath`, …).
 - **`public/assets/vector/<slug>.svg`** — Figma Asset / Vector marks (same kebab **`slug`** convention as **`public/assets/template-mark/`**). Use **`vectorMarkPath(slug)`**.
 - **`asset/Logo`** — Community Rule **`Logo`** component (folder PascalCase, like **`Avatar/`**); brand SVG at **`public/assets/logos/community-rule.svg`**.
- **`asset/Avatar`** + **`asset/AvatarContainer`** — paired circular image stacks (e.g. top nav). Fuller DS Avatar behavior (**initials**, upload routing, …) tracked as **[CR-58](https://linear.app/community-rule/issue/CR-58)**.
+- **`asset/Avatar`** + **`asset/AvatarContainer`** — circular (or rounded-square) image with initials / person-mark fallback; `AvatarContainer` stacks them (e.g. top nav).
 - **`asset/Shapes/`** — decorative blobs for **`cards/Stat`** and About header inline art (Figma **Shapes**); static files under **`public/assets/shapes/`**.

 *Update this when you add a new top-level `app/components/*` package or a new Figma canvas.*