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
32 lines
806 B
TypeScript
32 lines
806 B
TypeScript
import Chip from "@/components/chip";
|
||
import { Skill } from "@/lib/types";
|
||
|
||
interface SkillsProps {
|
||
skills: Skill[];
|
||
}
|
||
|
||
const Skills = ({ skills }: SkillsProps) => {
|
||
return (
|
||
<div
|
||
id="skills"
|
||
className="flex flex-col items-center justify-center gap-4 p-4 rounded w-full"
|
||
>
|
||
<h3 className="mt-4 mb-2 text-5xl font-bold tracking-tight text-white">
|
||
Skills 🛠️
|
||
</h3>
|
||
<div className="flex flex-wrap justify-center w-full max-w-lg gap-4">
|
||
{skills.map((skill, index) => (
|
||
<div
|
||
key={index}
|
||
className="odd:motion-preset-slide-left even:motion-preset-slide-right odd:motion-delay-100"
|
||
>
|
||
<Chip text={skill.name} />
|
||
</div>
|
||
))}
|
||
</div>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
export default Skills;
|