allow to disable tags

Signed-off-by: Tobias Erbshäußer <tobias@tesoft.dev>

frontend/src/components/tag.njk

@@ -12,6 +12,7 @@
             gap: var(--small-padding);
             grid-template-columns: auto auto;
             grid-template-rows: auto;
+            padding: var(--small-padding) var(--medium-padding);
         }
 
         svg {

frontend/src/components/tag.ts

@@ -2,7 +2,7 @@ import {TesoftComponent} from "../scripts/main.ts";
 import {TesoftButton} from "./button.ts";
 
 export class TesoftTag extends TesoftComponent {
-    static observedAttributes = ["href", "selected"];
+    static observedAttributes = ["disabled", "href", "selected"];
 
     private readonly button: TesoftButton;
 
@@ -20,7 +20,11 @@ export class TesoftTag extends TesoftComponent {
 
     // noinspection JSUnusedGlobalSymbols
     attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null) {
-        if (name === "href") {
+        if (name === "disabled") {
+            setTimeout(() => {
+                this.button.disabled = newValue;
+            });
+        } else if (name === "href") {
             setTimeout(() => {
                 this.button.href = newValue ?? "";
             });
@@ -31,6 +35,14 @@ export class TesoftTag extends TesoftComponent {
         }
     }
 
+    set disabled(value: string | null) {
+        if (value === null) {
+            this.removeAttribute("disabled");
+        } else {
+            this.setAttribute("disabled", "");
+        }
+    }
+
     set href(value: string | null) {
         if (value) {
             this.setAttribute("href", value);