86 lines
2.1 KiB
TypeScript
86 lines
2.1 KiB
TypeScript
"use client"
|
|
|
|
import Link from "next/link"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
type UltiMailLogoProps = {
|
|
className?: string
|
|
/** `horizontal` = picto source + « Ultimail » (lisible, aligné barre). `mark` = picto seul (launcher). */
|
|
variant?: "horizontal" | "mark"
|
|
/** Lien au clic ; `null` = pas de lien. Défaut : boîte de réception. */
|
|
href?: string | null
|
|
}
|
|
|
|
/** Icône extraite du master PNG (pas le SVG VTracer, trop « M Gmail » à petite taille). */
|
|
const HEADER_ICON = "/brand/ultimail-header-icon.png"
|
|
const DEFAULT_INBOX_HREF = "/mail/inbox"
|
|
|
|
export function UltiMailLogo({
|
|
className,
|
|
variant = "horizontal",
|
|
href = DEFAULT_INBOX_HREF,
|
|
}: UltiMailLogoProps) {
|
|
const mark = (
|
|
<img
|
|
src={HEADER_ICON}
|
|
alt=""
|
|
width={288}
|
|
height={288}
|
|
draggable={false}
|
|
className={cn(
|
|
"shrink-0 object-contain object-center select-none",
|
|
variant === "mark" ? "h-10 w-10" : "h-8 w-8"
|
|
)}
|
|
aria-hidden
|
|
/>
|
|
)
|
|
|
|
if (variant === "mark") {
|
|
if (href === null) {
|
|
return <div className={cn("shrink-0", className)}>{mark}</div>
|
|
}
|
|
return (
|
|
<Link
|
|
href={href}
|
|
className={cn(
|
|
"shrink-0 rounded-md outline-none focus-visible:ring-2 focus-visible:ring-ring/50",
|
|
className
|
|
)}
|
|
aria-label="Ultimail — Boîte de réception"
|
|
>
|
|
{mark}
|
|
</Link>
|
|
)
|
|
}
|
|
|
|
const body = (
|
|
<div
|
|
role="img"
|
|
aria-label="Ultimail"
|
|
className="flex min-w-0 items-center gap-2.5 text-foreground"
|
|
>
|
|
{mark}
|
|
<span className="min-w-0 truncate text-[1.375rem] font-semibold leading-none tracking-tight text-foreground dark:text-white">
|
|
Ultimail
|
|
</span>
|
|
</div>
|
|
)
|
|
|
|
if (href === null) {
|
|
return <div className={cn("min-w-0", className)}>{body}</div>
|
|
}
|
|
|
|
return (
|
|
<Link
|
|
href={href}
|
|
className={cn(
|
|
"flex min-w-0 items-center rounded-md outline-none focus-visible:ring-2 focus-visible:ring-ring/50",
|
|
className
|
|
)}
|
|
aria-label="Ultimail — Boîte de réception"
|
|
>
|
|
{body}
|
|
</Link>
|
|
)
|
|
}
|