Files

64 lines
1.9 KiB
TypeScript

'use client';
import Hero from "@/components/content/Hero";
import Testimonials from "@/components/content/Testimonials";
import RotatingWord from "@/components/content/RotatingWord";
import SectionLabel from "@/components/layout/SectionLabel";
import AccentLink from "@/components/navigation/AccentLink";
import ProjectCard from "@/components/content/ProjectCard";
import { testimonials, projects } from "@/constants";
export default function HomePage() {
return (
<div>
<Hero label="Angel Mankel">
<div className="space-y-5 mb-4">
<p className="font-serif italic text-3xl leading-[1.3]">
I&apos;m{" "}
<RotatingWord
items={["a developer", "a creative", "a builder", "a tinkerer"]}
/>
.
</p>
<p className="text-[19px] leading-[1.65]">
I build software people actually use, and I care about the people on
the other side of it as much as the code.
</p>
<p className="text-[19px] leading-[1.65]">
I&apos;ll pick up whatever a problem needs and keep digging until it
works. The constant isn&apos;t a particular stack it&apos;s the
curiosity that got me here.
</p>
</div>
<div>
<AccentLink label="About Me" link="/about" />
</div>
</Hero>
{/* Projects */}
<div className="mt-20">
<SectionLabel label="Selected Projects" />
{projects.slice(0,3).map((project, index) => (
<ProjectCard key={index} {...project} />
))}
<div className="mt-5">
<AccentLink label="See all projects" link="/projects" />
</div>
</div>
{/* Testimonials */}
<div className="mt-20">
<SectionLabel label="What people say" />
<div className="mt-5">
<Testimonials items={testimonials} />
</div>
</div>
</div>
);
}