From 35a9c79833c56e8be6f39c4b7955763e80b8e236 Mon Sep 17 00:00:00 2001
From: mscherer <dereuromark@web.de>
Date: Sun, 26 Apr 2026 03:08:50 +0200
Subject: [PATCH 1/2] Move mobile-nav background to CSS class (strict-CSP)

Drops the inline `style="background: linear-gradient(...)"` attribute on the
mobile offcanvas in favour of a `.queue-mobile-nav-bg` class that reuses the
existing `--queue-sidebar-bg` custom property. Removes the
`style-src 'unsafe-inline'` requirement for this element.
---
 templates/layout/queue.php | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/templates/layout/queue.php b/templates/layout/queue.php
index 053835e7..4ef4da13 100644
--- a/templates/layout/queue.php
+++ b/templates/layout/queue.php
@@ -82,6 +82,11 @@
 			overflow-y: auto;
 		}
 
+		/* Mobile nav offcanvas — same background as sidebar */
+		.queue-mobile-nav-bg {
+			background: var(--queue-sidebar-bg);
+		}
+
 		.queue-sidebar .nav-section {
 			padding: 0 1rem;
 			margin-bottom: 1.5rem;
@@ -382,7 +387,7 @@
 	</nav>
 
 	<!-- Mobile Offcanvas Navigation -->
-	<div class="offcanvas offcanvas-start" tabindex="-1" id="mobileNav" aria-labelledby="mobileNavLabel" style="background: linear-gradient(135deg, #2c3e50 0%, #1a252f 100%);">
+	<div class="offcanvas offcanvas-start queue-mobile-nav-bg" tabindex="-1" id="mobileNav" aria-labelledby="mobileNavLabel">
 		<div class="offcanvas-header border-bottom border-secondary">
 			<h5 class="offcanvas-title text-white" id="mobileNavLabel">
 				<i class="fas fa-layer-group me-2"></i>Queue Admin

From e0ee6ab87babba6e6d48537daa29c1a0af295fa0 Mon Sep 17 00:00:00 2001
From: mscherer <dereuromark@web.de>
Date: Sun, 26 Apr 2026 13:01:13 +0200
Subject: [PATCH 2/2] Drop leftover inline styles (widths, chart wrapper,
 heatmap colors)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Continues the strict-CSP cleanup on top of #479's gradient fix.

- Static `<th style="width:Npx">` widths in QueuedJobs/{view,migrate}.php
  and QueueProcesses/view.php → `.queue-col-w-50` / `.queue-col-w-200`
  classes in the layout.
- `<div style="position:relative;height:400px">` chart wrapper in
  QueuedJobs/stats.php → `.queue-chart-wrapper` class.
- Dynamic heatmap cell + legend colors in QueuedJobs/heatmap.php
  (`style="background-color:...;color:...;"`) → `data-bg-color` /
  `data-text-color` attributes; the layout's existing nonced `<script>`
  reads them and assigns to `el.style` (JS-driven style mutation is not
  subject to `style-src 'unsafe-inline'`).

Templates now contain zero inline `style=` attributes.
---
 templates/Admin/QueueProcesses/view.php |  2 +-
 templates/Admin/QueuedJobs/heatmap.php  |  5 +++--
 templates/Admin/QueuedJobs/migrate.php  |  2 +-
 templates/Admin/QueuedJobs/stats.php    |  2 +-
 templates/Admin/QueuedJobs/view.php     |  4 ++--
 templates/layout/queue.php              | 18 ++++++++++++++++++
 6 files changed, 26 insertions(+), 7 deletions(-)

diff --git a/templates/Admin/QueueProcesses/view.php b/templates/Admin/QueueProcesses/view.php
index 664126fd..75770024 100644
--- a/templates/Admin/QueueProcesses/view.php
+++ b/templates/Admin/QueueProcesses/view.php
@@ -15,7 +15,7 @@
 			<div class="card-body p-0">
 				<table class="table table-striped mb-0">
 					<tr>
-						<th style="width: 200px;"><?= __d('queue', 'Created') ?></th>
+						<th class="queue-col-w-200"><?= __d('queue', 'Created') ?></th>
 						<td>
 							<?= $this->Time->nice($queueProcess->created) ?>
 							<?php if (!$queueProcess->created->addSeconds(Config::defaultworkertimeout())->isFuture()): ?>
diff --git a/templates/Admin/QueuedJobs/heatmap.php b/templates/Admin/QueuedJobs/heatmap.php
index c96a89f9..f0983a91 100644
--- a/templates/Admin/QueuedJobs/heatmap.php
+++ b/templates/Admin/QueuedJobs/heatmap.php
@@ -102,7 +102,8 @@
 								);
 								?>
 								<div class="heatmap-cell"
-									 style="background-color: <?= $bgColor ?>; color: <?= $textColor ?>;"
+									 data-bg-color="<?= h($bgColor) ?>"
+									 data-text-color="<?= h($textColor) ?>"
 									 data-day="<?= h($dayNamesFull[$day]) ?>"
 									 data-hour="<?= sprintf('%02d:00-%02d:59', $hour, $hour) ?>"
 									 data-count="<?= $count ?>"
@@ -123,7 +124,7 @@
 				<div class="heatmap-legend mt-3">
 					<small class="text-muted me-2"><?= __d('queue', 'Less') ?></small>
 					<?php for ($i = 0; $i <= 4; $i++) { ?>
-						<div class="heatmap-legend-cell" style="background-color: <?= $this->Queue->heatmapColor($i / 4) ?>;"></div>
+						<div class="heatmap-legend-cell" data-bg-color="<?= h($this->Queue->heatmapColor($i / 4)) ?>"></div>
 					<?php } ?>
 					<small class="text-muted ms-2"><?= __d('queue', 'More') ?></small>
 				</div>
diff --git a/templates/Admin/QueuedJobs/migrate.php b/templates/Admin/QueuedJobs/migrate.php
index bca269be..b3431502 100644
--- a/templates/Admin/QueuedJobs/migrate.php
+++ b/templates/Admin/QueuedJobs/migrate.php
@@ -21,7 +21,7 @@
 					<table class="table table-hover">
 						<thead>
 							<tr>
-								<th style="width: 50px;"><?= __d('queue', 'Migrate') ?></th>
+								<th class="queue-col-w-50"><?= __d('queue', 'Migrate') ?></th>
 								<th><?= __d('queue', 'Old Name') ?></th>
 								<th><?= __d('queue', 'New Name') ?></th>
 							</tr>
diff --git a/templates/Admin/QueuedJobs/stats.php b/templates/Admin/QueuedJobs/stats.php
index f14e2e77..0466d284 100644
--- a/templates/Admin/QueuedJobs/stats.php
+++ b/templates/Admin/QueuedJobs/stats.php
@@ -30,7 +30,7 @@
 			<div class="card-body">
 				<p class="text-muted"><?= __d('queue', 'For already processed jobs - in average seconds per timeframe.') ?></p>
 
-				<div style="position: relative; height: 400px;">
+				<div class="queue-chart-wrapper">
 					<canvas id="job-chart"></canvas>
 				</div>
 			</div>
diff --git a/templates/Admin/QueuedJobs/view.php b/templates/Admin/QueuedJobs/view.php
index d13bca0a..63fee1d7 100644
--- a/templates/Admin/QueuedJobs/view.php
+++ b/templates/Admin/QueuedJobs/view.php
@@ -64,7 +64,7 @@
 			<div class="card-body p-0">
 				<table class="table table-striped mb-0">
 					<tr>
-						<th style="width: 200px;"><?= __d('queue', 'Job Type') ?></th>
+						<th class="queue-col-w-200"><?= __d('queue', 'Job Type') ?></th>
 						<td><span class="fw-medium"><?= h($queuedJob->job_task) ?></span></td>
 					</tr>
 					<tr>
@@ -120,7 +120,7 @@
 			<div class="card-body p-0">
 				<table class="table table-striped mb-0">
 					<tr>
-						<th style="width: 200px;"><?= __d('queue', 'Created') ?></th>
+						<th class="queue-col-w-200"><?= __d('queue', 'Created') ?></th>
 						<td><?= $this->Time->nice($queuedJob->created) ?></td>
 					</tr>
 					<tr>
diff --git a/templates/layout/queue.php b/templates/layout/queue.php
index 4ef4da13..7ff036c7 100644
--- a/templates/layout/queue.php
+++ b/templates/layout/queue.php
@@ -87,6 +87,16 @@
 			background: var(--queue-sidebar-bg);
 		}
 
+		/* Column-width utilities (replaces inline `<th style="width:Npx">`). */
+		.queue-col-w-50 { width: 50px; }
+		.queue-col-w-200 { width: 200px; }
+
+		/* Stats chart wrapper (replaces inline `style="position:relative;height:400px"`). */
+		.queue-chart-wrapper {
+			position: relative;
+			height: 400px;
+		}
+
 		.queue-sidebar .nav-section {
 			padding: 0 1rem;
 			margin-bottom: 1.5rem;
@@ -460,6 +470,14 @@
 				});
 			});
 
+			// Heatmap cell colors (CSP-safe replacement for inline style="background-color:…; color:…;")
+			document.querySelectorAll('[data-bg-color]').forEach(function(el) {
+				el.style.backgroundColor = el.dataset.bgColor;
+			});
+			document.querySelectorAll('[data-text-color]').forEach(function(el) {
+				el.style.color = el.dataset.textColor;
+			});
+
 			<?php if ($autoRefresh > 0): ?>
 			// Auto-refresh
 			setTimeout(function() {