-
-
-
- Get started by editing{" "}
-
- src/app/page.tsx -- . -
- - - Save and see your changes instantly. - -
-
- & {
+ asChild?: boolean
+ }) {
+ const Comp = asChild ? Slot : "button"
+
+ return (
+ ) {
+ return ) {
+ return ) {
+ return ) {
+ return ) {
+ return (
+ ) {
+ return (
+
+
+
+ {children}
+
+
+ )
+}
+
+function DrawerHeader({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function DrawerFooter({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function DrawerTitle({
+ className,
+ ...props
+}: React.ComponentProps) {
+ return (
+ ) {
+ return (
+ ) {
+ return (
+
+ {/* Fixed Navigation Sidebar */}
+
- );
-}
+ )
+}
\ No newline at end of file
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
new file mode 100644
index 0000000..d96719c
--- /dev/null
+++ b/src/components/ui/button.tsx
@@ -0,0 +1,58 @@
+import * as React from "react"
+import { Slot } from "@radix-ui/react-slot"
+import { cva, type VariantProps } from "class-variance-authority"
+
+import { cn } from "@/lib/utils"
+
+const buttonVariants = cva(
+ "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+ {
+ variants: {
+ variant: {
+ default: "bg-primary text-primary-foreground hover:bg-primary/90",
+ destructive:
+ "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+ outline:
+ "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+ secondary:
+ "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+ ghost:
+ "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+ link: "text-primary underline-offset-4 hover:underline",
+ },
+ size: {
+ default: "h-9 px-4 py-2 has-[>svg]:px-3",
+ sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+ lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+ icon: "size-9",
+ },
+ },
+ defaultVariants: {
+ variant: "default",
+ size: "default",
+ },
+ }
+)
+
+function Button({
+ className,
+ variant,
+ size,
+ asChild = false,
+ ...props
+}: React.ComponentProps<"button"> &
+ VariantProps
+ {/* Logo */}
+
+
+ {/* Main Content */}
+
+
-
-
+
+ {/* Typefaces List */}
+
+ BIOHAZARD VFX
+
+
+ Visual Research Studio
+
+
+
+ {/* Bottom Navigation */}
+
+
+ ↳ TYPEFACES
+
+ {typefaces.map((typeface, index) => (
+
+
+
+ ))}
+
+ {typeface.name}
+
+ {typeface.number && (
+
+ {typeface.number}
+
+ )}
+
+
+
+
+
+
+
+ ↳ LEGAL
+ EULA
+
+
+
+ ↳ SOCIAL
+
+
+ TWITTER
+ TWITCH
+ INSTAGRAM
+ GITHUB
+
+
+ ↳ SUPPORT
+
+ FOUNDRY@BASEMENT.STUDIO
+
+
+ {/* Top Banner */}
+
+ {/* Large Typography Display */}
+
+
+ {/* Typefaces Section */}
+
+
+
+ {/* FAQ Section */}
+
+
+
+ {/* Footer/Contact Section */}
+
+
+
+
+
+
+
+ {/* Hero Section */}
+
+
+
+ 95% OF THE WEB IS MADE OUT OF FONTS; CHOOSE WISELY — BY BASEMENT.STUDIO, COMPUTING YOU CAN TRUST! — NOT YOUR AVERAGE FONT SHOP — 95% OF THE WEB IS MADE OUT OF FONTS; CHOOSE WISELY
+
+
+
+
+ {/* Overlay Pattern */}
+
+ FONT
+
+
+
+
+
+ {/* Content */}
+
+
+
+
+
+
+ WE CREATED A
+
+
+
+ WE CREATED A
+
+ DISTINGUISHED
+
+ & EVER-EVOLVING
+
+ CATALOG OF
+
+ TYPEFACES
+
+ + EVERY GLYPH HAS BEEN CAREFULLY CRAFTED WITH OBSESSIVE ATTENTION TO DETAIL, + ENSURING EACH TYPEFACE EMBODIES THE SPIRIT OF ITS ERA WHILE REMAINING TIMELESS. +
+
+
+
+
+
+ CHECK THEM ALL, DOWNSTAIRS.
+
+
+ BASEMENT.STUDIO LLC 2025
+
+
+
+
+
+
+
+ + BUNKER +
+
+
+
+ CANICHE
+ 1 STYLE / 1 WEIGHT
+
+
+
+ 99 GLYPHS
+
+
+
+
+ $ MODE 1
+ MODE 2
+
+
+
+
+
+
+
+
+
+
+
+ Aa
+
+
+
+
+
+
+ CANICHE
+
+
+
+
+ CANICHE
+
+
+
+
+
+
+ CARPENTER
+ 1 STYLE / 1 WEIGHT
+
+
+
+ 103 GLYPHS
+
+
+
+
+ $ MODE 1
+ MODE 2
+
+
+
+
+
+
+
+
+
+
+
+ FREQUENTLY ASKED QUESTIONS
+QUESTIONS YOU MAY HAVE
+ SHOP WITH CONFIDENCE
+
+
+
+ {faqItems.map((item, index) => (
+
+
+
+ {selectedFaq === index && item.answer && (
+
+ ))}
+
+
+ )}
+
+ {item.answer}
+
+
+
+
+ {/* Large 3D Text Background */}
+
+
+
+
+
+ BSMNT
+
+ {/* Wireframe overlay effect */}
+
+
+
+
+
+
+ {/* Typefaces */}
+
+
+ {/* Copyright */}
+
+
+
+ {/* Legal */}
+ ↳ TYPEFACES
+
+ {typefaces.slice(0, 4).map((typeface, index) => (
+
+
+ {typeface.name}
+
+ ))}
+ {typefaces.slice(4, 8).map((typeface, index) => (
+
+ {typeface.name}
+
+ ))}
+ TROVADOR
+ XERO
+
+
+
+ {/* Social */}
+ ↳ LEGAL
+ EULA
+
+
+
+ {/* Support */}
+ ↳ SOCIAL
+
+
+ TWITTER
+ TWITCH
+ INSTAGRAM
+ GITHUB
+
+
+ ↳ SUPPORT
+
+ FOUNDRY@BASEMENT.STUDIO
+
+
+
+
+ © BASEMENT.STUDIO LLC 2025
+
+ ALL RIGHTS RESERVED. +
+ + ALL RIGHTS RESERVED. +