From 18d2186101043c251687235bddf13b7f00b16846 Mon Sep 17 00:00:00 2001
From: Dominik Koch <dominik@koch-bautechnik.de>
Date: Wed, 16 Jul 2025 15:19:06 +0200
Subject: feat(hero): add sponsored by vercel to hero

---
 apps/web/src/components/landing/hero.tsx | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

(limited to 'apps/web/src/components/landing')

diff --git a/apps/web/src/components/landing/hero.tsx b/apps/web/src/components/landing/hero.tsx
index b1910dc5..944881ea 100644
--- a/apps/web/src/components/landing/hero.tsx
+++ b/apps/web/src/components/landing/hero.tsx
@@ -3,6 +3,8 @@
 import { motion } from "motion/react";
 import { Button } from "../ui/button";
 import { Input } from "../ui/input";
+import { SponsorButton } from "../ui/sponsor-button";
+import { VercelIcon } from "../icons";
 import { ArrowRight } from "lucide-react";
 import { useState, useEffect } from "react";
 import { toast } from "sonner";
@@ -105,6 +107,18 @@ export function Hero() {
         transition={{ duration: 1 }}
         className="max-w-3xl mx-auto w-full flex-1 flex flex-col justify-center"
       >
+        <motion.div
+          initial={{ opacity: 0, y: 20 }}
+          animate={{ opacity: 1, y: 0 }}
+          transition={{ delay: 0.6, duration: 0.8 }}
+          className="mb-4 flex justify-center"
+        >
+          <SponsorButton 
+            href="https://vercel.com/?utm_source=opencut"
+            logo={VercelIcon}
+            companyName="Vercel"
+          />
+        </motion.div>
         <motion.div
           initial={{ opacity: 0, y: 20 }}
           animate={{ opacity: 1, y: 0 }}
-- 
cgit v1.3.1


From c3de5327091cb84d8233c25b2e7eeacc2c972a7c Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Wed, 16 Jul 2025 16:14:45 +0200
Subject: fix

---
 apps/web/src/components/landing/hero.tsx      | 2 +-
 apps/web/src/components/ui/sponsor-button.tsx | 2 --
 2 files changed, 1 insertion(+), 3 deletions(-)

(limited to 'apps/web/src/components/landing')

diff --git a/apps/web/src/components/landing/hero.tsx b/apps/web/src/components/landing/hero.tsx
index 4a66e433..d5fe38d1 100644
--- a/apps/web/src/components/landing/hero.tsx
+++ b/apps/web/src/components/landing/hero.tsx
@@ -119,7 +119,7 @@ export function Hero() {
           initial={{ opacity: 0, y: 20 }}
           animate={{ opacity: 1, y: 0 }}
           transition={{ delay: 0.6, duration: 0.8 }}
-          className="mb-4 flex justify-center"
+          className="mb-8 flex justify-center"
         >
           <SponsorButton 
             href="https://vercel.com/?utm_source=opencut"
diff --git a/apps/web/src/components/ui/sponsor-button.tsx b/apps/web/src/components/ui/sponsor-button.tsx
index fdfaa0b0..79c708a2 100644
--- a/apps/web/src/components/ui/sponsor-button.tsx
+++ b/apps/web/src/components/ui/sponsor-button.tsx
@@ -21,8 +21,6 @@ export function SponsorButton({
       target="_blank"
       rel="noopener noreferrer"
       className={`inline-flex items-center gap-2 px-3 py-2 rounded-full border border-white/10 bg-white/5 backdrop-blur-sm hover:bg-white/10 hover:border-white/20 transition-all duration-200 group shadow-lg ${className}`}
-      whileHover={{ scale: 1.02 }}
-      whileTap={{ scale: 0.98 }}
     >
       <span className="text-xs font-medium text-zinc-400 group-hover:text-zinc-300 transition-colors">
         Sponsored by
-- 
cgit v1.3.1


From fcfe612cd66c6c38c4ea27513dbcb9a70bd89c92 Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Wed, 16 Jul 2025 17:36:47 +0200
Subject: fix: handlers component on mobile

---
 apps/web/src/components/landing/handlebars.tsx | 48 +++++++++++++++++++++++---
 1 file changed, 44 insertions(+), 4 deletions(-)

(limited to 'apps/web/src/components/landing')

diff --git a/apps/web/src/components/landing/handlebars.tsx b/apps/web/src/components/landing/handlebars.tsx
index 36705e90..e2eb2573 100644
--- a/apps/web/src/components/landing/handlebars.tsx
+++ b/apps/web/src/components/landing/handlebars.tsx
@@ -19,6 +19,7 @@ export function Handlebars({
   const [leftHandle, setLeftHandle] = useState(0);
   const [rightHandle, setRightHandle] = useState(maxWidth);
   const [contentWidth, setContentWidth] = useState(maxWidth);
+  const [isDragging, setIsDragging] = useState(false);
 
   const leftHandleX = useMotionValue(0);
   const rightHandleX = useMotionValue(maxWidth);
@@ -33,6 +34,27 @@ export function Handlebars({
   const containerRef = useRef<HTMLDivElement>(null);
   const measureRef = useRef<HTMLDivElement>(null);
 
+  // Prevent scroll when dragging on mobile
+  useEffect(() => {
+    const preventDefault = (e: TouchEvent) => {
+      if (isDragging) {
+        e.preventDefault();
+      }
+    };
+
+    if (isDragging) {
+      document.addEventListener("touchmove", preventDefault, {
+        passive: false,
+      });
+      document.body.style.overflow = "hidden";
+    }
+
+    return () => {
+      document.removeEventListener("touchmove", preventDefault);
+      document.body.style.overflow = "";
+    };
+  }, [isDragging]);
+
   useEffect(() => {
     if (!measureRef.current) return;
 
@@ -80,6 +102,14 @@ export function Handlebars({
     setRightHandle(newRight);
   };
 
+  const handleDragStart = () => {
+    setIsDragging(true);
+  };
+
+  const handleDragEnd = () => {
+    setIsDragging(false);
+  };
+
   return (
     <div className="flex justify-center gap-4 leading-[4rem] mt-0 md:mt-2">
       <div
@@ -95,8 +125,10 @@ export function Handlebars({
         style={{ width: contentWidth }}
       >
         <div className="absolute inset-0 w-full h-full rounded-2xl border border-yellow-500 flex justify-between">
+          {/* Left Handle */}
           <motion.div
-            className="h-full border border-yellow-500 w-7 rounded-full bg-accent flex items-center justify-center cursor-ew-resize select-none"
+            className="h-full border border-yellow-500 rounded-full bg-accent flex items-center justify-center cursor-ew-resize select-none touch-none
+                       w-9 md:w-7 min-h-[44px] md:min-h-0"
             style={{
               position: "absolute",
               x: leftHandleX,
@@ -108,19 +140,24 @@ export function Handlebars({
             dragElastic={0}
             dragMomentum={false}
             onDrag={handleLeftDrag}
+            onDragStart={handleDragStart}
+            onDragEnd={handleDragEnd}
             whileHover={{ scale: 1.05 }}
             whileDrag={{ scale: 1.1 }}
+            whileTap={{ scale: 1.1 }}
             transition={{ type: "spring", stiffness: 400, damping: 30 }}
           >
             <div className="w-2 h-8 rounded-full bg-yellow-500"></div>
           </motion.div>
 
+          {/* Right Handle */}
           <motion.div
-            className="h-full border border-yellow-500 w-7 rounded-full bg-accent flex items-center justify-center cursor-ew-resize select-none"
+            className="h-full border border-yellow-500 rounded-full bg-accent flex items-center justify-center cursor-ew-resize select-none touch-none
+                       w-9 md:w-7 min-h-[44px] md:min-h-0"
             style={{
               position: "absolute",
               x: rightHandleX,
-              left: -30,
+              left: -36, // Adjusted for larger mobile handle
               zIndex: 10,
             }}
             drag="x"
@@ -131,8 +168,11 @@ export function Handlebars({
             dragElastic={0}
             dragMomentum={false}
             onDrag={handleRightDrag}
+            onDragStart={handleDragStart}
+            onDragEnd={handleDragEnd}
             whileHover={{ scale: 1.05 }}
             whileDrag={{ scale: 1.1 }}
+            whileTap={{ scale: 1.1 }}
             transition={{ type: "spring", stiffness: 400, damping: 30 }}
           >
             <div className="w-2 h-8 rounded-full bg-yellow-500"></div>
@@ -161,4 +201,4 @@ export function Handlebars({
       </div>
     </div>
   );
-};
+}
-- 
cgit v1.3.1


From a3c84e4a199add132340fb4f0a5e74e9062d5d5f Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Wed, 16 Jul 2025 23:28:26 +0200
Subject: fix handlebars

---
 apps/web/src/components/landing/handlebars.tsx | 48 +++-----------------------
 1 file changed, 4 insertions(+), 44 deletions(-)

(limited to 'apps/web/src/components/landing')

diff --git a/apps/web/src/components/landing/handlebars.tsx b/apps/web/src/components/landing/handlebars.tsx
index e2eb2573..36705e90 100644
--- a/apps/web/src/components/landing/handlebars.tsx
+++ b/apps/web/src/components/landing/handlebars.tsx
@@ -19,7 +19,6 @@ export function Handlebars({
   const [leftHandle, setLeftHandle] = useState(0);
   const [rightHandle, setRightHandle] = useState(maxWidth);
   const [contentWidth, setContentWidth] = useState(maxWidth);
-  const [isDragging, setIsDragging] = useState(false);
 
   const leftHandleX = useMotionValue(0);
   const rightHandleX = useMotionValue(maxWidth);
@@ -34,27 +33,6 @@ export function Handlebars({
   const containerRef = useRef<HTMLDivElement>(null);
   const measureRef = useRef<HTMLDivElement>(null);
 
-  // Prevent scroll when dragging on mobile
-  useEffect(() => {
-    const preventDefault = (e: TouchEvent) => {
-      if (isDragging) {
-        e.preventDefault();
-      }
-    };
-
-    if (isDragging) {
-      document.addEventListener("touchmove", preventDefault, {
-        passive: false,
-      });
-      document.body.style.overflow = "hidden";
-    }
-
-    return () => {
-      document.removeEventListener("touchmove", preventDefault);
-      document.body.style.overflow = "";
-    };
-  }, [isDragging]);
-
   useEffect(() => {
     if (!measureRef.current) return;
 
@@ -102,14 +80,6 @@ export function Handlebars({
     setRightHandle(newRight);
   };
 
-  const handleDragStart = () => {
-    setIsDragging(true);
-  };
-
-  const handleDragEnd = () => {
-    setIsDragging(false);
-  };
-
   return (
     <div className="flex justify-center gap-4 leading-[4rem] mt-0 md:mt-2">
       <div
@@ -125,10 +95,8 @@ export function Handlebars({
         style={{ width: contentWidth }}
       >
         <div className="absolute inset-0 w-full h-full rounded-2xl border border-yellow-500 flex justify-between">
-          {/* Left Handle */}
           <motion.div
-            className="h-full border border-yellow-500 rounded-full bg-accent flex items-center justify-center cursor-ew-resize select-none touch-none
-                       w-9 md:w-7 min-h-[44px] md:min-h-0"
+            className="h-full border border-yellow-500 w-7 rounded-full bg-accent flex items-center justify-center cursor-ew-resize select-none"
             style={{
               position: "absolute",
               x: leftHandleX,
@@ -140,24 +108,19 @@ export function Handlebars({
             dragElastic={0}
             dragMomentum={false}
             onDrag={handleLeftDrag}
-            onDragStart={handleDragStart}
-            onDragEnd={handleDragEnd}
             whileHover={{ scale: 1.05 }}
             whileDrag={{ scale: 1.1 }}
-            whileTap={{ scale: 1.1 }}
             transition={{ type: "spring", stiffness: 400, damping: 30 }}
           >
             <div className="w-2 h-8 rounded-full bg-yellow-500"></div>
           </motion.div>
 
-          {/* Right Handle */}
           <motion.div
-            className="h-full border border-yellow-500 rounded-full bg-accent flex items-center justify-center cursor-ew-resize select-none touch-none
-                       w-9 md:w-7 min-h-[44px] md:min-h-0"
+            className="h-full border border-yellow-500 w-7 rounded-full bg-accent flex items-center justify-center cursor-ew-resize select-none"
             style={{
               position: "absolute",
               x: rightHandleX,
-              left: -36, // Adjusted for larger mobile handle
+              left: -30,
               zIndex: 10,
             }}
             drag="x"
@@ -168,11 +131,8 @@ export function Handlebars({
             dragElastic={0}
             dragMomentum={false}
             onDrag={handleRightDrag}
-            onDragStart={handleDragStart}
-            onDragEnd={handleDragEnd}
             whileHover={{ scale: 1.05 }}
             whileDrag={{ scale: 1.1 }}
-            whileTap={{ scale: 1.1 }}
             transition={{ type: "spring", stiffness: 400, damping: 30 }}
           >
             <div className="w-2 h-8 rounded-full bg-yellow-500"></div>
@@ -201,4 +161,4 @@ export function Handlebars({
       </div>
     </div>
   );
-}
+};
-- 
cgit v1.3.1