Files
liam-portfolio/src/app/(app)/projects/page.tsx

35 lines
1.4 KiB
TypeScript

import ProjectCard from "@/components/project-card";
import Rule from "@/components/horizontal-rule";
import { getProjects } from "@/services/projects-service";
import Image from "next/image";
import Link from "next/link";
import { Fragment } from "react";
import ProfileImage from "../../../../public/images/liam_pietralla.jpg";
const ProjectsPage = async () => {
const projects = await getProjects();
return (
<div className="flex flex-col gap-4 justify-center items-center my-15">
<div className="flex flex-row items-center gap-2 my-2">
<Image src={ProfileImage} alt="Liam Pietralla" className="rounded-full max-w-[50px]" />
<Link href="/" className="group leading-relaxed font-semi-bold">
Liam Pietralla
<span className="block max-w-0 group-hover:max-w-full transition-all duration-500 h-0.5 bg-white"></span>
</Link>
</div>
<h1 className="text-5xl font-bold">Projects</h1>
<h2>A collection of interesting projects that I am working on currently or have worked on in the past.</h2>
<div className="flex flex-col gap-4">
{projects.docs.map((project, index) => (
<Fragment key={index}>
<ProjectCard {...project} />
{index < projects.docs.length - 1 && <Rule />}
</Fragment>
))}
</div>
</div>
)
}
export default ProjectsPage;