Remove custom CSS from queue template

Remove <style> tags with status and priority badge classes.
Move badge styles to input.css as component utilities for
TailwindCSS compliance.
This commit is contained in:
2026-02-02 10:28:01 -05:00
parent 656261af4f
commit fa8b0fb43b
+9 -37
View File
@@ -13,34 +13,6 @@ templ Queue(user User, queueItems []handlers.QueueItemResponse, stats handlers.Q
<script src="/static/toast.js"></script>
<link href="/static/style.css" rel="stylesheet"/>
<script src="/static/theme.js"></script>
<style>
.status-badge {
display: inline-block;
padding: 2px 8px;
border-radius: 4px;
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
}
.status-pending { background-color: #f59e0b; color: white; }
.status-processing { background-color: #3b82f6; color: white; }
.status-completed { background-color: #10b981; color: white; }
.status-failed { background-color: #ef4444; color: white; }
.priority-badge {
display: inline-block;
padding: 2px 8px;
border-radius: 4px;
font-size: 10px;
font-weight: 600;
}
.priority-1 { background-color: #ef4444; color: white; }
.priority-2 { background-color: #f97316; color: white; }
.priority-3 { background-color: #f59e0b; color: white; }
.priority-5 { background-color: #10b981; color: white; }
.priority-7 { background-color: #6b7280; color: white; }
.priority-10 { background-color: #9ca3af; color: white; }
</style>
</head>
<body class="theme-{ user.Theme }">
@Header(user, "/queue")
@@ -148,15 +120,15 @@ templ Queue(user User, queueItems []handlers.QueueItemResponse, stats handlers.Q
<p>No items in the sync queue</p>
</div>
}
for _, item := range queueItems {
<div class="card p-4 rounded-lg border" style="background-color: var(--bg-secondary); border-color: var(--border);">
<div class="flex justify-between items-start mb-2">
<div class="flex items-center space-x-3">
<span class="status-badge status-{ item.Status }">{ item.Status }</span>
<span class="text-sm" style="color: var(--text-secondary)">{ item.SyncType }</span>
</div>
<span class="priority-badge priority-{ item.Priority }">P{ item.Priority }</span>
</div>
for _, item := range queueItems {
<div class="card p-4 rounded-lg border" style="background-color: var(--bg-secondary); border-color: var(--border);">
<div class="flex justify-between items-start mb-2">
<div class="flex items-center space-x-3">
<span class="inline-block px-2 py-0.5 rounded text-[11px] font-semibold uppercase status-{ item.Status }">{ item.Status }</span>
<span class="text-sm" style="color: var(--text-secondary)">{ item.SyncType }</span>
</div>
<span class="inline-block px-2 py-0.5 rounded text-[10px] font-semibold priority-{ item.Priority }">P{ item.Priority }</span>
</div>
<div class="text-sm mb-2" style="color: var(--text-secondary)">
Device ID: { item.DeviceID }
if item.MediaTitle != nil {