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]>
33 lines
898 B
TypeScript
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
|