39 lines
884 B
Plaintext
39 lines
884 B
Plaintext
---
|
|
interface Skill {
|
|
category: string;
|
|
details: string[];
|
|
icon?: string;
|
|
}
|
|
|
|
interface Props {
|
|
lang: string;
|
|
skills: Skill[];
|
|
}
|
|
|
|
const { skills, lang } = Astro.props;
|
|
---
|
|
|
|
<section class="mb-4">
|
|
<h3 class="text-xl font-semibold mb-2 text-gray-800">
|
|
{lang === "de" ? "Fähigkeiten" : "Skills"}
|
|
</h3>
|
|
<div class="flex flex-col gap-2">
|
|
{
|
|
skills.map((skill) => (
|
|
<div class="bg-gray-50 p-3 rounded-lg break-inside-avoid">
|
|
<h4 class="font-bold text-gray-800 mb-2">
|
|
{skill.icon} {skill.category}
|
|
</h4>
|
|
<div class="flex flex-wrap gap-2">
|
|
{skill.details.map((s) => (
|
|
<span class="bg-white px-2 py-0.5 rounded-full text-sm text-gray-700 border border-gray-200">
|
|
{s}
|
|
</span>
|
|
))}
|
|
</div>
|
|
</div>
|
|
))
|
|
}
|
|
</div>
|
|
</section>
|