feat: create Chip component for displaying technology tags feat: implement ExperienceCard component to showcase job experiences feat: add Experience component to list multiple job experiences feat: create Footer component with social links and copyright information feat: implement Hero component for the landing section with social links feat: add ImageCarousel component for displaying project images feat: create Navbar component with scroll effect and navigation links feat: implement ProjectItem component to display individual project details feat: add Skills component to showcase technical skills feat: create data module with skills, jobs, and projects information feat: define types for Skill, Job, and Project in types module chore: update package.json with new dependencies for Tailwind CSS and Lucide icons chore: add CV PDF file to public directory chore: remove unused SVG files from public directory chore: add new images for background and hero sections feat: implement formatDate utility function for date formatting
31 lines
1.1 KiB
TypeScript
31 lines
1.1 KiB
TypeScript
import { Job } from "@/lib/types";
|
|
import { CircleUserRound, Building, Clock, Microchip } from "lucide-react";
|
|
import Chip from "./chip";
|
|
import formatDate from "@/utils/format-date";
|
|
|
|
const ExperienceCard = ({ job }: { job: Job }) => (
|
|
<div className="bg-transparent backdrop-blur-sm glass-effect flex flex-col gap-2 p-4 text-white w-[20rem] max-w-[20rem] rounded-lg shadow-lg">
|
|
<h4 className="flex items-center gap-1 text-2xl">
|
|
<CircleUserRound /> {job.position}
|
|
</h4>
|
|
<h5 className="flex items-center gap-1 text-xl font-light">
|
|
<Building /> {job.company}
|
|
</h5>
|
|
<h6 className="flex items-center gap-1">
|
|
<Clock />
|
|
{formatDate(job.start_date)} -{" "}
|
|
{job.still_working ? "Present" : formatDate(job.end_date!)}
|
|
</h6>
|
|
<p className="flex items-center gap-1 font-bold">
|
|
<Microchip /> Technologies
|
|
</p>
|
|
<div className="flex flex-wrap items-center w-full gap-2">
|
|
{job.technologies.map((tech) => (
|
|
<Chip key={tech} text={tech} />
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
|
|
export default ExperienceCard;
|