make article state badge gold

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

frontend/src/components/badge.njk

@@ -14,6 +14,10 @@
             padding: var(--small-padding) var(--medium-padding);
         }
 
+        :host([gold]) > div {
+            background-color: var(--gold);
+        }
+
         slot {
             align-items: center;
             display: grid;

frontend/src/components/badge.ts

@@ -10,6 +10,14 @@ export class TesoftBadge extends TesoftComponent {
         const shadowRoot = this.attachShadow({mode: "open"});
         shadowRoot.appendChild(templateContent.cloneNode(true));
     }
+
+    set gold(value: string | null) {
+        if (value === null) {
+            this.removeAttribute("gold")
+        } else {
+            this.setAttribute("gold", "")
+        }
+    }
 }
 
 customElements.define("tesoft-badge", TesoftBadge);

frontend/src/components/blog-article-list.ts

@@ -109,6 +109,7 @@ export class TesoftBlogArticleList extends TesoftComponent {
                     if (badgeText) {
                         const badge = document.createElement("tesoft-badge") as TesoftBadge;
                         badge.textContent = badgeText;
+                        badge.gold = "";
                         heading.appendChild(badge);
                     }
 

frontend/src/components/blog-article.ts

@@ -48,6 +48,7 @@ export class TesoftBlogArticle extends TesoftComponent {
             if (badgeText) {
                 const badge = document.createElement("tesoft-badge") as TesoftBadge;
                 badge.textContent = badgeText;
+                badge.gold = "";
                 this.heading.appendChild(badge);
             }