36 lines
1.1 KiB
TypeScript
36 lines
1.1 KiB
TypeScript
export function JefflixLogo({ className = "", size = "default" }: { className?: string; size?: "default" | "small" }) {
|
|
const isSmall = size === "small"
|
|
|
|
return (
|
|
<div className={`inline-flex items-center gap-3 ${className}`}>
|
|
<span
|
|
className={
|
|
isSmall
|
|
? "text-3xl md:text-[3.33rem] font-black tracking-tight"
|
|
: "text-9xl md:text-[10rem] font-black tracking-tight"
|
|
}
|
|
style={{
|
|
fontFamily: "'Fredoka', 'Rounded Mplus 1c', sans-serif",
|
|
color: "#E50914",
|
|
textShadow: "3px 3px 0px rgba(0,0,0,0.3)",
|
|
letterSpacing: "-0.05em",
|
|
}}
|
|
>
|
|
JEFFLIX
|
|
</span>
|
|
<span
|
|
className={isSmall ? "text-2xl md:text-2xl font-black" : "text-6xl md:text-7xl font-black"}
|
|
style={{
|
|
fontFamily: "'Permanent Marker', cursive",
|
|
color: "#dc2626",
|
|
textShadow: "2px 2px 4px rgba(0,0,0,0.5)",
|
|
transform: "rotate(-2deg)",
|
|
display: "inline-block",
|
|
}}
|
|
>
|
|
.LOL
|
|
</span>
|
|
</div>
|
|
)
|
|
}
|