- fixed: error changing an uncontrolled input to be controlled

- code enhancement for better code readability via code formatting
CuriousCoder00 · Nov 10, 2024 · 0f2f29e · 0f2f29e
1 parent 13a9a27
commit 0f2f29e
Show file tree

Hide file tree

Showing 27 changed files with 11,015 additions and 2,691 deletions.
diff --git a/app/about/page.tsx b/app/about/page.tsx
@@ -1,43 +1,69 @@
-import Image from 'next/image';
-import Link from 'next/link';
-import Container from '@/components/shared/Container';
-import Topic from '@/components/shared/Topic';
+import Image from "next/image";
+import Link from "next/link";
+import Container from "@/components/shared/Container";
+import Topic from "@/components/shared/Topic";
 
 const companyHistory = [
-  { year: '2019', event: 'Founded AceXLabs' },
-  { year: '2020', event: 'Expanded services to include Blockchain and SEO' },
-  { year: '2021', event: 'Opened second office and doubled team size' },
-  { year: '2023', event: 'Expanded services to include AI/ML Development' },
+  { year: "2019", event: "Founded AceXLabs" },
+  { year: "2020", event: "Expanded services to include Blockchain and SEO" },
+  { year: "2021", event: "Opened second office and doubled team size" },
+  { year: "2023", event: "Expanded services to include AI/ML Development" },
 ];
 
 const teamHighlights = [
-  { name: 'Pratik Tiwari', role: 'Senior Engineer', image: 'https://avatars.githubusercontent.com/u/64960569?v=4' },
-  { name: 'Jacques', role: 'Senior AI Engineer', image: 'https://pbs.twimg.com/profile_images/1764600506721116160/ZI5JGcHu_400x400.jpg' },
-  { name: 'Axat Bhardwaj', role: 'Smart Contract Engineer', image: 'https://pbs.twimg.com/profile_images/1847924192085479424/d8vknhTn_400x400.jpg' },
+  {
+    name: "Pratik Tiwari",
+    role: "Senior Engineer",
+    image: "https://avatars.githubusercontent.com/u/64960569?v=4",
+  },
+  {
+    name: "Jacques",
+    role: "Senior AI Engineer",
+    image:
+      "https://pbs.twimg.com/profile_images/1764600506721116160/ZI5JGcHu_400x400.jpg",
+  },
+  {
+    name: "Axat Bhardwaj",
+    role: "Smart Contract Engineer",
+    image:
+      "https://pbs.twimg.com/profile_images/1847924192085479424/d8vknhTn_400x400.jpg",
+  },
 ];
 
 export default function AboutUs() {
   return (
     <Container>
-      <div className="relative flex flex-col items-center md:flex-row mt-32" id="about-us">
-        <Topic title="About Us" description="Learn about our journey, mission, and the team behind our success in product development" />
+      <div
+        className="relative flex flex-col items-center md:flex-row mt-32"
+        id="about-us"
+      >
+        <Topic
+          title="About Us"
+          description="Learn about our journey, mission, and the team behind our success in product development"
+        />
       </div>
       <div className="flex flex-col gap-12 py-10">
         <div className="p-12 bg-zinc-100 dark:bg-background rounded-[45px] border border-zinc-300 dark:border-zinc-700 [box-shadow:0_-20px_80px_-20px_#8686f01f_inset]">
           <h2 className="text-3xl font-medium mb-6">Our Mission</h2>
           <p className="text-xl">
-            Our mission is to empower businesses with innovative product development strategies, cutting-edge AI, Blockchain, App Development, and SEO
-            solutions. We&apos;re passionate about building meaningful connections between brands and their audiences, using advanced technology and
-            data-driven insights to drive exceptional outcomes. By focusing on impactful strategies and seamless digital experiences, we help brands
-            not only reach their potential but also thrive in an ever-evolving digital landscape.
+            Our mission is to empower businesses with innovative product
+            development strategies, cutting-edge AI, Blockchain, App
+            Development, and SEO solutions. We&apos;re passionate about building
+            meaningful connections between brands and their audiences, using
+            advanced technology and data-driven insights to drive exceptional
+            outcomes. By focusing on impactful strategies and seamless digital
+            experiences, we help brands not only reach their potential but also
+            thrive in an ever-evolving digital landscape.
           </p>
         </div>
         <div className="p-12 bg-zinc-100 dark:bg-background rounded-[45px] border border-zinc-300 dark:border-zinc-700 [box-shadow:0_-20px_80px_-20px_#8686f01f_inset]">
           <h2 className="text-3xl font-medium mb-6">Our Journey</h2>
           <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
             {companyHistory.map((item, index) => (
               <div key={index} className="flex items-start gap-4">
-                <div className="text-2xl font-bold text-primary">{item.year}</div>
+                <div className="text-2xl font-bold text-primary">
+                  {item.year}
+                </div>
                 <div className="text-xl">{item.event}</div>
               </div>
             ))}
@@ -47,19 +73,35 @@ export default function AboutUs() {
           <h2 className="text-3xl font-medium mb-6">Meet Our Leadership</h2>
           <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-8">
             {teamHighlights.map((member, index) => (
-              <div key={index} className="flex flex-col items-center text-center">
-                <Image src={member.image} alt={member.name} width={150} height={150} className="rounded-full mb-4" />
+              <div
+                key={index}
+                className="flex flex-col items-center text-center"
+              >
+                <Image
+                  src={member.image}
+                  alt={member.name}
+                  width={150}
+                  height={150}
+                  className="rounded-full mb-4"
+                />
                 <h3 className="text-xl font-medium">{member.name}</h3>
-                <p className="text-lg text-gray-600 dark:text-gray-400">{member.role}</p>
+                <p className="text-lg text-gray-600 dark:text-gray-400">
+                  {member.role}
+                </p>
               </div>
             ))}
           </div>
         </div>
         <div className="p-12 bg-gray-900 rounded-[45px] text-white">
           <div className="grid grid-cols-1 md:grid-cols-2 gap-8 items-center">
             <div>
-              <h2 className="text-3xl font-medium mb-4">Ready to grow your business?</h2>
-              <p className="text-xl mb-6">Let&apos;s collaborate to create a tailored digital services that drives results for your brand.</p>
+              <h2 className="text-3xl font-medium mb-4">
+                Ready to grow your business?
+              </h2>
+              <p className="text-xl mb-6">
+                Let&apos;s collaborate to create a tailored digital services
+                that drives results for your brand.
+              </p>
               <Link
                 href="https://cal.com/acex-labs"
                 className="px-8 py-4 bg-primary text-black rounded-[14px] text-xl font-normal inline-block hover:bg-primary-dark transition-colors"
@@ -68,7 +110,13 @@ export default function AboutUs() {
               </Link>
             </div>
             <div className="hidden md:block">
-              <Image src="./services/04.svg" alt="Team collaboration illustration" width={400} height={300} className="invert" />
+              <Image
+                src="./services/04.svg"
+                alt="Team collaboration illustration"
+                width={400}
+                height={300}
+                className="invert"
+              />
             </div>
           </div>
         </div>

diff --git a/app/globals.css b/app/globals.css
@@ -102,33 +102,30 @@ body {
   }
 }
 
-
 /* accordion style */
 
 .accordion__icon::before,
-  .accordion__icon::after {
-    content: "";
-    position: absolute;
-    background-color: rgb(223, 209, 209);
-    transition: opacity 0.3s ease;
-  }
-
-  .accordion__icon::before {
-    width: 100%;
-    height: 6px; /* Increased from 2px to 6px */
-    left: 0;
-    top: calc(50% - 3px); /* Adjusted to center the thicker line */
-  }
+.accordion__icon::after {
+  content: "";
+  position: absolute;
+  background-color: rgb(223, 209, 209);
+  transition: opacity 0.3s ease;
+}
 
-  .accordion__icon::after {
-    width: 6px; /* Increased from 2px to 6px */
-    height: 100%;
-    left: calc(50% - 3px); /* Adjusted to center the thicker line */
-    top: 0;
-  }
+.accordion__icon::before {
+  width: 100%;
+  height: 6px; /* Increased from 2px to 6px */
+  left: 0;
+  top: calc(50% - 3px); /* Adjusted to center the thicker line */
+}
 
-  .accordion__icon.collapsed::after {
-    opacity: 0;
-  }
+.accordion__icon::after {
+  width: 6px; /* Increased from 2px to 6px */
+  height: 100%;
+  left: calc(50% - 3px); /* Adjusted to center the thicker line */
+  top: 0;
+}
 
-
+.accordion__icon.collapsed::after {
+  opacity: 0;
+}
diff --git a/app/pricing/page.tsx b/app/pricing/page.tsx
@@ -1,11 +1,10 @@
-import PricingSection from "@/components/Pricing/PricingSection"
+import PricingSection from "@/components/Pricing/PricingSection";
 
-const page = ()=> {
-
-    return (
-        <div>
-            <PricingSection/>
-        </div>
-    )
-}
-export default page;
+const page = () => {
+  return (
+    <div>
+      <PricingSection />
+    </div>
+  );
+};
+export default page;
diff --git a/app/team/page.tsx b/app/team/page.tsx
@@ -1,8 +1,9 @@
 import Team from "@/components/Team/Team";
 
-
 export default function Page() {
-    return <>
-    <Team/>
+  return (
+    <>
+      <Team />
     </>
-}
+  );
+}
diff --git a/components/Pricing/PricingSection.tsx b/components/Pricing/PricingSection.tsx
@@ -1,11 +1,11 @@
-'use client'
+"use client";
 
-import { Button } from "@/components/ui/button"
-import { usePathname, useRouter } from "next/navigation"
-import { MvpCard } from "./MvpCard"
-import { StartupCard } from "./StartupCard"
-import { GrowthCard } from "./GrowthCard"
-import Topic from "../shared/Topic"
+import { Button } from "@/components/ui/button";
+import { usePathname, useRouter } from "next/navigation";
+import { MvpCard } from "./MvpCard";
+import { StartupCard } from "./StartupCard";
+import { GrowthCard } from "./GrowthCard";
+import Topic from "../shared/Topic";
 
 export default function Component() {
   const router = useRouter();
@@ -21,22 +21,25 @@ export default function Component() {
       </div>
       <div className="grid md:grid-cols-3 gap-8">
         {/* MVP Development Package Card rand*/}
-        <MvpCard/>
+        <MvpCard />
         {/* Startup Booster Package Card */}
-        <StartupCard/>
+        <StartupCard />
         {/* Growth Retainer Package Card */}
-        <GrowthCard/>
+        <GrowthCard />
       </div>
-      { currentPath === '/' &&
-      <div className="mx-auto flex justify-center items-center">
-        <Button variant="outline" className="w-auto mt-12 text-white border-white hover:bg-white hover:text-black rounded-xl py-4 px-8 text-sm transition-all duration-300"
-        onClick={()=>{
-          router.push("/pricing");
-        }}>
-              View Details
-            </Button>
-            </div>
-}
+      {currentPath === "/" && (
+        <div className="mx-auto flex justify-center items-center">
+          <Button
+            variant="outline"
+            className="w-auto mt-12 text-white border-white hover:bg-white hover:text-black rounded-xl py-4 px-8 text-sm transition-all duration-300"
+            onClick={() => {
+              router.push("/pricing");
+            }}
+          >
+            View Details
+          </Button>
+        </div>
+      )}
     </div>
-  )
+  );
 }
diff --git a/components/Team/Hero.tsx b/components/Team/Hero.tsx
@@ -1,28 +1,27 @@
-"use client"
+"use client";
 import GradualSpacing from "../farmui/GradualSpacing";
 
-
-export const Hero = ({isInView}:{isInView:boolean}) => {
-      return (
+export const Hero = ({ isInView }: { isInView: boolean }) => {
+  return (
     <>
-              <GradualSpacing
-              textClassName="justify-start"
-              visiblity={isInView}
-              className="max-w-[400px] text-6xl font-normal tracking-tighter text-transparent text-white max-sm:text-4xl font-geist"
-              text={"We believe file"}
-              />
-            <GradualSpacing
-              textClassName="justify-start"
-              visiblity={isInView}
-              className="max-w-[400px] text-6xl font-normal tracking-tighter text-transparent text-white max-sm:text-4xl font-geist"
-              text={"management should be"}
-              />
-              <GradualSpacing
-              textClassName="justify-start"
-              visiblity={isInView}
-              className="max-w-[400px] text-6xl font-normal tracking-tighter text-transparent text-white max-sm:text-4xl font-geist"
-              text={"universal"}
-              />
+      <GradualSpacing
+        textClassName="justify-start"
+        visiblity={isInView}
+        className="max-w-[400px] text-6xl font-normal tracking-tighter text-transparent text-white max-sm:text-4xl font-geist"
+        text={"We believe file"}
+      />
+      <GradualSpacing
+        textClassName="justify-start"
+        visiblity={isInView}
+        className="max-w-[400px] text-6xl font-normal tracking-tighter text-transparent text-white max-sm:text-4xl font-geist"
+        text={"management should be"}
+      />
+      <GradualSpacing
+        textClassName="justify-start"
+        visiblity={isInView}
+        className="max-w-[400px] text-6xl font-normal tracking-tighter text-transparent text-white max-sm:text-4xl font-geist"
+        text={"universal"}
+      />
 
       <p className="sm:break-words animation-delay-2 fade-in-heading text-white/50 mt-10">
         Your priceless personal data shouldn&apos;t be stuck in a device

diff --git a/components/Team/Team.tsx b/components/Team/Team.tsx
@@ -10,7 +10,6 @@ import { TeamSection } from "./TeamSection";
 import { teamData } from "@/data/process";
 import { useInView } from "framer-motion";
 
-
 export default function Team() {
   const ref = useRef(null);
   const isInView = useInView(ref);
@@ -24,8 +23,8 @@ export default function Team() {
         <div className="relative h-screen">
           <div className="flex flex-col md:flex-row justify-between h-full items-center mx-auto">
             <div ref={ref} className="mx-auto max-sm:max-w-[400px] md:mt-72">
-              <Hero isInView={isInView}/>
-              <TeamSection teamData={teamData}/>
+              <Hero isInView={isInView} />
+              <TeamSection teamData={teamData} />
             </div>
 
             <div className="absolute right-0 bottom-0 left-0 mx-auto opacity-20"></div>

diff --git a/components/Team/TeamSection.tsx b/components/Team/TeamSection.tsx
@@ -1,5 +1,5 @@
-import { TeamMember } from '@/data/TeamMember';
-import Image from 'next/image';
+import { TeamMember } from "@/data/TeamMember";
+import Image from "next/image";
 
 interface TeamSectionProps {
   teamData: TeamMember[];
@@ -9,7 +9,10 @@ interface TeamSectionProps {
 export const TeamSection = ({ teamData }: TeamSectionProps) => {
   return (
     <>
-      <h2 id="team" className="mb-2 mt-10 text-2xl font-bold leading-relaxed sm:mt-20">
+      <h2
+        id="team"
+        className="mb-2 mt-10 text-2xl font-bold leading-relaxed sm:mt-20"
+      >
         Meet the team
       </h2>
       <div className="flex-row items-center py-5" id="team">
@@ -23,7 +26,13 @@ export const TeamSection = ({ teamData }: TeamSectionProps) => {
                 <div className="self-stretch justify-start items-start inline-flex">
                   <div className="grow shrink basis-0 justify-start items-center gap-8 flex">
                     <div className="h-[102.82px] left-0 top-0 relative">
-                      <Image src={member.profile} alt={member.name} height={100} width={100} className="rounded-full" />
+                      <Image
+                        src={member.profile}
+                        alt={member.name}
+                        height={100}
+                        width={100}
+                        className="rounded-full"
+                      />
                     </div>
                     <div className="flex-col justify-end items-start inline-flex">
                       <div className="text-lg font-normal">{member.title}</div>