Add tooltip support to project tags

This commit is contained in:
2026-06-10 07:02:38 +00:00
parent f1cc0ac567
commit 1fabcf2eef
+10 -5
View File
@@ -1,12 +1,14 @@
---
import { Icon } from "astro-icon/components";
import Section from "./ui/Section.astro";
import Tooltip from "./ui/Tooltip.astro";
const { projects } = Astro.props;
interface ProjectTag {
name: string;
icon?: string;
tooltip?: string;
}
interface ProjectProps {
@@ -40,11 +42,14 @@ interface ProjectProps {
<div class="flex flex-wrap gap-2 mb-6">
{project.tags.map((tag: ProjectTag) => (
<span class="inline-flex items-center px-3 py-1 bg-gray-800 text-gray-300 text-sm rounded-full">
<Icon
name={tag.icon}
class="w-6 h-6 mr-2"
data-inline="false"
/>
<div class="relative group">
<Icon
name={tag.icon}
class="w-6 h-6 mr-2"
data-inline="false"
/>
<Tooltip tooltip={tag.tooltip} />
</div>
</span>
))}
{project.liveUrl && (