feat: add trusted-only debug outlines toggle to badge print controls panel

This commit is contained in:
Scott Idem
2026-03-18 13:05:17 -04:00
parent ec5b09dfaa
commit 07d21c29c8

View File

@@ -283,6 +283,22 @@
?? ''
);
// --- Debug Outlines Toggle ---
let debug_outlines = $state(false);
$effect(() => {
if (browser) {
if (debug_outlines) {
document.documentElement.classList.add('debug_outlines');
} else {
document.documentElement.classList.remove('debug_outlines');
}
}
return () => {
if (browser) document.documentElement.classList.remove('debug_outlines');
};
});
// --- Focus management: focus the input when its accordion opens ---
// rAF gives the CSS accordion one repaint tick before focus() is called,
// avoiding jumping to an invisible (height: 0) element.
@@ -863,6 +879,18 @@
<span class="flex-1 border-t border-gray-200 dark:border-gray-700"></span>
</div>
<!-- Debug Outlines Toggle (for print testing) -->
<div class="flex items-center gap-2 px-2 py-1.5">
<label class="flex items-center gap-2 cursor-pointer select-none">
<input
type="checkbox"
class="checkbox"
bind:checked={debug_outlines}
/>
<span class="text-xs">Show debug outlines</span>
</label>
</div>
<!-- === BADGE TYPE === (only when template defines badge_type_list) -->
{#if badge_type_code_li.length > 0}
<div class="field-card rounded-lg overflow-hidden" class:field-card--active={active_field === 'badge_type'}>