Submatter/apps/web/components/marketing/logo.tsx
Randall Stillwell 2f6adf4382 feat(web): Submatter marketing redesign with Signal Editorial system
Introduce public /landing and /pricing pages for the SBMTR brand with
bento features, convoy product demo, motion reveals, and scoped marketing
tokens. Unauthenticated visitors route to the landing page.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-07-10 22:50:05 -05:00

61 lines
1.5 KiB
TypeScript

import Link from "next/link";
import { cn } from "@/lib/utils";
type LogoProps = {
className?: string;
showTagline?: boolean;
size?: "sm" | "md" | "lg";
variant?: "dark" | "light";
};
const sizeClasses = {
sm: { rule: "w-8", word: "text-xl tracking-[0.22em]", tag: "text-[10px]" },
md: { rule: "w-10", word: "text-2xl tracking-[0.24em]", tag: "text-xs" },
lg: { rule: "w-14", word: "text-4xl tracking-[0.26em]", tag: "text-sm" },
};
export function Logo({
className,
showTagline = false,
size = "md",
variant = "light",
}: LogoProps) {
const s = sizeClasses[size];
const isDark = variant === "dark";
return (
<Link href="/landing" className={cn("group inline-flex flex-col gap-1", className)}>
<span
className={cn(
"h-0.5 rounded-full transition-colors",
s.rule,
isDark
? "bg-[hsl(var(--hero-foreground))] group-hover:bg-[hsl(var(--matter))]"
: "bg-foreground group-hover:bg-primary",
)}
aria-hidden
/>
<span
className={cn(
"font-display font-extrabold leading-none",
s.word,
isDark ? "text-[hsl(var(--hero-foreground))]" : "text-foreground",
)}
>
SBMTR
</span>
{showTagline ? (
<span
className={cn(
"font-marketing",
s.tag,
isDark ? "text-[hsl(var(--hero-muted))]" : "text-muted-foreground",
)}
>
Submatter
</span>
) : null}
</Link>
);
}