Zane
77ea27f5f5
Co-authored-by: Nahiyan Khan <nahiyan@squareup.com> Co-authored-by: Taylor Ho <taylorkmho@gmail.com> Co-authored-by: Lily Delalande <119957291+lily-de@users.noreply.github.com> Co-authored-by: Spence <spencrmartin@gmail.com> Co-authored-by: spencrmartin <spencermartin@squareup.com> Co-authored-by: Judson Stephenson <Jud@users.noreply.github.com> Co-authored-by: Max Novich <mnovich@squareup.com> Co-authored-by: Best Codes <106822363+The-Best-Codes@users.noreply.github.com> Co-authored-by: caroline-a-mckenzie <cmckenzie@squareup.com> Co-authored-by: Michael Neale <michael.neale@gmail.com>
50 lines
1.0 KiB
TypeScript
50 lines
1.0 KiB
TypeScript
import { Goose, Rain } from './icons/Goose';
|
|
import { cn } from '../utils';
|
|
|
|
interface GooseLogoProps {
|
|
className?: string;
|
|
size?: 'default' | 'small';
|
|
hover?: boolean;
|
|
}
|
|
|
|
export default function GooseLogo({
|
|
className = '',
|
|
size = 'default',
|
|
hover = true,
|
|
}: GooseLogoProps) {
|
|
const sizes = {
|
|
default: {
|
|
frame: 'w-16 h-16',
|
|
rain: 'w-[275px] h-[275px]',
|
|
goose: 'w-16 h-16',
|
|
},
|
|
small: {
|
|
frame: 'w-8 h-8',
|
|
rain: 'w-[150px] h-[150px]',
|
|
goose: 'w-8 h-8',
|
|
},
|
|
} as const;
|
|
|
|
const currentSize = sizes[size];
|
|
|
|
return (
|
|
<div
|
|
className={cn(
|
|
className,
|
|
currentSize.frame,
|
|
'relative overflow-hidden',
|
|
hover && 'group/with-hover'
|
|
)}
|
|
>
|
|
<Rain
|
|
className={cn(
|
|
currentSize.rain,
|
|
'absolute left-0 bottom-0 transition-all duration-300 z-1',
|
|
hover && 'opacity-0 group-hover/with-hover:opacity-100'
|
|
)}
|
|
/>
|
|
<Goose className={cn(currentSize.goose, 'absolute left-0 bottom-0 z-2')} />
|
|
</div>
|
|
);
|
|
}
|