continue re-design

2025-09-05 13:06:17 -04:00
parent b96d048dbd
commit 836b085f75
270 changed files with 32269 additions and 5182 deletions
@@ -0,0 +1,122 @@
+"use client";
+
+import { useEffect, useRef, useState } from "react";
+import { cn } from "@/utils/cn";
+
+// Sample of flame frames - using a subset for performance
+const flameFrames = [
+  `
+       ▄▄▄       
+      ▄███▄      
+     ▄█████▄     
+    ▄███████▄    
+   ▄█████████▄   
+  ▄███████████▄  
+ ▄█████████████▄ 
+▄███████████████▄
+█████████████████
+███▀▀▀███▀▀▀█████
+██     ███    ███
+█       ▀      ██
+`,
+  `
+      ▄███▄      
+     ▄█████▄     
+    ▄███▀███▄    
+   ▄████▄████▄   
+  ▄███████████▄  
+ ▄█████▀▀██████▄ 
+▄██████▄▄███████▄
+█████████████████
+███▀▀█████▀▀█████
+██    ███     ███
+█      ▀       ██
+                 
+`,
+  `
+     ▄█████▄     
+    ▄███████▄    
+   ▄█████████▄   
+  ▄███▀███▀███▄  
+ ▄████▄███▄████▄ 
+▄██████████████▄ 
+████▀▀█████▀▀████
+███    ███    ███
+██     ▀▀     ███
+█             ██ 
+                 
+                 
+`,
+  `
+    ▄███████▄    
+   ▄█████████▄   
+  ▄███████████▄  
+ ▄█████▀▀██████▄ 
+▄███████▄▄██████▄
+██████████████████
+████▀▀▀████▀▀▀████
+███     ███    ███
+██      ▀▀      ██
+█               █ 
+                  
+                  
+`,
+];
+
+interface HeroFlameProps {
+  className?: string;
+  size?: "small" | "medium" | "large";
+}
+
+export function HeroFlame({ className, size = "medium" }: HeroFlameProps) {
+  const [frameIndex, setFrameIndex] = useState(0);
+  const intervalRef = useRef<NodeJS.Timeout>();
+
+  useEffect(() => {
+    intervalRef.current = setInterval(() => {
+      setFrameIndex((prev) => (prev + 1) % flameFrames.length);
+    }, 85);
+
+    return () => {
+      if (intervalRef.current) {
+        clearInterval(intervalRef.current);
+      }
+    };
+  }, []);
+
+  const sizeClasses = {
+    small: "text-[8px] leading-[10px]",
+    medium: "text-[12px] leading-[14px]",
+    large: "text-[16px] leading-[18px]",
+  };
+
+  return (
+    <div
+      className={cn("flex gap-4 pointer-events-none select-none", className)}
+    >
+      {/* Left flame */}
+      <div className="relative overflow-hidden">
+        <pre
+          className={cn(
+            "text-heat-100 font-mono whitespace-pre",
+            sizeClasses[size],
+          )}
+        >
+          {flameFrames[frameIndex]}
+        </pre>
+      </div>
+
+      {/* Right flame (mirrored) */}
+      <div className="relative overflow-hidden -scale-x-100">
+        <pre
+          className={cn(
+            "text-heat-100 font-mono whitespace-pre",
+            sizeClasses[size],
+          )}
+        >
+          {flameFrames[frameIndex]}
+        </pre>
+      </div>
+    </div>
+  );
+}