update heroText.tsx

VaibhavArora314 · Jun 3, 2024 · b1555e9 · b1555e9
1 parent d41eb30
commit b1555e9
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 7 deletions.
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
diff --git a/frontend/src/components/HeroText.tsx b/frontend/src/components/HeroText.tsx
@@ -6,26 +6,30 @@ export function TypewriterEffectSmoothDemo() {
   const words = [
     {
       text: "Welcome",
-      className:"text-5xl text-white"
+      className:"md:text-5xl text-3xl text-white"
     },
     {
       text: "To",
-      className:"text-5xl text-white"
+      className:"text-white md:text-5xl text-3xl"
     },
     {
       text: "Style",
-      className: "text-blue-500 text-5xl",
+      className: "text-blue-500 md:text-5xl text-3xl",
     },
     {
       text: "Share",
-      className: "text-blue-500 text-5xl",
+      className: "text-blue-500 md:text-5xl text-3xl",
     },
 
   ];
   return (
+    <div className="max-w-screen-xl mx-auto">
+
     <div className=" mx-autofont-bold mb-4">
       <TypewriterEffectSmooth words={words} />
       </div>
+      </div>
+
 
   );
 }
diff --git a/frontend/src/pages/Home.tsx b/frontend/src/pages/Home.tsx
@@ -11,7 +11,7 @@ function Home() {
             {/* Welcome to Style Share */}
             <TypewriterEffectSmoothDemo/>
             </h1>
-          <p className="text-[1.3rem]  mb-6 text-gray-300">
+          <p className="md:text-[1.3rem] text-[1.1rem]  mb-6 text-gray-300">
             A simple web based platform where users can easily create, explore,
             and share Tailwind CSS components and designs with fellow users.
           </p>
@@ -20,7 +20,7 @@ function Home() {
             <MagicButton title="Explore" ></MagicButton>
             </Link>
           </div>
-        </div>
+         </div>
         {/* <div className="h-58 w-45 bg-red"></div> */}
         <div className="hidden md:block">
           <img src={"https://img.freepik.com/free-vector/hand-drawn-web-developers_23-2148819604.jpg?w=996&t=st=1717153877~exp=1717154477~hmac=e1058df089e7d3f064f8e2a261e53f09f5aac845bf99095fcd7bf80767d31fa1"} alt="Code" className="rounded-lg shadow-lg shadow-blue-500/50 w-144" />