From d0b03df99126c1347b7edef6f8244abc1d6e0c4a Mon Sep 17 00:00:00 2001
From: Amolith <amolith@secluded.site>
Date: Fri, 17 Oct 2025 19:06:05 -0600
Subject: [PATCH] feat: enhance bug label styling in web UI

Add CSS styling for bug labels with proper borders and background
colors. Update the bug template to use styled labels instead of
plain code elements.

Co-Authored-By: Crush <crush@charm.land>
---
 pkg/web/static/overrides.css | 12 ++++++++++++
 pkg/web/templates/bug.html   |  2 +-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/pkg/web/static/overrides.css b/pkg/web/static/overrides.css
index 81871aacd89742f213a97e56edbaf74da1e7b973..a0efe238270208029e64b0cd82c8f8150ca84984 100644
--- a/pkg/web/static/overrides.css
+++ b/pkg/web/static/overrides.css
@@ -172,3 +172,15 @@ article > header > p {
 article > p:only-child {
 	margin-bottom: 0;
 }
+
+.bug-label {
+	display: inline-block;
+	padding: 0.25rem 0.5rem;
+	font-size: 0.875rem;
+	font-weight: 600;
+	line-height: 1;
+	border-radius: 0.25rem;
+	background-color: color-mix(in srgb, var(--label-color) 20%, var(--pico-card-background-color));
+	border: 2px solid color-mix(in srgb, var(--label-color) 40%, var(--pico-card-background-color));
+	color: var(--pico-color);
+}
diff --git a/pkg/web/templates/bug.html b/pkg/web/templates/bug.html
index f1d0f78d9c7447dc4f5d863efc8d6a550caa0cf7..8928821759c07ad70617db3dcb8d81c6cacfe0e1 100644
--- a/pkg/web/templates/bug.html
+++ b/pkg/web/templates/bug.html
@@ -23,7 +23,7 @@
   </h2>
   {{if .Labels}}
   <p>
-    {{range $i, $label := .Labels}}{{if $i}} {{end}}<code>{{$label.Name}}</code>{{end}}
+    {{range $i, $label := .Labels}}{{if $i}} {{end}}<span class="bug-label" style="--label-color: {{$label.Color}}">{{$label.Name}}</span>{{end}}
   </p>
   {{end}}
 </header>