suphicakir
f9be08114d
- Logo: indigo zemin, spiral defter ve ¥ (frontend/brand/*.svg) - scripts/icons.sh (npm run icons): favicon (svg/ico), PWA 192/512, maskable, Apple touch icon, Tauri 1024 - Logo bileşeni (components/logo.tsx) - index.html: ikon bağlantıları, theme-color, açıklama Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
68 lines
2.0 KiB
TypeScript
68 lines
2.0 KiB
TypeScript
import { useId } from 'react'
|
||
import { cn } from '@/lib/utils'
|
||
|
||
/**
|
||
* Kakeibo logosu (kaynak: `frontend/brand/logo.svg` — ikisi aynı tutulmalı).
|
||
* `withText` ile yanında "Kakeibo" yazısı gösterilir.
|
||
*/
|
||
export function Logo({
|
||
size = 32,
|
||
withText = false,
|
||
className,
|
||
}: {
|
||
size?: number
|
||
withText?: boolean
|
||
className?: string
|
||
}) {
|
||
// Sayfada birden fazla logo olursa gradient kimlikleri çakışmasın
|
||
const gradientId = useId()
|
||
|
||
return (
|
||
<span className={cn('inline-flex items-center gap-2.5', className)}>
|
||
<svg
|
||
viewBox="0 0 512 512"
|
||
width={size}
|
||
height={size}
|
||
role="img"
|
||
aria-label={withText ? undefined : 'Kakeibo'}
|
||
aria-hidden={withText || undefined}
|
||
className="shrink-0"
|
||
>
|
||
<defs>
|
||
<linearGradient id={gradientId} x1="0" y1="0" x2="0" y2="1">
|
||
<stop offset="0" stopColor="#3b4aa8" />
|
||
<stop offset="1" stopColor="#26307a" />
|
||
</linearGradient>
|
||
</defs>
|
||
<rect width="512" height="512" rx="112" fill={`url(#${gradientId})`} />
|
||
<rect x="140" y="92" width="252" height="328" rx="28" fill="#f7f3ea" />
|
||
<rect x="140" y="92" width="52" height="328" rx="28" fill="#e6dfcf" />
|
||
<rect x="166" y="92" width="26" height="328" fill="#e6dfcf" />
|
||
<g fill="#26307a">
|
||
<circle cx="140" cy="150" r="13" />
|
||
<circle cx="140" cy="220" r="13" />
|
||
<circle cx="140" cy="290" r="13" />
|
||
<circle cx="140" cy="360" r="13" />
|
||
</g>
|
||
<g
|
||
fill="none"
|
||
stroke="#26307a"
|
||
strokeWidth="22"
|
||
strokeLinecap="round"
|
||
strokeLinejoin="round"
|
||
>
|
||
<path d="M238 178 L292 254 L346 178" />
|
||
<path d="M292 254 V342" />
|
||
<path d="M250 266 H334" />
|
||
<path d="M250 304 H334" />
|
||
</g>
|
||
</svg>
|
||
{withText && (
|
||
<span className="font-bold tracking-tight" style={{ fontSize: size * 0.6 }}>
|
||
Kakeibo
|
||
</span>
|
||
)}
|
||
</span>
|
||
)
|
||
}
|