Skip to content

Commit

Permalink
gfsd
Browse files Browse the repository at this point in the history
  • Loading branch information
@neerajrekwar
neerajrekwar committed Aug 2, 2024
1 parent fda9c77 commit 8a74046
Show file tree
Hide file tree
Showing 10 changed files with 150 additions and 180 deletions.
32 changes: 32 additions & 0 deletions app/components/AgeCalculator.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
'use client';
import { useState, useEffect } from 'react';

const AgeCalculator: React.FC = () => {
const calculateAge = (dob: Date): number => {
const today = new Date();
const birthDate = new Date(dob);
let age = today.getFullYear() - birthDate.getFullYear();
const m = today.getMonth() - birthDate.getMonth();
if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate())) {
age--;
}
return age;
};

const [age, setAge] = useState<number>(0);

useEffect(() => {
const dob = new Date('2001-10-20');
setAge(calculateAge(dob));
}, []);

return (

<div className="">
<span className="font-semibold pr-1">{age}</span>
</div>

);
};

export default AgeCalculator;
2 changes: 1 addition & 1 deletion app/components/ShootingVsStarts.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ export function ShootingStarsAndStarsBackgroundDemo() {
<div className="text-2xl flex">
<p className="pr-2">I am</p>
<AutoTyper
texts={["Progammer", "Developer", "Designer", "Freelancer", "Digital marketing exp."]}
texts={["Progammer", "Developer", "Designer", "Freelancer", "Digital marketing"]}
/>
</div>
</h2>
Expand Down
13 changes: 0 additions & 13 deletions app/components/SvgAnimation.css
View file

This file was deleted.

5 changes: 2 additions & 3 deletions app/components/footer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,8 +45,7 @@ export default function Footer() {

return (
<>
<section className='three'>
<footer className="bg-seven ">
<footer className="bgrid ">
<div className="p-4 text-five py-10 max-w-6xl m-auto">
<ul className="flex gap-2 mb-8 items-start flex-col">
<li className="">
Expand Down Expand Up @@ -369,7 +368,7 @@ export default function Footer() {
<span >build by me</span>
</div>
</footer>
</section>

</>
);
}
122 changes: 103 additions & 19 deletions app/components/heroSection.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { motion } from "framer-motion";

import { TextGenerateEffect } from "./ui/text-generate-effect";
import { ShootingStarsAndStarsBackgroundDemo } from "./ShootingVsStarts";
import AgeCalculator from "./AgeCalculator";

export function HeroSection() {
return (
Expand All @@ -13,13 +14,16 @@ export function HeroSection() {
<section className="bgrid2 bg-primary text-four min-h-screen">
<div className=" max-w-6xl m-auto">
<div className="bgrid2 z-10 md:text-3xl pt-16 font-bold p-4">
<motion.h2
<motion.h2
initial={{ opacity: 0, x: 20 }}
whileInView={{ opacity: 1, x: 0 }}
animate={{}}
className=" text-2xl ">About Me</motion.h2>
className=" text-2xl w-fit overflow-hidden "
>
About Me
</motion.h2>
</div>
<div className="overflow-hidden min-h-screen gap-2 lg:flex">
<div className="overflow-hidden min-h-screen lg:flex-row-reverse gap-2 lg:flex">
{/* <motion.div
initial={{ opacity: 0, x: 200 }}
whileInView={{ opacity: 1, x: 0 }}
Expand All @@ -30,29 +34,109 @@ export function HeroSection() {
Thinks create, develop, and grow-up tents{" "}
</p>
</motion.div> */}
<div className="border-2 border-five flex justify-center items-center h-80 m-2 rounded-lg basis-1/2"> <motion.div
initial={{ opacity: 0, scale: 0.5 }}
animate={{ opacity: 1, scale: 1 }}
transition={{
duration: 0.8,
delay: 0.5,
ease: [0, 0.71, 0.2, 1.01],
}}
className="flex flex-col justify-center h-60 md:h-auto items-center"
<div className=" mx-2 p-2 z-10 pb-4 rounded-lg basis-1/2">
<motion.p
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
animate={{}}
className="w-fit overflow-x-hidden z-9 py-2 font-semibold px-2 md:p-4 md:px-4 rounded-full md:text-6xl "
>
Who Am I?{" "}
</motion.p>
<motion.h2
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
animate={{}}

className="py-2 px-2 md:p-4 md:px-4 text-xl sm:text-2xl md:text-3xl"
>
I&apos;m Neeraj Rekwar, with Programmer & Digital Marketing
Expert.
</motion.h2>

<div className="md:flex mt-10 ">
<motion.ul
initial={{ opacity: 0, x: 20 }}
whileInView={{ opacity: 1, x: 0 }}
transition={{ duration: 0.6 }}
className="px-2 md:text-lg md:p-4 md:pt-16 md:px-4"
>
<motion.li
initial={{ opacity: 0, x: 20 }}
whileInView={{ opacity: 1, x: 0 }}
animate={{}}
transition={{ duration: 0.8, delay: 0.2 }}
className="flex "
>
<span className="">Native:</span>
<motion.p className="pl-1 font-semibold">
New Delhi
</motion.p>
</motion.li>
<motion.li
initial={{ opacity: 0, x: 20 }}
whileInView={{ opacity: 1, x: 0 }}
animate={{}}
transition={{ duration: 0.8, delay: 0.4 }}
className="flex "
>
<span className="">Current Age:</span>
<motion.p className="pl-1 flex">
<AgeCalculator /> years
</motion.p>
</motion.li>
</motion.ul>
<motion.ul
initial={{ opacity: 0, x: 10 }}
whileInView={{ opacity: 1, x: 0 }}
animate={{}}
transition={{ duration: 0.8 }}
className="md:text-lg px-2 md:p-4 md:pt-16 md:px-4"
>
<motion.li
initial={{ opacity: 0, x: 20 }}
whileInView={{ opacity: 1, x: 0 }}
animate={{}}
transition={{ duration: 1.2, delay: 0.6 }}
className="flex "
>
<span className="">From:</span>
<motion.p className="pl-1 font-semibold">
Madhya Pradesh, Bharat
</motion.p>
</motion.li>
<motion.li
initial={{ opacity: 0, x: 20 }}
whileInView={{ opacity: 1, x: 0 }}
animate={{}}
transition={{ duration: 1.4, delay: 0.8 }}
className="flex "
>
<span className="">Email:</span>
<motion.p className="pl-1 font-semibold">
[email protected]{" "}
</motion.p>
</motion.li>
</motion.ul>
</div>
</div>
<div className="grid justify-center items-center border-five h-max m-2 rounded-lg basis-1/2">
<motion.figure
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
animate={{}}
transition={{ duration: 2 }}
className="overflow-hidden z-20 md:h-[24rem] aspact-sqaure boreder-2 sm:w-[18rem] object-contain sm:h-[18rem] h-auto w-[20rem] "
>
<Image
src="/me_profile.webp"
src="/me_profile2.webp"
width={350}
height={350}
alt="Picture of the author"
className="rounded md:rounded md:h-[18rem] aspact-sqaure boreder-2 sm:w-[18rem] sm:h-[18rem] h-[16rem] w-[16rem] 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="bg-bottom 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)]"
/>
</motion.div>
</div>
<div className=" bg-five h-80 m-2 rounded-lg basis-1/2">
</motion.figure>
</div>


</div>
</div>
</section>
Expand Down
143 changes: 0 additions & 143 deletions app/components/svgAnimation.tsx
View file

This file was deleted.

2 changes: 1 addition & 1 deletion app/globals.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
--color-third: #2cffbf;
--color-four: #3A4F41;
--color-five: #1d3838;
--color-six: #948a00;
--color-six: #E0F2E9;
--color-seven: #47aa841c;
--font-families-secondary: 'Caveat', cursive;

Expand Down
Loading

0 comments on commit 8a74046

Please sign in to comment.