From 26d737b3fc5f41973b13b086718a9d8b046c1d69 Mon Sep 17 00:00:00 2001
From: xRangerDE <xRangerDE@24-music.de>
Date: Mon, 11 May 2026 09:13:00 +0200
Subject: [PATCH] =?UTF-8?q?cleanup:=20.queue-output-row=20+=20.queue-outpu?=
 =?UTF-8?q?t-label=20CSS=20=E2=80=94=202=20inline=20styles=20gone?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The queue-item detail panel's output-files row (rendered after a job completes — Open file / Show in folder / View chat / View events buttons + a tiny file-label span) had two inline-styled elements:

- The container div with display:flex; gap:6px; margin-top:6px; flex-wrap:wrap; align-items:center
- The span with color:var(--text-secondary,#888); font-size:11px; word-break:break-all

The span's inline fallback color (#888 after the comma) was a leftover defensive value from before --text-secondary was guaranteed to be defined globally; it's never actually needed today.

Extracted to .queue-output-row + .queue-output-label classes. Class definitions live next to the .context-menu* family they belong to (other queue-detail-panel internals).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/renderer-queue.ts |  4 ++--
 src/styles.css        | 18 ++++++++++++++++++
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/src/renderer-queue.ts b/src/renderer-queue.ts
index c167763..e895179 100644
--- a/src/renderer-queue.ts
+++ b/src/renderer-queue.ts
@@ -45,9 +45,9 @@ function renderQueueItemFileActions(item: QueueItem): string {
         : `${escapeHtml(UI_TEXT.queue.outputFilesLabel.replace('{count}', String(item.outputFiles.length)))}`;
 
     return `
-        <div class="queue-output-row" style="display:flex; gap:6px; margin-top:6px; flex-wrap:wrap; align-items:center;">
+        <div class="queue-output-row">
             ${buttons.join('')}
-            <span style="color: var(--text-secondary,#888); font-size:11px; word-break:break-all;">${fileLabel}</span>
+            <span class="queue-output-label">${fileLabel}</span>
         </div>
     `;
 }
diff --git a/src/styles.css b/src/styles.css
index 4bd1299..782306f 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -4451,3 +4451,21 @@ input[type="number"]::-webkit-outer-spin-button {
     margin: 4px 6px;
     background: var(--border-soft);
 }
+
+/* Output-row appended to the queue-item detail panel when a job
+   completed. Lists the file actions (Open file / Show in folder /
+   View chat / View events) followed by a tiny secondary-colour file
+   label. */
+.queue-output-row {
+    display: flex;
+    gap: 6px;
+    margin-top: 6px;
+    flex-wrap: wrap;
+    align-items: center;
+}
+
+.queue-output-label {
+    color: var(--text-secondary);
+    font-size: 11px;
+    word-break: break-all;
+}