Touch section is added

src/components/HomePage/Hero/index.tsx

@@ -39,7 +39,7 @@ const Hero = () => {
               <TextGenerateEffect
                 mobScreen={true}
                 className="text-[36px] text-center"
-                words="Hi I'm Ajay Dhangar, The Full Stack Developer"
+                words="Hi I'm Ajay Dhangar, Full Stack Developer"
               />
             </div>
 

src/components/HomePage/Touch/index.tsx

@@ -0,0 +1,33 @@
+import { FaLocationArrow } from "react-icons/fa6";
+import Link from "@docusaurus/Link";
+import MagicButton from "../../../ui/MagicButton";
+import React from "react";
+
+const Touch = () => {
+  return (
+    <div className="w-full pt-20 pb-10 p-4">
+      <div className="flex flex-col items-center">
+        <h1 className="heading text-5xl lg:text-6xl w-[90%]">
+          <span className="text-primaryColor">Ready</span> to take your team to
+          the
+          <span className="text-primaryColor"> next level</span>?
+        </h1>
+        <p className="text-white-200 md:mt-10 my-5 text-center md:w-[70%]">
+          I&apos;m eager to bring my skills and passion for software development
+          to a new role. Let’s connect and explore how I can contribute to your
+          team’s success. I’m looking forward to hearing from you!
+        </p>
+
+        <Link to="mailto:[email protected]">
+          <MagicButton
+            title="Let's get in touch"
+            icon={<FaLocationArrow />}
+            position="right"
+          />
+        </Link>
+      </div>
+    </div>
+  );
+};
+
+export default Touch;

src/css/custom.css

@@ -481,3 +481,6 @@ table, tr, td, th {
 /* ========================= */
 /* --  ChatBot Styles End */
 /* ========================= */
+.text-primaryColor {
+  color: #48df84;
+}

src/pages/index.tsx

@@ -3,7 +3,7 @@ import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
 import Layout from "@theme/Layout";
 import Head from "@docusaurus/Head";
 import Hero from "../components/HomePage/Hero";
-
+import Touch from "../components/HomePage/Touch";
 export default function Home() {
   const { siteConfig } = useDocusaurusContext();
   return (
@@ -25,6 +25,7 @@ export default function Home() {
       </Head>
       <main className="overflow-hidden">
         <Hero />
+        <Touch />
       </main>
     </Layout>
   );