73 lines
2.2 KiB
TypeScript
73 lines
2.2 KiB
TypeScript
interface LogoProps {
|
|
className?: string;
|
|
size?: number;
|
|
}
|
|
|
|
export function Logo({ className = '', size = 40 }: LogoProps) {
|
|
return (
|
|
<svg
|
|
width={size}
|
|
height={size}
|
|
viewBox="0 0 500 500"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
className={className}
|
|
aria-label="webklar Logo"
|
|
>
|
|
{/* Left V-shape (lighter green) */}
|
|
<path
|
|
d="M70 120 L70 280 L165 375 L165 320 L110 265 L110 120 Z"
|
|
fill="url(#gradient-left)"
|
|
/>
|
|
|
|
{/* Center chevron (medium green) */}
|
|
<path
|
|
d="M165 215 L250 130 L335 215 L335 270 L250 185 L165 270 Z"
|
|
fill="url(#gradient-center)"
|
|
/>
|
|
|
|
{/* Right V-shape (darker green) */}
|
|
<path
|
|
d="M430 120 L430 280 L335 375 L335 320 L390 265 L390 120 Z"
|
|
fill="url(#gradient-right)"
|
|
/>
|
|
|
|
{/* Bottom connection left */}
|
|
<path
|
|
d="M165 320 L165 375 L250 460 L250 405 Z"
|
|
fill="url(#gradient-bottom-left)"
|
|
/>
|
|
|
|
{/* Bottom connection right */}
|
|
<path
|
|
d="M335 320 L335 375 L250 460 L250 405 Z"
|
|
fill="url(#gradient-bottom-right)"
|
|
/>
|
|
|
|
<defs>
|
|
<linearGradient id="gradient-left" x1="0%" y1="0%" x2="0%" y2="100%">
|
|
<stop offset="0%" stopColor="#9AA67F" />
|
|
<stop offset="100%" stopColor="#0F5010" />
|
|
</linearGradient>
|
|
<linearGradient id="gradient-center" x1="0%" y1="0%" x2="0%" y2="100%">
|
|
<stop offset="0%" stopColor="#0F5010" />
|
|
<stop offset="100%" stopColor="#0A400C" />
|
|
</linearGradient>
|
|
<linearGradient id="gradient-right" x1="0%" y1="0%" x2="0%" y2="100%">
|
|
<stop offset="0%" stopColor="#0A400C" />
|
|
<stop offset="100%" stopColor="#052006" />
|
|
</linearGradient>
|
|
<linearGradient id="gradient-bottom-left" x1="0%" y1="0%" x2="0%" y2="100%">
|
|
<stop offset="0%" stopColor="#0F5010" />
|
|
<stop offset="100%" stopColor="#0A400C" />
|
|
</linearGradient>
|
|
<linearGradient id="gradient-bottom-right" x1="0%" y1="0%" x2="0%" y2="100%">
|
|
<stop offset="0%" stopColor="#0A400C" />
|
|
<stop offset="100%" stopColor="#052006" />
|
|
</linearGradient>
|
|
</defs>
|
|
</svg>
|
|
);
|
|
}
|
|
|