fads

neerajrekwar · Jun 15, 2024 · a52cf0f · a52cf0f
1 parent 6f11b3a
commit a52cf0f
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 10 deletions.
diff --git a/app/components/BackgroundAurra.tsx b/app/components/BackgroundAurra.tsx
@@ -3,8 +3,9 @@
 import { motion } from "framer-motion";
 import React from "react";
 import { AuroraBackground } from "./ui/aurora-background";
+import HeroSection from "./heroSection";
 
-export function AuroraBackgroundDemo() {
+export function AuroraBackgroundHeroSection() {
   return (
     <AuroraBackground>
       <motion.div
@@ -17,6 +18,7 @@ export function AuroraBackgroundDemo() {
         }}
         className="relative flex flex-col gap-4 items-center justify-center px-4"
       >
+        <HeroSection />
         <div className="text-3xl md:text-7xl font-bold dark:text-white text-center">
           Background lights are cool you know.
         </div>

diff --git a/app/components/heroSection.tsx b/app/components/heroSection.tsx
@@ -4,16 +4,16 @@ import Image from "next/image";
 export function HeroSection() {
   return (
     <>
-      <section className="m-2 bg-white ">
+      <section className="bg-transparent ">
         <div className="p-1">
           <figure className="flex-1 sm:flex ">
-            <div className=" lg:w-[50vw] grid sm:justify-items-end justify-items-center  md:w-[20vw] gi">
+            <div className=" lg:w-[50vw]  h-[12rem] border-lime-600 grid items-center sm:justify-items-end justify-items-center  md:w-[20vw] gi">
               <Image
                 src="/me.jpg"
                 width={350}
                 height={350}
                 alt="Picture of the author"
-                className="rounded shadow-[0_2.8px_2.2px_rgba(0,_0,_0,_0.034),_0_6.7px_5.3px_rgba(0,_0,_0,_0.048),_0_12.5px_10px_rgba(0,_0,_0,_0.06),_0_22.3px_17.9px_rgba(0,_0,_0,_0.072),_0_41.8px_33.4px_rgba(0,_0,_0,_0.086),_0_100px_80px_rgba(0,_0,_0,_0.12)]"
+                className="rounded h-[8rem] w-[8rem] sm:w-auto sm:h-auto shadow-[0_2.8px_2.2px_rgba(0,_0,_0,_0.034),_0_6.7px_5.3px_rgba(0,_0,_0,_0.048),_0_12.5px_10px_rgba(0,_0,_0,_0.06),_0_22.3px_17.9px_rgba(0,_0,_0,_0.072),_0_41.8px_33.4px_rgba(0,_0,_0,_0.086),_0_100px_80px_rgba(0,_0,_0,_0.12)]"
               />
             </div>
             <div className="m-2 md:w-[70vw] self-end">

diff --git a/app/components/ui/text-generate-effect.tsx b/app/components/ui/text-generate-effect.tsx
@@ -45,7 +45,7 @@ export const TextGenerateEffect = ({
   return (
     <div className={cn("font-bold", className)}>
       <div className="mt-4">
-        <div className=" dark:text-white text-[#5e716a] text-xl leading-snug tracking-wide">
+        <div className=" dark:text-white text-[#5e716a] text-base leading-snug tracking-wide">
           {renderWords()}
         </div>
       </div>

diff --git a/app/page.tsx b/app/page.tsx
@@ -1,18 +1,17 @@
 import Image from "next/image";
 import FlipComponent from "./components/FlipComponent";
 import React from "react";
-import { AuroraBackgroundDemo } from "./components/BackgroundAurra";
+
 import { FlipWordsDemo } from "./components/FlipWords";
 import { LampDemo } from "./components/lampBar";
 import HeroSection from "./components/heroSection";
+import { AuroraBackgroundHeroSection } from "./components/BackgroundAurra";
 
 export default function Home() {
   return (
     <main className="antialiased overflow-hidden">
-      <div className="">
-        <HeroSection />
-      </div>
-      <AuroraBackgroundDemo />
+      <div className=""></div>
+      <AuroraBackgroundHeroSection />
       <div className="overflow-hidden h-screen">
         <FlipWordsDemo />
         <LampDemo />