Astro/Fix Tag Component (#1188)

Fix Tag component:
- so hrefs work.
- uses the correct 'nix blue' value.
- so the background fits the contents. Without the `w-fit` class it
looks like the bottom tag instead of the top.

![Screenshot 2023-12-08 at 19-46-50
Explore](https://github.com/NixOS/nixos-homepage/assets/7043297/3a608302-d025-4625-b786-43cec87c45e4)

src/components/ui/Tag.astro

@@ -1,25 +1,34 @@
 ---
 
 interface Props {
-  color?: "orange" | "darkgreen" | "lightblue" | "semidarkblue";
+  color?: "orange" | "darkgreen" | "lightblue" | "darkblue";
   classList?: string[];
+  href?: string | null;
 }
 
 const colorMap = {
   "orange": "bg-nixorange",
   "lightblue": "bg-nixlightblue",
-  "semidarkblue": "bg-nixsemidarkblue",
+  "darkblue": "bg-nixdarkblue",
   "darkgreen": "bg-nixdarkgreen"
 }
 
 const {
-  color = "semidarkblue",
+  color = "darkblue",
   classList = [],
+  href = null,
 } = Astro.props;
 
-const localClassList = `${colorMap[color]} rounded-lg font-bold text-white text-sm px-[0.5rem] py-[0.25rem]`;
+const localClassList = `${colorMap[color]} w-fit rounded-lg font-bold !text-white !no-underline text-sm px-[0.5rem] py-[0.25rem]`;
 ---
 
-<span class:list={[localClassList, classList]}>
-  <slot/>
-</span>
+{href
+  ?
+    <a href={href} class:list={[localClassList, classList]}>
+      <slot/>
+    </a>
+  :
+    <span href={href} class:list={[localClassList, classList]}>
+      <slot/>
+    </span>
+}