From 28dcee5c50611232f94accfcbc511b8c92ed1ec8 Mon Sep 17 00:00:00 2001
From: KrishCodesw <krishjain.w@gmail.com>
Date: Sun, 21 Dec 2025 17:35:00 +0530
Subject: [PATCH] fix: resolve clipped get started button in hero section

---
 .../src/components/landing-sections/Hero.tsx  |  7 +-
 apps/web/src/components/ui/custom-button.tsx  | 66 +++++++++++--------
 2 files changed, 42 insertions(+), 31 deletions(-)

diff --git a/apps/web/src/components/landing-sections/Hero.tsx b/apps/web/src/components/landing-sections/Hero.tsx
index 414875cb..65838aca 100644
--- a/apps/web/src/components/landing-sections/Hero.tsx
+++ b/apps/web/src/components/landing-sections/Hero.tsx
@@ -38,7 +38,7 @@ const Hero = () => {
     trackButtonClick("Get Started", "hero");
   };
   return (
-    <div className="w-full min-h-[50dvh] lg:h-[69dvh] relative overflow-hidden z-10 p-4 lg:p-[60px] flex flex-col items-center justify-center gap-6 ">
+    <div className="w-full min-h-[50dvh] lg:min-h-[69dvh] relative overflow-hidden z-10 p-4 lg:p-[60px] flex flex-col items-center justify-center gap-6 ">
       <Image
         src="/assets/bgmain.svg"
         alt="background"
@@ -88,8 +88,9 @@ const Hero = () => {
           }}
           className="w-full lg:text-2xl tracking-tight font-light sm:max-w-lg mx-auto lg:max-w-4xl lg:text-balance text-text-secondary"
         >
-          Find suitabe OSS repos in seconds. learn the basics,
-          get the mentorship for OSS opportunities, GSoC, etc, and start making progress from today itself.
+          Find suitabe OSS repos in seconds. learn the basics, get the
+          mentorship for OSS opportunities, GSoC, etc, and start making progress
+          from today itself.
         </motion.p>
       </motion.div>
       <motion.div
diff --git a/apps/web/src/components/ui/custom-button.tsx b/apps/web/src/components/ui/custom-button.tsx
index 803c0b05..108e4644 100644
--- a/apps/web/src/components/ui/custom-button.tsx
+++ b/apps/web/src/components/ui/custom-button.tsx
@@ -1,31 +1,41 @@
-"use client"
+"use client";
 
-import { cn } from "@/lib/utils"
-import { motion } from "framer-motion"
-import type React from "react"
+import { cn } from "@/lib/utils";
+import { motion } from "framer-motion";
+import type React from "react";
 
-const PrimaryButton = ({ children, animate = true, classname, onClick }: { children: React.ReactNode, animate?: boolean, classname?: string, onClick?: () => void }) => {
-    const transition = {
-        duration: 0.1,
-        ease: "easeInOut",
-    }
-    return (
-        <motion.button
-            onClick={onClick}
-            className={cn(
-                "flex gap-2 items-center justify-center px-5 py-3 rounded-[16px] relative",
-                "border-x border-t-2 border-brand-purple",
-                "bg-gradient-to-b from-[#5728f4] to-[#5100FF]",
-                "[box-shadow:0px_-2px_0px_0px_#2c04b1_inset]",
-                "hover:opacity-90 transition-opacity duration-100",
-                "text-white font-medium",
-                classname
-            )}
-            transition={animate ? transition : undefined}
-        >
-            {children}
-        </motion.button>
-    )
-}
+const PrimaryButton = ({
+  children,
+  animate = true,
+  classname,
+  onClick,
+}: {
+  children: React.ReactNode;
+  animate?: boolean;
+  classname?: string;
+  onClick?: () => void;
+}) => {
+  const transition = {
+    duration: 0.1,
+    ease: "easeInOut",
+  };
+  return (
+    <motion.button
+      onClick={onClick}
+      className={cn(
+        "flex gap-2 items-center justify-center px-5 py-3 rounded-[16px] relative",
+        "border-x border-t-2 border-brand-purple",
+        "bg-gradient-to-b from-[#5728f4] to-[#5100FF]",
+        "[box-shadow:0px_-2px_0px_0px_#2c04b1_inset]",
+        "hover:opacity-90 transition-opacity duration-100",
+        "text-white font-medium",
+        classname
+      )}
+      transition={animate ? transition : undefined}
+    >
+      {children}
+    </motion.button>
+  );
+};
 
-export default PrimaryButton
+export default PrimaryButton;