Files
miracles_in_motion/src/components/ui/LogoMark.tsx
T
defiQUGandCursor f5d305bfcb feat(brand): official logo, forest green/gold theme, and favicon set
Wire public/logo.png into nav/footer LogoMark with responsive sizing,
remap primary/secondary Tailwind scales to brand colors, and refresh
CTAs, PWA manifest, and favicon assets for mim4u.org.

Co-authored-by: Cursor <[email protected]>
2026-05-26 18:14:43 -07:00

33 lines
898 B
TypeScript

export type LogoMarkVariant = 'nav' | 'footer' | 'square'
export interface LogoMarkProps {
/** nav/footer: full wordmark; square: compact icon tile */
variant?: LogoMarkVariant
className?: string
}
const LOGO_SRC = '/logo.png'
export function LogoMark({ variant = 'nav', className = '' }: LogoMarkProps) {
const isDecorative = variant === 'nav' || variant === 'footer'
return (
<span
className={['logo-mark', `logo-mark--${variant}`, className].filter(Boolean).join(' ')}
aria-hidden={isDecorative || undefined}
>
<img
src={LOGO_SRC}
alt={isDecorative ? '' : 'Miracles in Motion Foundation'}
className="logo-mark__img"
width={1024}
height={1024}
decoding="async"
fetchPriority={variant === 'nav' ? 'high' : undefined}
/>
</span>
)
}
export default LogoMark