diff --git a/app/(app)/create/components/CustomMethodCardFieldBlocksSummary.tsx b/app/(app)/create/components/CustomMethodCardFieldBlocksSummary.tsx index bb1c53e..3585f54 100644 --- a/app/(app)/create/components/CustomMethodCardFieldBlocksSummary.tsx +++ b/app/(app)/create/components/CustomMethodCardFieldBlocksSummary.tsx @@ -15,7 +15,7 @@ import { useMessages, useTranslation } from "../../../contexts/MessagesContext"; import Chip from "../../../components/controls/Chip"; import IncrementerBlock from "../../../components/controls/IncrementerBlock"; import Upload from "../../../components/controls/Upload"; -import { getAssetPath } from "../../../../lib/assetUtils"; +import { ASSETS, getAssetPath } from "../../../../lib/assetUtils"; import ApplicableScopeField from "./ApplicableScopeField"; import InputLabel from "../../../components/type/InputLabel"; import type { CustomMethodCardFieldBlock } from "../../../../lib/create/customMethodCardFieldBlocks"; @@ -139,7 +139,7 @@ function CustomMethodCardUploadBlockRow({ > {/* eslint-disable-next-line @next/next/no-img-element -- matches ModalHeader close control */} {/* eslint-disable-next-line @next/next/no-img-element -- matches ModalHeader close control */} {/* eslint-disable-next-line @next/next/no-img-element -- matches ModalHeader close control */} = { @@ -12,9 +13,9 @@ const SURFACE_CLASS: Record = { /** Default art per tile: Figma-exported SVG composites (305×305 incl. rounded bg). */ const SURFACE_ART: Record = { - lavender: "/assets/case-study/case-study-mutual-aid.svg", - neutral: "/assets/case-study/case-study-food-not-bombs.svg", - rose: "/assets/case-study/case-study-boulder-county-street-medics.svg", + lavender: getAssetPath(caseStudyVisualPath("lavender")), + neutral: getAssetPath(caseStudyVisualPath("neutral")), + rose: getAssetPath(caseStudyVisualPath("rose")), }; /** Figma: ~23px corner (“Card / CaseStudy” shells). */ diff --git a/app/components/modals/ModalHeader/ModalHeader.view.tsx b/app/components/modals/ModalHeader/ModalHeader.view.tsx index 6ad6597..29aedd4 100644 --- a/app/components/modals/ModalHeader/ModalHeader.view.tsx +++ b/app/components/modals/ModalHeader/ModalHeader.view.tsx @@ -1,6 +1,6 @@ import ListItem from "../../layout/ListItem"; import Popover from "../Popover"; -import { getAssetPath } from "../../../../lib/assetUtils"; +import { ASSETS, getAssetPath } from "../../../../lib/assetUtils"; import type { ModalHeaderProps } from "./ModalHeader.types"; const iconButtonClass = @@ -37,7 +37,7 @@ export function ModalHeaderView({ > {/* eslint-disable-next-line @next/next/no-img-element -- icon asset */} } + icon={} /> } + icon={} /> } + icon={} /> } + icon={} /> } + icon={} /> diff --git a/app/components/navigation/Top/Top.container.tsx b/app/components/navigation/Top/Top.container.tsx index d20f57a..cd55ca3 100644 --- a/app/components/navigation/Top/Top.container.tsx +++ b/app/components/navigation/Top/Top.container.tsx @@ -25,9 +25,9 @@ const NAV_SIZE_TO_MENU_ITEM_SIZE: Record = { }; export const avatarImages = [ - { src: getAssetPath(ASSETS.AVATAR_1), alt: "Avatar 1" }, - { src: getAssetPath(ASSETS.AVATAR_2), alt: "Avatar 2" }, { src: getAssetPath(ASSETS.AVATAR_3), alt: "Avatar 3" }, + { src: getAssetPath(ASSETS.AVATAR_2), alt: "Avatar 2" }, + { src: getAssetPath(ASSETS.AVATAR_1), alt: "Avatar 1" }, ]; const TopContainer = memo( diff --git a/app/components/navigation/Top/Top.view.tsx b/app/components/navigation/Top/Top.view.tsx index c6f11fd..35cfa90 100644 --- a/app/components/navigation/Top/Top.view.tsx +++ b/app/components/navigation/Top/Top.view.tsx @@ -3,7 +3,7 @@ import { memo } from "react"; import Script from "next/script"; import { useTranslation } from "../../../contexts/MessagesContext"; -import { getAssetPath } from "../../../../lib/assetUtils"; +import { ASSETS, getAssetPath } from "../../../../lib/assetUtils"; import Menu from "../Menu"; import type { TopViewProps } from "./Top.types"; @@ -61,21 +61,21 @@ function TopView({ {/* Decorative Union images for tab appearance */} {/* eslint-disable-next-line @next/next/no-img-element -- decorative SVG, not content */} {/* eslint-disable-next-line @next/next/no-img-element -- decorative SVG */} {/* eslint-disable-next-line @next/next/no-img-element -- decorative SVG */} ( return contentBlogHorizontalPath(blogPost.slug); } - return getAssetPath("assets/Content_Banner.svg"); + return getAssetPath(ASSETS.CONTENT_BANNER); }; const resolveSectionImage = (blogPost: BlogPost): string => { diff --git a/app/components/sections/FeatureGrid/FeatureGrid.container.tsx b/app/components/sections/FeatureGrid/FeatureGrid.container.tsx index bb46bbc..0ebcc0a 100644 --- a/app/components/sections/FeatureGrid/FeatureGrid.container.tsx +++ b/app/components/sections/FeatureGrid/FeatureGrid.container.tsx @@ -1,6 +1,7 @@ "use client"; import { memo, useMemo } from "react"; +import { getAssetPath, featurePanelPath } from "../../../../lib/assetUtils"; import { useTranslation } from "../../../contexts/MessagesContext"; import FeatureGridView from "./FeatureGrid.view"; import type { FeatureGridProps, Feature } from "./FeatureGrid.types"; @@ -19,7 +20,7 @@ const FeatureGridContainer = memo( labelLine2: t( "pages.home.featureGrid.features.decisionMaking.labelLine2", ), - panelContent: "/assets/Feature_Support.png", + panelContent: getAssetPath(featurePanelPath("support")), ariaLabel: t("featureGrid.features.decisionMaking.ariaLabel"), href: "#decision-making", }, @@ -31,7 +32,7 @@ const FeatureGridContainer = memo( labelLine2: t( "pages.home.featureGrid.features.valuesAlignment.labelLine2", ), - panelContent: "/assets/Feature_Exercises.png", + panelContent: getAssetPath(featurePanelPath("exercises")), ariaLabel: t("featureGrid.features.valuesAlignment.ariaLabel"), href: "#values-alignment", }, @@ -43,7 +44,7 @@ const FeatureGridContainer = memo( labelLine2: t( "pages.home.featureGrid.features.membershipGuidance.labelLine2", ), - panelContent: "/assets/Feature_Guidance.png", + panelContent: getAssetPath(featurePanelPath("guidance")), ariaLabel: t("featureGrid.features.membershipGuidance.ariaLabel"), href: "#membership-guidance", }, @@ -55,7 +56,7 @@ const FeatureGridContainer = memo( labelLine2: t( "pages.home.featureGrid.features.conflictResolution.labelLine2", ), - panelContent: "/assets/Feature_Tools.png", + panelContent: getAssetPath(featurePanelPath("tools")), ariaLabel: t("featureGrid.features.conflictResolution.ariaLabel"), href: "#conflict-resolution", }, diff --git a/app/components/sections/HeroBanner/HeroBanner.tsx b/app/components/sections/HeroBanner/HeroBanner.tsx index f415731..70cecc6 100644 --- a/app/components/sections/HeroBanner/HeroBanner.tsx +++ b/app/components/sections/HeroBanner/HeroBanner.tsx @@ -4,7 +4,7 @@ import { memo } from "react"; import { useTranslation } from "../../../contexts/MessagesContext"; import ContentLockup from "../../type/ContentLockup"; import HeroDecor from "./HeroDecor"; -import { getAssetPath } from "../../../../lib/assetUtils"; +import { ASSETS, getAssetPath } from "../../../../lib/assetUtils"; interface HeroBannerProps { title?: string; @@ -48,7 +48,7 @@ const HeroBanner = memo(
{/* eslint-disable-next-line @next/next/no-img-element -- dynamic path from getAssetPath */} {imageAlt}( quoteSecondary, author = "Jo Freeman", source = "The Tyranny of Structurelessness", - avatarSrc = "/assets/Quote_Avatar.svg", + avatarSrc = getAssetPath(ASSETS.QUOTE_AVATAR), id, - fallbackAvatarSrc = "/assets/Quote_Avatar.svg", + fallbackAvatarSrc = getAssetPath(ASSETS.QUOTE_AVATAR), onError, }) => { const [imageError, setImageError] = useState(false); diff --git a/app/components/sections/SectionNumber.tsx b/app/components/sections/SectionNumber.tsx index 5c687e1..2cf6c96 100644 --- a/app/components/sections/SectionNumber.tsx +++ b/app/components/sections/SectionNumber.tsx @@ -1,7 +1,7 @@ "use client"; import { memo } from "react"; -import { getAssetPath } from "../../../lib/assetUtils"; +import { getAssetPath, sectionNumberPath } from "../../../lib/assetUtils"; interface SectionNumberProps { number: number; @@ -9,19 +9,8 @@ interface SectionNumberProps { const SectionNumber = memo(({ number }) => { const getImageSrc = (num: number): string => { - const assetPath = (() => { - switch (num) { - case 1: - return "assets/SectionNumber_1.png"; - case 2: - return "assets/SectionNumber_2.png"; - case 3: - return "assets/SectionNumber_3.png"; - default: - return "assets/SectionNumber_1.png"; - } - })(); - return getAssetPath(assetPath); + const n = num === 2 || num === 3 ? num : 1; + return getAssetPath(sectionNumberPath(n)); }; return ( diff --git a/app/components/type/ContentLockup/ContentLockup.view.tsx b/app/components/type/ContentLockup/ContentLockup.view.tsx index 614fd33..845ab2b 100644 --- a/app/components/type/ContentLockup/ContentLockup.view.tsx +++ b/app/components/type/ContentLockup/ContentLockup.view.tsx @@ -75,7 +75,7 @@ function ContentLockupView({ <> {/* eslint-disable-next-line @next/next/no-img-element -- decorative shape SVG */} .svg`** — Figma Asset / Vector marks (same kebab **`slug`** convention as **`public/assets/template-mark/`**). Use **`vectorMarkPath(slug)`** in **`lib/assetUtils.ts`**. -- **`asset/Logo`** — Community Rule **`Logo`** component (folder PascalCase, like **`Avatar/`**). +- **`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/.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/Shapes/`** — decorative blobs for **`cards/Stat`** and About header inline art (Figma **Shapes**). +- **`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.* diff --git a/docs/guides/static-assets.md b/docs/guides/static-assets.md new file mode 100644 index 0000000..910a1b0 --- /dev/null +++ b/docs/guides/static-assets.md @@ -0,0 +1,58 @@ +# 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 PNGs + 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) +``` + +## 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`. + +## 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-*.png` (×4) | FeatureGrid | **Design review** — convert if vector in Figma, else keep raster | +| `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 | +| `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/`. diff --git a/lib/assetUtils.ts b/lib/assetUtils.ts index 9fb0a76..322ce53 100644 --- a/lib/assetUtils.ts +++ b/lib/assetUtils.ts @@ -2,11 +2,13 @@ * Asset path utilities for handling different environments * - Web app: uses absolute paths starting with / * - Storybook: uses relative paths for proper asset resolution + * + * Folder map: `docs/guides/static-assets.md` */ /** * Get the correct asset path based on environment - * @param assetPath - The asset path (e.g., "assets/Logo.svg") + * @param assetPath - The asset path (e.g., "assets/logos/community-rule.svg") * @returns The correct path for the current environment */ export function getAssetPath(assetPath: string): string { @@ -68,6 +70,43 @@ export function guideBannerLogoArrowPath(): string { return "assets/shapes/guide-banner-logo-arrow.svg"; } +/** Partner logo wall SVGs in `public/assets/logos/partners/`. */ +export function partnerLogoPath(slug: string): string { + return `assets/logos/partners/${slug}.svg`; +} + +/** Share modal glyphs in `public/assets/share/`. */ +export type ShareIconName = "discord" | "link" | "mail" | "signal" | "slack"; + +export function shareIconPath(name: ShareIconName): string { + return `assets/share/${name}.svg`; +} + +/** Section number badges in `public/assets/marketing/`. */ +export function sectionNumberPath(n: 1 | 2 | 3): string { + return `assets/marketing/section-number-${n}.svg`; +} + +/** Home feature grid panel art in `public/assets/marketing/`. */ +export type FeaturePanelKey = "support" | "exercises" | "guidance" | "tools"; + +export function featurePanelPath(key: FeaturePanelKey): string { + return `assets/marketing/feature-${key}.png`; +} + +/** Case study card artwork in `public/assets/case-study/`. */ +export type CaseStudyVisualKey = "lavender" | "neutral" | "rose"; + +const CASE_STUDY_VISUAL_PATHS: Record = { + lavender: "assets/case-study/case-study-mutual-aid.svg", + neutral: "assets/case-study/case-study-food-not-bombs.svg", + rose: "assets/case-study/case-study-boulder-county-street-medics.svg", +}; + +export function caseStudyVisualPath(key: CaseStudyVisualKey): string { + return CASE_STUDY_VISUAL_PATHS[key]; +} + /** Per-article thumbnail backgrounds in `public/content/blog/` (Figma Thumbnail 19428:22574). */ export function contentBlogVerticalPath(slug: string): string { return `/content/blog/${slug}-vertical.svg`; @@ -120,32 +159,42 @@ export function contentCatalogSlugForFallback( * Asset paths for common components */ export const ASSETS = { - // Logo - LOGO: "assets/logo/Logo.svg", + // Brand logo + LOGO: "assets/logos/community-rule.svg", // Avatars - AVATAR_1: "assets/Avatar_1.png", - AVATAR_2: "assets/Avatar_2.png", - AVATAR_3: "assets/Avatar_3.png", + AVATAR_1: "assets/marketing/avatar-1.svg", + AVATAR_2: "assets/marketing/avatar-2.svg", + AVATAR_3: "assets/marketing/avatar-3.svg", // Social media - BLUESKY_LOGO: "assets/Bluesky_Logo.svg", - GITLAB_ICON: "assets/GitLab_Icon.png", + BLUESKY_LOGO: "assets/logos/bluesky.svg", + GITLAB_ICON: "assets/logos/gitlab.svg", // Content page decorative shapes - CONTENT_SHAPE_1: "assets/Content_Shape_1.svg", - CONTENT_SHAPE_2: "assets/Content_Shape_2.svg", + CONTENT_SHAPE_1: "assets/shapes/content-shape-1.svg", + CONTENT_SHAPE_2: "assets/shapes/content-shape-2.svg", + + /** Default ContentBanner background when no article-specific art. */ + CONTENT_BANNER: "assets/marketing/content-banner.svg", + + /** Quote block default avatar. */ + QUOTE_AVATAR: "assets/marketing/quote-avatar.svg", /** Sections / Book cover (Figma **22137:891197**). */ - COMMUNITYRULES_COVER: "assets/communityrules-cover.svg", + COMMUNITYRULES_COVER: "assets/marketing/communityrules-cover.svg", - // Alert icons - ICON_ALERT: "assets/Icon_Alert.svg", - ICON_CLOSE: "assets/Icon_Close.svg", + // Marketing + HERO_IMAGE: "assets/marketing/hero-image.png", - // Tooltip icons - ICON_POINTER: "assets/Icon_Pointer.svg", + // Top nav union ornaments + UNION_XSM: "assets/shapes/union-xsm.svg", + UNION_SM_MD_LG: "assets/shapes/union-sm-md-lg.svg", + UNION_XLG: "assets/shapes/union-xlg.svg", - // Help icon - ICON_HELP: "assets/Icon_Help.svg", + // Alert / UI icons + ICON_ALERT: "assets/icons/icon-alert.svg", + ICON_CLOSE: "assets/icons/icon-close.svg", + ICON_POINTER: "assets/icons/icon-pointer.svg", + ICON_HELP: "assets/icons/icon-help.svg", } as const; diff --git a/public/assets/Avatar_1.png b/public/assets/Avatar_1.png deleted file mode 100644 index 30ab710..0000000 Binary files a/public/assets/Avatar_1.png and /dev/null differ diff --git a/public/assets/Avatar_2.png b/public/assets/Avatar_2.png deleted file mode 100644 index 2127a01..0000000 Binary files a/public/assets/Avatar_2.png and /dev/null differ diff --git a/public/assets/Avatar_3.png b/public/assets/Avatar_3.png deleted file mode 100644 index bcb56a6..0000000 Binary files a/public/assets/Avatar_3.png and /dev/null differ diff --git a/public/assets/Feature_Support.svg b/public/assets/Feature_Support.svg deleted file mode 100644 index 185289b..0000000 --- a/public/assets/Feature_Support.svg +++ /dev/null @@ -1,57 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - diff --git a/public/assets/GitLab_Icon.png b/public/assets/GitLab_Icon.png deleted file mode 100644 index 94f6502..0000000 Binary files a/public/assets/GitLab_Icon.png and /dev/null differ diff --git a/public/assets/Section/Logo_CUBoulder.png b/public/assets/Section/Logo_CUBoulder.png deleted file mode 100644 index 7802cbf..0000000 Binary files a/public/assets/Section/Logo_CUBoulder.png and /dev/null differ diff --git a/public/assets/Section/Logo_FoodNotBombs.png b/public/assets/Section/Logo_FoodNotBombs.png deleted file mode 100644 index b7e1369..0000000 Binary files a/public/assets/Section/Logo_FoodNotBombs.png and /dev/null differ diff --git a/public/assets/Section/Logo_Metagov.png b/public/assets/Section/Logo_Metagov.png deleted file mode 100644 index f1e0816..0000000 Binary files a/public/assets/Section/Logo_Metagov.png and /dev/null differ diff --git a/public/assets/Section/Logo_MutualAidCO.png b/public/assets/Section/Logo_MutualAidCO.png deleted file mode 100644 index 43ec89e..0000000 Binary files a/public/assets/Section/Logo_MutualAidCO.png and /dev/null differ diff --git a/public/assets/Section/Logo_OpenCivics.png b/public/assets/Section/Logo_OpenCivics.png deleted file mode 100644 index 7ac21a2..0000000 Binary files a/public/assets/Section/Logo_OpenCivics.png and /dev/null differ diff --git a/public/assets/Section/Logo_StartCOOP.png b/public/assets/Section/Logo_StartCOOP.png deleted file mode 100644 index 9e67a1a..0000000 Binary files a/public/assets/Section/Logo_StartCOOP.png and /dev/null differ diff --git a/public/assets/SectionNumber_1.png b/public/assets/SectionNumber_1.png deleted file mode 100644 index b92a9ff..0000000 Binary files a/public/assets/SectionNumber_1.png and /dev/null differ diff --git a/public/assets/SectionNumber_2.png b/public/assets/SectionNumber_2.png deleted file mode 100644 index 6011769..0000000 Binary files a/public/assets/SectionNumber_2.png and /dev/null differ diff --git a/public/assets/SectionNumber_3.png b/public/assets/SectionNumber_3.png deleted file mode 100644 index 2b37cd2..0000000 Binary files a/public/assets/SectionNumber_3.png and /dev/null differ diff --git a/public/assets/Union_xlg.svg b/public/assets/Union_xlg.svg deleted file mode 100644 index 3d996ec..0000000 --- a/public/assets/Union_xlg.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/public/assets/Icon_Alert.svg b/public/assets/icons/icon-alert.svg similarity index 100% rename from public/assets/Icon_Alert.svg rename to public/assets/icons/icon-alert.svg diff --git a/public/assets/Icon_Close.svg b/public/assets/icons/icon-close.svg similarity index 100% rename from public/assets/Icon_Close.svg rename to public/assets/icons/icon-close.svg diff --git a/public/assets/Icon_Help.svg b/public/assets/icons/icon-help.svg similarity index 100% rename from public/assets/Icon_Help.svg rename to public/assets/icons/icon-help.svg diff --git a/public/assets/Icon_Pointer.svg b/public/assets/icons/icon-pointer.svg similarity index 100% rename from public/assets/Icon_Pointer.svg rename to public/assets/icons/icon-pointer.svg diff --git a/public/assets/Bluesky_Logo.svg b/public/assets/logos/bluesky.svg similarity index 100% rename from public/assets/Bluesky_Logo.svg rename to public/assets/logos/bluesky.svg diff --git a/public/assets/logo/Logo.svg b/public/assets/logos/community-rule.svg similarity index 100% rename from public/assets/logo/Logo.svg rename to public/assets/logos/community-rule.svg diff --git a/public/assets/logos/gitlab.svg b/public/assets/logos/gitlab.svg new file mode 100644 index 0000000..f6ee03a --- /dev/null +++ b/public/assets/logos/gitlab.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/assets/logos/partners/cu-boulder.svg b/public/assets/logos/partners/cu-boulder.svg new file mode 100644 index 0000000..593a4f3 --- /dev/null +++ b/public/assets/logos/partners/cu-boulder.svg @@ -0,0 +1,33 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/assets/logos/partners/food-not-bombs.svg b/public/assets/logos/partners/food-not-bombs.svg new file mode 100644 index 0000000..ff78ac3 --- /dev/null +++ b/public/assets/logos/partners/food-not-bombs.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/public/assets/logos/partners/metagov.svg b/public/assets/logos/partners/metagov.svg new file mode 100644 index 0000000..c54a241 --- /dev/null +++ b/public/assets/logos/partners/metagov.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/assets/logos/partners/mutual-aid-co.svg b/public/assets/logos/partners/mutual-aid-co.svg new file mode 100644 index 0000000..67d565b --- /dev/null +++ b/public/assets/logos/partners/mutual-aid-co.svg @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/assets/logos/partners/open-civics.svg b/public/assets/logos/partners/open-civics.svg new file mode 100644 index 0000000..4f3dd48 --- /dev/null +++ b/public/assets/logos/partners/open-civics.svg @@ -0,0 +1,75 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/assets/logos/partners/start-coop.svg b/public/assets/logos/partners/start-coop.svg new file mode 100644 index 0000000..3d110bd --- /dev/null +++ b/public/assets/logos/partners/start-coop.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/assets/marketing/avatar-1.svg b/public/assets/marketing/avatar-1.svg new file mode 100644 index 0000000..c9e9294 --- /dev/null +++ b/public/assets/marketing/avatar-1.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/public/assets/marketing/avatar-2.svg b/public/assets/marketing/avatar-2.svg new file mode 100644 index 0000000..44a58d4 --- /dev/null +++ b/public/assets/marketing/avatar-2.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/public/assets/marketing/avatar-3.svg b/public/assets/marketing/avatar-3.svg new file mode 100644 index 0000000..4c056bf --- /dev/null +++ b/public/assets/marketing/avatar-3.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/public/assets/communityrules-cover.svg b/public/assets/marketing/communityrules-cover.svg similarity index 100% rename from public/assets/communityrules-cover.svg rename to public/assets/marketing/communityrules-cover.svg diff --git a/public/assets/Content_Banner.svg b/public/assets/marketing/content-banner.svg similarity index 100% rename from public/assets/Content_Banner.svg rename to public/assets/marketing/content-banner.svg diff --git a/public/assets/Feature_Exercises.png b/public/assets/marketing/feature-exercises.png similarity index 100% rename from public/assets/Feature_Exercises.png rename to public/assets/marketing/feature-exercises.png diff --git a/public/assets/Feature_Guidance.png b/public/assets/marketing/feature-guidance.png similarity index 100% rename from public/assets/Feature_Guidance.png rename to public/assets/marketing/feature-guidance.png diff --git a/public/assets/Feature_Support.png b/public/assets/marketing/feature-support.png similarity index 100% rename from public/assets/Feature_Support.png rename to public/assets/marketing/feature-support.png diff --git a/public/assets/Feature_Tools.png b/public/assets/marketing/feature-tools.png similarity index 100% rename from public/assets/Feature_Tools.png rename to public/assets/marketing/feature-tools.png diff --git a/public/assets/HeroImage.png b/public/assets/marketing/hero-image.png similarity index 100% rename from public/assets/HeroImage.png rename to public/assets/marketing/hero-image.png diff --git a/public/assets/Quote_Avatar.svg b/public/assets/marketing/quote-avatar.svg similarity index 100% rename from public/assets/Quote_Avatar.svg rename to public/assets/marketing/quote-avatar.svg diff --git a/public/assets/marketing/section-number-1.svg b/public/assets/marketing/section-number-1.svg new file mode 100644 index 0000000..604997a --- /dev/null +++ b/public/assets/marketing/section-number-1.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/assets/marketing/section-number-2.svg b/public/assets/marketing/section-number-2.svg new file mode 100644 index 0000000..bbec904 --- /dev/null +++ b/public/assets/marketing/section-number-2.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/assets/marketing/section-number-3.svg b/public/assets/marketing/section-number-3.svg new file mode 100644 index 0000000..a913b7e --- /dev/null +++ b/public/assets/marketing/section-number-3.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/assets/Content_Shape_1.svg b/public/assets/shapes/content-shape-1.svg similarity index 100% rename from public/assets/Content_Shape_1.svg rename to public/assets/shapes/content-shape-1.svg diff --git a/public/assets/Content_Shape_2.svg b/public/assets/shapes/content-shape-2.svg similarity index 100% rename from public/assets/Content_Shape_2.svg rename to public/assets/shapes/content-shape-2.svg diff --git a/public/assets/Shapes_1.svg b/public/assets/shapes/shapes-1.svg similarity index 100% rename from public/assets/Shapes_1.svg rename to public/assets/shapes/shapes-1.svg diff --git a/public/assets/Union_sm_md_lg.svg b/public/assets/shapes/union-sm-md-lg.svg similarity index 100% rename from public/assets/Union_sm_md_lg.svg rename to public/assets/shapes/union-sm-md-lg.svg diff --git a/public/assets/Union.svg b/public/assets/shapes/union-xlg.svg similarity index 100% rename from public/assets/Union.svg rename to public/assets/shapes/union-xlg.svg diff --git a/public/assets/Union_xsm.svg b/public/assets/shapes/union-xsm.svg similarity index 100% rename from public/assets/Union_xsm.svg rename to public/assets/shapes/union-xsm.svg diff --git a/public/assets/Share/Discord.svg b/public/assets/share/discord.svg similarity index 100% rename from public/assets/Share/Discord.svg rename to public/assets/share/discord.svg diff --git a/public/assets/Share/Link.svg b/public/assets/share/link.svg similarity index 100% rename from public/assets/Share/Link.svg rename to public/assets/share/link.svg diff --git a/public/assets/Share/Mail.svg b/public/assets/share/mail.svg similarity index 100% rename from public/assets/Share/Mail.svg rename to public/assets/share/mail.svg diff --git a/public/assets/Share/Signal.svg b/public/assets/share/signal.svg similarity index 100% rename from public/assets/Share/Signal.svg rename to public/assets/share/signal.svg diff --git a/public/assets/Share/Slack.svg b/public/assets/share/slack.svg similarity index 100% rename from public/assets/Share/Slack.svg rename to public/assets/share/slack.svg diff --git a/public/assets/vector/default.svg b/public/assets/vector/default.svg deleted file mode 100644 index 2bd6a9b..0000000 --- a/public/assets/vector/default.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/public/assets/vector/shapes.svg b/public/assets/vector/shapes.svg deleted file mode 100644 index d8e7d57..0000000 --- a/public/assets/vector/shapes.svg +++ /dev/null @@ -1,19 +0,0 @@ - - - - - - - - - - - - - - - - - - - diff --git a/stories/asset/Avatar.stories.js b/stories/asset/Avatar.stories.js index 13863e5..e6ec794 100644 --- a/stories/asset/Avatar.stories.js +++ b/stories/asset/Avatar.stories.js @@ -36,7 +36,7 @@ export default { export const Default = { args: { - src: "assets/Avatar_1.png", + src: "assets/marketing/avatar-1.svg", alt: "User Avatar", size: "medium", }, @@ -44,7 +44,7 @@ export const Default = { export const Sizes = { args: { - src: "assets/Avatar_1.png", + src: "assets/marketing/avatar-1.svg", alt: "User Avatar", }, render: (args) => ( @@ -73,9 +73,9 @@ export const DifferentAvatars = { render: (args) => (
- - - + + +
), @@ -95,36 +95,36 @@ export const AllSizesWithDifferentAvatars = {

Small Size

- - - + + +

Medium Size

- - - + + +

Large Size

- - - + + +

XLarge Size

- - - + + +
diff --git a/stories/asset/AvatarContainer.stories.js b/stories/asset/AvatarContainer.stories.js index 55a95d3..2ab7cab 100644 --- a/stories/asset/AvatarContainer.stories.js +++ b/stories/asset/AvatarContainer.stories.js @@ -33,9 +33,9 @@ export const Default = { }, render: (args) => ( - - - + + + ), }; @@ -47,36 +47,36 @@ export const Sizes = {

Small Size

- - - + + +

Medium Size

- - - + + +

Large Size

- - - + + +

XLarge Size

- - - + + +
@@ -98,38 +98,38 @@ export const DifferentGroupSizes = {

2 Users

- - + +

3 Users

- - - + + +

4 Users

- - - - + + + +

5 Users

- - - - - + + + + +
@@ -158,9 +158,9 @@ export const InContext = {

Team Members

- - - + + + 3 team members
@@ -172,10 +172,10 @@ export const InContext = {
- - - - + + + + 4 contributors
@@ -185,8 +185,8 @@ export const InContext = {

Small Team

- - + + 2 members
diff --git a/stories/cards/Mini.stories.js b/stories/cards/Mini.stories.js index a05a636..b9b3907 100644 --- a/stories/cards/Mini.stories.js +++ b/stories/cards/Mini.stories.js @@ -30,7 +30,7 @@ export const Default = { backgroundColor: "bg-[var(--color-surface-default-brand-royal)]", labelLine1: "Decision-making", labelLine2: "support", - panelContent: "assets/Feature_Support.png", + panelContent: "assets/marketing/feature-support.png", }, }; @@ -41,25 +41,25 @@ export const ColorVariants = { backgroundColor="bg-[var(--color-surface-default-brand-royal)]" labelLine1="Decision-making" labelLine2="support" - panelContent="assets/Feature_Support.png" + panelContent="assets/marketing/feature-support.png" /> ), @@ -70,7 +70,7 @@ export const AsLink = { backgroundColor: "bg-[var(--color-surface-default-brand-royal)]", labelLine1: "Decision-making", labelLine2: "support", - panelContent: "assets/Feature_Support.png", + panelContent: "assets/marketing/feature-support.png", href: "#decision-making", ariaLabel: "Navigate to decision-making support tools", }, diff --git a/stories/sections/LogoWall.stories.js b/stories/sections/LogoWall.stories.js index 13fda43..d7861e1 100644 --- a/stories/sections/LogoWall.stories.js +++ b/stories/sections/LogoWall.stories.js @@ -37,13 +37,13 @@ export default { @@ -102,7 +102,7 @@ export const AllVariants = { quote="The rules of decision-making must be open and available to everyone, and this can happen only if they are formalized." author="Jo Freeman" source="The Tyranny of Structurelessness" - avatarSrc="assets/Quote_Avatar.svg" + avatarSrc="assets/marketing/quote-avatar.svg" /> @@ -113,7 +113,7 @@ export const AllVariants = { quote="The rules of decision-making must be open and available to everyone, and this can happen only if they are formalized." author="Jo Freeman" source="The Tyranny of Structurelessness" - avatarSrc="assets/Quote_Avatar.svg" + avatarSrc="assets/marketing/quote-avatar.svg" /> diff --git a/tests/pages/blog.test.jsx b/tests/pages/blog.test.jsx index 89c89a9..98c05b1 100644 --- a/tests/pages/blog.test.jsx +++ b/tests/pages/blog.test.jsx @@ -88,10 +88,12 @@ vi.mock("../../app/components/sections/AskOrganizer", () => { // Mock asset utils vi.mock("../../lib/assetUtils", () => ({ - getAssetPath: vi.fn((asset) => `/assets/${asset}`), + getAssetPath: vi.fn((asset) => + asset.startsWith("/") ? asset : `/${asset}`, + ), ASSETS: { - CONTENT_SHAPE_1: "Content_Shape_1.svg", - CONTENT_SHAPE_2: "Content_Shape_2.svg", + CONTENT_SHAPE_1: "assets/shapes/content-shape-1.svg", + CONTENT_SHAPE_2: "assets/shapes/content-shape-2.svg", }, })); @@ -232,8 +234,8 @@ describe("BlogPostPage", () => { expect(shapes).toHaveLength(2); // Check shape sources - expect(shapes[0]).toHaveAttribute("src", "/assets/Content_Shape_1.svg"); - expect(shapes[1]).toHaveAttribute("src", "/assets/Content_Shape_2.svg"); + expect(shapes[0]).toHaveAttribute("src", "/assets/shapes/content-shape-1.svg"); + expect(shapes[1]).toHaveAttribute("src", "/assets/shapes/content-shape-2.svg"); }); it("applies correct styling to article content", async () => { diff --git a/tests/unit/LogoWall.test.jsx b/tests/unit/LogoWall.test.jsx index 302236e..58bfd9c 100644 --- a/tests/unit/LogoWall.test.jsx +++ b/tests/unit/LogoWall.test.jsx @@ -84,7 +84,7 @@ describe("LogoWall Component", () => { const foodNotBombsLogo = screen.getByAltText("Food Not Bombs"); expect(foodNotBombsLogo).toHaveAttribute( "src", - "/assets/Section/Logo_FoodNotBombs.png", + "/assets/logos/partners/food-not-bombs.svg", ); expect(foodNotBombsLogo).toHaveClass("h-11", "lg:h-14", "xl:h-[70px]"); });