---
import { l } from "../util/util";
import { capitalize } from "./admin/util";

interface Props {
    tag: string;
    noLink?: boolean;
}

const { tag, noLink } = Astro.props;
---

{
    noLink ? (
        <span
            class="inline-block bg-transparent border border-amber-500/30 px-3 py-0.5 text-xs font-semibold text-amber-400 mr-2 uppercase tracking-wider"
            style="font-family: 'Barlow Condensed', sans-serif;"
        >
            {capitalize(tag)}
        </span>
    ) : (
        <a href={l(`/announcements/tags/${tag}`)}>
            <span
                class="inline-block bg-transparent border border-amber-500/30 px-3 py-0.5 text-xs font-semibold text-amber-400 mr-2 uppercase tracking-wider hover:border-amber-400 hover:text-amber-300 transition-colors"
                style="font-family: 'Barlow Condensed', sans-serif;"
            >
                {capitalize(tag)}
            </span>
        </a>
    )
}