added styles to hero section

Ridhima10 · Jul 4, 2024 · 752f92d · 752f92d
1 parent ca09656
commit 752f92d
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 5 deletions.
diff --git a/app/components/homepage/about/index.jsx b/app/components/homepage/about/index.jsx
@@ -15,7 +15,7 @@ function AboutSection() {
       </div>
       <div className="grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-16">
         <div className="order-2 lg:order-1">
-          <p className="font-medium mb-5 text-[#16f2b3] text-xl uppercase">
+          <p className="font-medium mb-5 text-[#16f2b3] text-2xl uppercase">
             Who I am?
           </p>
           <p className="text-gray-200 text-sm lg:text-lg">

diff --git a/app/components/homepage/hero-section/index.jsx b/app/components/homepage/hero-section/index.jsx
@@ -32,32 +32,35 @@ function HeroSection() {
           </h1>
 
           <div className="my-12 flex items-center gap-5">
+            <span className="text-2xl text-white font-bold border-b-2 capitalize">connect with me 
+
+              : </span>
             <Link
               href={personalData.github}
               target="_blank"
-              className="transition-all text-white hover:scale-125 duration-300"
+              className="transition-all text-white hover:scale-125 rounded-full duration-300 bg-gradient-to-r from-violet-600 to-pink-600"
             >
               <BsGithub size={30} />
             </Link>
             <Link
               href={personalData.linkedIn}
               target="_blank"
-              className="transition-all text-white hover:scale-125 duration-300"
+              className="transition-all text-white hover:scale-125 duration-300 rounded-full bg-gradient-to-r from-violet-600 to-pink-600"
             >
               <BsLinkedin size={30} />
             </Link>
           </div>
 
           <div className="flex items-center gap-3">
-            <Link
+            {/* <Link
               href="#contact"
               className="bg-gradient-to-r to-pink-500 from-violet-600 p-[1px] rounded-full transition-all duration-300 hover:from-pink-500 hover:to-violet-600"
             >
               <button className="px-3 text-xs md:px-8 py-3 md:py-4 bg-[#0d1224] rounded-full border-none text-center md:text-sm font-medium uppercase tracking-wider text-[#ffff] no-underline transition-all duration-200 ease-out  md:font-semibold flex items-center gap-1 hover:gap-3">
                 <span>Contact me</span>
                 <RiContactsFill size={16} />
               </button>
-            </Link>
+            </Link> */}
 
             {/* <Link className="flex items-center gap-1 hover:gap-3 rounded-full bg-gradient-to-r from-pink-500 to-violet-600 px-3 md:px-8 py-3 md:py-4 text-center text-xs md:text-sm font-medium uppercase tracking-wider text-white no-underline transition-all duration-200 ease-out hover:text-white hover:no-underline md:font-semibold" role="button" target="_blank" href={personalData.resume}
             >