Add files

2026-02-25 21:15:24 +01:00
commit f5aa15e0f4
35 changed files with 13708 additions and 0 deletions
--- a/components/typography.tsx
+++ b/components/typography.tsx
@@ -0,0 +1,124 @@
+import { cn } from "@/lib/utils"
+
+// https://ui.shadcn.com/docs/components/radix/typography.md
+
+export function H1({ className, children, ...props }: React.HTMLAttributes<HTMLHeadingElement>) {
+  return (
+    <h1
+      className={cn("scroll-m-20 text-4xl font-extrabold tracking-tight text-balance", className)}
+      {...props}
+    >
+      {children}
+    </h1>
+  )
+}
+
+export function H2({ className, children, ...props }: React.HTMLAttributes<HTMLHeadingElement>) {
+  return (
+    <h2
+      className={cn("scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0", className)}
+      {...props}
+    >
+      {children}
+    </h2>
+  )
+}
+
+export function H3({ className, children, ...props }: React.HTMLAttributes<HTMLHeadingElement>) {
+  return (
+    <h3
+      className={cn("scroll-m-20 text-2xl font-semibold tracking-tight", className)}
+      {...props}
+    >
+      {children}
+    </h3>
+  )
+}
+
+export function H4({ className, children, ...props }: React.HTMLAttributes<HTMLHeadingElement>) {
+  return (
+    <h4
+      className={cn("scroll-m-20 text-xl font-semibold tracking-tight", className)}
+      {...props}
+    >
+      {children}
+    </h4>
+  )
+}
+
+export function P({ className, children, ...props }: React.HTMLAttributes<HTMLParagraphElement>) {
+  return (
+    <p
+      className={cn("leading-7 not-first:mt-6", className)}
+      {...props}
+    >
+      {children}
+    </p>
+  )
+}
+
+export function Blockquote({ className, children, ...props }: React.HTMLAttributes<HTMLQuoteElement>) {
+  return (
+    <blockquote
+      className={cn("mt-6 border-l-2 pl-6 italic", className)}
+      {...props}
+    >
+      {children}
+    </blockquote>
+  )
+}
+
+export function InlineCode({ className, children, ...props }: React.HTMLAttributes<HTMLElement>) {
+  return (
+    <code
+      className={cn("bg-muted relative rounded px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold", className)}
+      {...props}
+    >
+      {children}
+    </code>
+  )
+}
+
+export function Lead({ className, children, ...props }: React.HTMLAttributes<HTMLParagraphElement>) {
+  return (
+    <p
+      className={cn("text-muted-foreground text-xl", className)}
+      {...props}
+    >
+      {children}
+    </p>
+  )
+}
+
+export function Large({ className, children, ...props }: React.HTMLAttributes<HTMLDivElement>) {
+  return (
+    <div
+      className={cn("text-lg font-semibold", className)}
+      {...props}
+    >
+      {children}
+    </div>
+  )
+}
+
+export function Small({ className, children, ...props }: React.HTMLAttributes<HTMLElement>) {
+  return (
+    <small
+      className={cn("text-sm leading-none font-medium", className)}
+      {...props}
+    >
+      {children}
+    </small>
+  )
+}
+
+export function Muted({ className, children, ...props }: React.HTMLAttributes<HTMLParagraphElement>) {
+  return (
+    <p
+      className={cn("text-muted-foreground text-sm", className)}
+      {...props}
+    >
+      {children}
+    </p>
+  )
+}