Files
community-rule/docs/guides/static-assets.md
T
adilalloandCursor 63e0f77998 Show both books on About with matching covers and downloads.
The section mixed Structure Before Crisis art with the Community Rules booklet; pairing each title to its own cover and PDF, and cropping the Figma cover padding, keeps the two cards consistent.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-25 16:18:40 -06:00

82 lines
4.1 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# Static assets (`public/`)
Convention for files served from `public/`. Path helpers live in
[`lib/assetUtils.ts`](../../lib/assetUtils.ts).
## Folder map
```
public/
assets/
icons/ # UI chrome (alert, close, help, pointer)
logos/ # Brand + social lockups
partners/ # Logo wall partner SVGs (kebab org slug)
marketing/ # Hero, feature panels, section numbers, avatars, banners, book cover
case-study/ # CaseStudy card SVG artwork (canonical)
shapes/ # Decorative ornaments (stats, quotes, unions, content shapes)
vector/ # Use-case group marks
template-mark/ # Governance template SVG marks
share/ # Share modal channel glyphs
content/
blog/ # Per-article SVG thumbnails (see content-creation.md)
```
## Icon sources (two systems)
| Location | Used for | Resolution |
| --- | --- | --- |
| `public/assets/icons/` | Static chrome served by URL (`icon-close.svg`, `icon-help.svg`) | `ASSETS.ICON_*` |
| `app/components/asset/icon/` | Bundled create-flow / nav SVGs imported by `Icon.tsx` | Webpack import, not `public/` |
Do not duplicate the same glyph in both places unless migrating between systems.
## Naming rules
- **Directories and filenames:** lowercase kebab-case only.
- **No** PascalCase folders (`Section/`, `Share/`) or Figma-export names
at the assets root (`Feature_Support.png`, `Icon_Alert.svg`).
- **Prefer** `lib/assetUtils.ts` helpers (`partnerLogoPath`,
`shareIconPath`, `featurePanelPath`, `ASSETS`, …) over hardcoded
`/assets/...` strings in components.
- **Blog art** stays under `public/content/blog/` with
`{slug}-vertical.svg`, `-horizontal.svg`, `-section.svg`, `-tag.svg`,
and `-ornament-right.png` / `-ornament-left.png` (body gutter shapes).
- **Favicon** reuses `assets/logos/community-rule.svg` (`ASSETS.LOGO` in
`app/layout.tsx` metadata) plus generated root binaries for Safari/iOS:
`public/favicon.ico`, `favicon-16x16.png`, `favicon-32x32.png`, and
`apple-touch-icon.png`. Regenerate after logo changes with
`npm run generate:favicons`. Do not place other static binaries under
`app/` — keep `app/` for routes, layouts, and styles only
(`globals.css`, `tailwind.css`).
## PNG files and `.gitignore`
`*.png` is listed in `.gitignore`, but marketing and partner PNGs remain
**git-tracked** from before that rule. New PNGs may need `git add -f` to
stage. Raster → SVG conversion is tracked in
[CR-25](https://linear.app/community-rule/issue/CR-25).
## PNG audit (handoff to CR-25)
| Path | Used by | Disposition |
| --- | --- | --- |
| `logos/partners/*.svg` (×6) | LogoWall | **Done** — SVG (kebab org slug, no `logo-` prefix) |
| `marketing/feature-*.svg` (×4) | FeatureGrid | Exported from Figma Section/Feature-Grid (18847:22410) |
| `marketing/section-number-*.svg` (×3) | SectionNumber | **Done** — SVG |
| `marketing/avatar-*.svg` (×3) | Avatar / ASSETS | **Done** — SVG |
| `marketing/hero-image.png` | HeroBanner | **Design review** — likely keep raster |
| `marketing/communityrules-cover.svg` | About / Book | **Done** — Structure Before Crisis cover (`ASSETS.STRUCTURE_BEFORE_CRISIS_COVER`; Figma **22137:891197**) |
| `marketing/community-rules-cover.png` | About / Book | **Done** — Community Rules (2021) cover (`ASSETS.COMMUNITY_RULES_COVER`; gitignore exception) |
| `marketing/governance-booklet.pdf` | About / Book | **Done** — Community Rules (2021) PDF (`governanceBookletPath()`) |
| `marketing/structure-before-crisis.pdf` | About / Book | **Done** — Structure Before Crisis (2025) PDF (`structureBeforeCrisisPath()`) |
| `logos/community-rule.svg` | Logo + favicon (`ASSETS.LOGO`) | **Done** — SVG |
| `share/*.svg` (×5) | Share modal | **Done** — SVG (`shareIconPath()`) |
| `logos/gitlab.svg` | Footer / social | **Done** — SVG |
## Related docs
- [figma-component-registry.md](../figma-component-registry.md) — Figma Asset
canvas ↔ `app/components/asset/` and `template-mark/` / `vector/`.
- [content-creation.md](./content-creation.md) — Blog SVG naming under
`public/content/blog/`.