LotusGuild/tinker_tickets
4
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Sync TDS v1.2 additions: scanlines, cursor, radar, display-field, VT323

Browse Source 
- Sync base.css + base.js from web_template (adds lt-scanlines,
  lt-cursor, lt-radar, lt-display-field, --font-crt/VT323 token)
- Add VT323 to Google Fonts link in layout_header.php
- Add lt-scanlines to <body> — CRT scanline overlay, light-mode suppressed
- Replace custom .editable-metadata:disabled CSS override in ticket.css
  with the canonical .lt-display-field class from base.css
- Switch Priority/Category/Type/Visibility selects and visibility-group
  checkboxes in TicketView.php from disabled attribute to lt-display-field
- Update toggleEditMode() in ticket.js to add/remove lt-display-field
  instead of toggling the disabled attribute

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Jared Vititoe
2026-04-01 16:55:12 -04:00
parent 55c6fc81db
commit cfdc9e0f37
6 changed files with 118 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/base.css
+101 -130
View File
@@ -79,15 +79,6 @@
--accent-purple: #BF5FFF; --accent-purple: #BF5FFF;
--accent-purple-dim: rgba(191,95,255,0.10); --accent-purple-dim: rgba(191,95,255,0.10);
/* ── App semantic aliases (used in ticket.css, dashboard.css) ── */
--lt-danger: var(--accent-red);
--lt-amber: var(--accent-amber);
--lt-cyan: var(--accent-cyan);
--lt-success: var(--accent-green);
--lt-text-primary: var(--accent-green);
--lt-border: var(--border-color);
--lt-surface: var(--bg-card);
/* Legacy aliases — keeps all existing component HTML working */ /* Legacy aliases — keeps all existing component HTML working */
--terminal-green: var(--accent-green); --terminal-green: var(--accent-green);
--terminal-green-dim: var(--accent-green-dim); --terminal-green-dim: var(--accent-green-dim);
@@ -155,6 +146,7 @@
/* --- Typography --- */ /* --- Typography --- */
--font-mono: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', 'Courier New', monospace; --font-mono: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', 'Courier New', monospace;
--font-display: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace; --font-display: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
--font-crt: 'VT323', 'Courier New', monospace;
/* --- Spacing --- */ /* --- Spacing --- */
--space-xs: 0.25rem; --space-xs: 0.25rem;
@@ -225,8 +217,6 @@ body {
min-height: 100vh; min-height: 100vh;
overflow-x: hidden; overflow-x: hidden;
position: relative; position: relative;
display: flex;
flex-direction: column;
} }
a { a {
@@ -360,18 +350,6 @@ hr {
.lt-main { .lt-main {
padding-top: calc(var(--header-height) + var(--space-lg)); padding-top: calc(var(--header-height) + var(--space-lg));
flex: 1;
/* When body is a flex column, margin:0 auto from .lt-container would prevent
stretch. Force full width so max-width+auto-margin centering still works. */
width: 100%;
min-width: 0; /* prevent flex overflow on very small viewports */
}
/* When both lt-main and lt-container are on the same element, the lt-container
shorthand `padding` overrides the lt-main `padding-top` in responsive breakpoints
(same cascade specificity, later rule wins). The combined selector has higher
specificity (0,2,0 vs 0,1,0) and always wins regardless of source order. */
.lt-main.lt-container {
padding-top: calc(var(--header-height) + var(--space-lg));
} }
.lt-layout { .lt-layout {
@@ -392,17 +370,6 @@ hr {
.lt-flex-col { display: flex; flex-direction: column; } .lt-flex-col { display: flex; flex-direction: column; }
.lt-flex-wrap { flex-wrap: wrap; } .lt-flex-wrap { flex-wrap: wrap; }
/* Flex gap modifiers (used with lt-flex) */
.lt-flex-gap-xs { gap: var(--space-xs); }
.lt-flex-gap-sm { gap: var(--space-sm); }
.lt-flex-gap-md { gap: var(--space-md); }
.lt-flex-gap-lg { gap: var(--space-lg); }
/* Flex align modifiers */
.lt-flex-align-start { align-items: flex-start; }
.lt-flex-align-center { align-items: center; }
.lt-flex-align-end { align-items: flex-end; }
.lt-gap-sm { gap: var(--space-sm); } .lt-gap-sm { gap: var(--space-sm); }
.lt-gap-md { gap: var(--space-md); } .lt-gap-md { gap: var(--space-md); }
.lt-gap-lg { gap: var(--space-lg); } .lt-gap-lg { gap: var(--space-lg); }
@@ -941,6 +908,19 @@ hr {
border-color: var(--border-dim); border-color: var(--border-dim);
} }
/* Display-only fields — readable, non-editable, not "broken" */
.lt-display-field,
.lt-input.lt-display-field,
.lt-select.lt-display-field,
.lt-textarea.lt-display-field {
opacity: 1;
color: var(--text-secondary);
cursor: default;
pointer-events: none;
background: transparent;
border-color: var(--border-dim);
}
.lt-input::placeholder, .lt-input::placeholder,
.lt-textarea::placeholder { color: var(--text-dim); } .lt-textarea::placeholder { color: var(--text-dim); }
@@ -975,26 +955,11 @@ select option:checked {
clip-path: none; clip-path: none;
} }
/* Compact size variants for inline filter bars and tight layouts */
.lt-select-sm {
font-size: 0.7rem;
padding: 0.25rem 1.6rem 0.25rem 0.5rem;
width: auto;
}
.lt-input-sm {
font-size: 0.7rem;
padding: 0.25rem 0.5rem;
width: auto;
}
.lt-form-hint { .lt-form-hint {
font-size: 0.63rem; font-size: 0.63rem;
color: var(--text-muted); color: var(--text-muted);
letter-spacing: 0.04em; letter-spacing: 0.04em;
} }
.lt-form-hint--warn { color: var(--accent-amber); }
.lt-font-mono { font-family: var(--font-mono); }
/* Search */ /* Search */
.lt-search { position: relative; } .lt-search { position: relative; }
@@ -1239,7 +1204,6 @@ select option:checked {
.lt-badge-green { color: var(--accent-green); } .lt-badge-green { color: var(--accent-green); }
.lt-badge-amber { color: var(--accent-amber); } .lt-badge-amber { color: var(--accent-amber); }
.lt-badge-red { color: var(--accent-red); } .lt-badge-red { color: var(--accent-red); }
.lt-badge-sm { font-size: 0.52rem; padding: 0.05rem 0.3rem; letter-spacing: 0.08em; }
/* Status + priority badge variants (dark-mode base) */ /* Status + priority badge variants (dark-mode base) */
.lt-badge-open { color: var(--accent-green); background: rgba(0,255,136,0.08); border-color: rgba(0,255,136,0.35); text-shadow: var(--glow-green); } .lt-badge-open { color: var(--accent-green); background: rgba(0,255,136,0.08); border-color: rgba(0,255,136,0.35); text-shadow: var(--glow-green); }
@@ -1610,14 +1574,12 @@ select option:checked {
} }
.lt-msg::before { flex-shrink: 0; font-weight: 700; } .lt-msg::before { flex-shrink: 0; font-weight: 700; }
.lt-msg-error, .lt-msg-error { color: var(--accent-red); background: var(--accent-red-dim); border-left-color: var(--accent-red); }
.lt-msg-danger { color: var(--accent-red); background: var(--accent-red-dim); border-left-color: var(--accent-red); }
.lt-msg-success { color: var(--accent-green); background: var(--accent-green-dim); border-left-color: var(--accent-green); } .lt-msg-success { color: var(--accent-green); background: var(--accent-green-dim); border-left-color: var(--accent-green); }
.lt-msg-warning { color: var(--accent-amber); background: var(--accent-amber-dim); border-left-color: var(--accent-amber); } .lt-msg-warning { color: var(--accent-amber); background: var(--accent-amber-dim); border-left-color: var(--accent-amber); }
.lt-msg-info { color: var(--accent-cyan); background: var(--accent-cyan-dim); border-left-color: var(--accent-cyan); } .lt-msg-info { color: var(--accent-cyan); background: var(--accent-cyan-dim); border-left-color: var(--accent-cyan); }
.lt-msg-error::before, .lt-msg-error::before { content: '✗'; }
.lt-msg-danger::before { content: '✗'; }
.lt-msg-success::before { content: '✓'; } .lt-msg-success::before { content: '✓'; }
.lt-msg-warning::before { content: '!'; } .lt-msg-warning::before { content: '!'; }
.lt-msg-info::before { content: 'i'; } .lt-msg-info::before { content: 'i'; }
@@ -2083,7 +2045,6 @@ select option:checked {
.lt-main { padding-top: calc(50px + var(--space-md)); } .lt-main { padding-top: calc(50px + var(--space-md)); }
.lt-container { padding: var(--space-md); } .lt-container { padding: var(--space-md); }
.lt-main.lt-container { padding-top: calc(var(--header-height) + var(--space-md)); }
.lt-header { padding: 0 var(--space-md); } .lt-header { padding: 0 var(--space-md); }
.lt-brand-subtitle { display: none; } .lt-brand-subtitle { display: none; }
@@ -2184,7 +2145,6 @@ select option:checked {
.lt-main { padding-top: calc(46px + var(--space-sm)); } .lt-main { padding-top: calc(46px + var(--space-sm)); }
.lt-container { padding: var(--space-sm); } .lt-container { padding: var(--space-sm); }
.lt-main.lt-container { padding-top: calc(var(--header-height) + var(--space-sm)); }
.lt-stats-grid { grid-template-columns: 1fr 1fr; gap: var(--space-xs); } .lt-stats-grid { grid-template-columns: 1fr 1fr; gap: var(--space-xs); }
.lt-stat-card { padding: var(--space-xs) var(--space-sm); } .lt-stat-card { padding: var(--space-xs) var(--space-sm); }
.lt-stat-value { font-size: 1.4rem; } .lt-stat-value { font-size: 1.4rem; }
@@ -2281,7 +2241,6 @@ select option:checked {
.lt-stats-grid { grid-template-columns: repeat(6, 1fr); } .lt-stats-grid { grid-template-columns: repeat(6, 1fr); }
.lt-grid-4 { grid-template-columns: repeat(4, 1fr); } .lt-grid-4 { grid-template-columns: repeat(4, 1fr); }
.lt-container { padding: var(--space-xl) var(--space-2xl); } .lt-container { padding: var(--space-xl) var(--space-2xl); }
.lt-main.lt-container { padding-top: calc(var(--header-height) + var(--space-xl)); }
} }
@@ -2349,12 +2308,6 @@ select option:checked {
.lt-text-red { color: var(--accent-red); text-shadow: var(--glow-red); } .lt-text-red { color: var(--accent-red); text-shadow: var(--glow-red); }
.lt-text-muted { color: var(--text-muted); } .lt-text-muted { color: var(--text-muted); }
.lt-text-dim { color: var(--text-dim); } .lt-text-dim { color: var(--text-dim); }
/* Semantic aliases */
.lt-text-danger { color: var(--accent-red); text-shadow: var(--glow-red); }
.lt-text-warning { color: var(--accent-amber); text-shadow: var(--glow-amber); }
.lt-text-success { color: var(--accent-green); text-shadow: var(--glow-green); }
.lt-text-info { color: var(--accent-cyan); text-shadow: var(--glow-cyan); }
.lt-text-primary { color: var(--accent-green); text-shadow: var(--glow-green); }
.lt-text-xs { font-size: 0.63rem; } .lt-text-xs { font-size: 0.63rem; }
.lt-text-sm { font-size: 0.78rem; } .lt-text-sm { font-size: 0.78rem; }
@@ -2393,9 +2346,6 @@ select option:checked {
border: 0; border: 0;
} }
/* Global visibility utility — used by JS and all views */
.is-hidden { display: none !important; }
/* Cursor blink */ /* Cursor blink */
.lt-cursor::after { .lt-cursor::after {
content: '█'; content: '█';
@@ -3229,11 +3179,6 @@ input[type="range"].lt-range::-moz-range-thumb {
.lt-kv-val--green { color: var(--accent-green); } .lt-kv-val--green { color: var(--accent-green); }
.lt-kv-val--red { color: var(--accent-red); } .lt-kv-val--red { color: var(--accent-red); }
/* v1.2 aliases: lt-kv-row wraps label+value as a transparent grid wrapper */
.lt-kv-row { display: contents; }
.lt-kv-label { padding: var(--space-xs) var(--space-md) var(--space-xs) 0; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.05em; font-size: 0.7rem; white-space: nowrap; border-right: 1px solid var(--border-dim); }
.lt-kv-value { padding: var(--space-xs) 0 var(--space-xs) var(--space-md); color: var(--text-primary); }
/* ---------------------------------------------------------------- /* ----------------------------------------------------------------
43. HERO / BANNER SECTION 43. HERO / BANNER SECTION
@@ -4498,7 +4443,6 @@ body.lt-is-offline .lt-main { margin-top: 2rem; transition: margin-top 0.25s eas
flex-wrap: wrap; flex-wrap: wrap;
} }
.lt-timeline-actor { color: var(--accent-cyan); } .lt-timeline-actor { color: var(--accent-cyan); }
.lt-timeline-action { color: var(--text-secondary); font-style: italic; }
.lt-timeline-time { margin-left: auto; white-space: nowrap; } .lt-timeline-time { margin-left: auto; white-space: nowrap; }
.lt-timeline-body { font-size: 0.78rem; color: var(--text-secondary); line-height: 1.5; } .lt-timeline-body { font-size: 0.78rem; color: var(--text-secondary); line-height: 1.5; }
.lt-timeline-body code { font-size: 0.72rem; color: var(--accent-green); } .lt-timeline-body code { font-size: 0.72rem; color: var(--accent-green); }
@@ -4522,20 +4466,7 @@ body.lt-is-offline .lt-main { margin-top: 2rem; transition: margin-top 0.25s eas
flex-shrink: 0; flex-shrink: 0;
user-select: none; user-select: none;
} }
/* Photo overlay: img sits on top of initials text; hidden via onerror if no photo */ .lt-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lt-avatar { position: relative; }
.lt-avatar-initials { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.lt-avatar-img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: inherit;
z-index: 1;
}
/* Legacy: bare img inside lt-avatar (no .lt-avatar-img class) */
.lt-avatar > img:not(.lt-avatar-img) { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Sizes */ /* Sizes */
.lt-avatar--xs { width: 1.5rem; height: 1.5rem; font-size: 0.55rem; } .lt-avatar--xs { width: 1.5rem; height: 1.5rem; font-size: 0.55rem; }
.lt-avatar--sm { width: 2rem; height: 2rem; font-size: 0.65rem; } .lt-avatar--sm { width: 2rem; height: 2rem; font-size: 0.65rem; }
@@ -5560,7 +5491,7 @@ body.lt-is-offline .lt-main { margin-top: 2rem; transition: margin-top 0.25s eas
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
gap: var(--space-sm); gap: var(--space-sm);
padding: var(--space-sm) var(--space-lg); padding: var(--space-md) var(--space-lg);
border-top: 1px solid var(--border-dim); border-top: 1px solid var(--border-dim);
margin-top: auto; margin-top: auto;
background: var(--bg-secondary); background: var(--bg-secondary);
@@ -5568,49 +5499,89 @@ body.lt-is-offline .lt-main { margin-top: 2rem; transition: margin-top 0.25s eas
font-size: 0.7rem; font-size: 0.7rem;
font-family: var(--font-mono); font-family: var(--font-mono);
} }
/* Keyboard hint bar */
.lt-footer-hints {
display: flex;
gap: 0.75rem;
align-items: center;
flex-wrap: wrap;
}
.lt-footer-hint {
display: inline-flex;
align-items: center;
gap: 0.25rem;
color: var(--text-muted);
font-size: 0.68rem;
letter-spacing: 0.03em;
text-decoration: none;
background: none;
border: none;
padding: 0;
font-family: inherit;
cursor: default;
transition: color 0.12s;
}
a.lt-footer-hint,
button.lt-footer-hint {
cursor: pointer;
}
a.lt-footer-hint:hover,
button.lt-footer-hint:hover {
color: var(--accent-green);
text-shadow: var(--glow-green);
}
.lt-footer-key {
color: var(--accent-green);
opacity: 0.75;
font-weight: 700;
}
.lt-footer-sep {
opacity: 0.25;
user-select: none;
}
@media (max-width: 479px) { @media (max-width: 479px) {
.lt-footer { flex-direction: column; align-items: flex-start; gap: 0.25rem; } .lt-footer { flex-direction: column; align-items: flex-start; gap: 0.25rem; }
.lt-footer-hints { gap: 0.5rem; }
} }
/* ================================================================
BLINKING CURSOR
<h1 class="lt-cursor">SYSTEM STATUS</h1>
<span class="lt-cursor lt-cursor--cyan">SCANNING</span>
================================================================ */
.lt-cursor::after {
content: '▊';
animation: lt-blink 1s step-end infinite;
color: var(--accent-green);
margin-left: 2px;
}
.lt-cursor--cyan::after { color: var(--accent-cyan); }
.lt-cursor--orange::after { color: var(--accent-orange); }
.lt-cursor--red::after { color: var(--accent-red); }
@keyframes lt-blink {
0%, 100% { opacity: 1; }
50% { opacity: 0; }
}
/* ================================================================
CRT SCANLINE OVERLAY
Add lt-scanlines to <body> or any container to enable.
Automatically suppressed in light theme.
================================================================ */
.lt-scanlines::after {
content: '';
position: fixed;
inset: 0;
background: repeating-linear-gradient(
0deg,
transparent,
transparent 2px,
rgba(0, 0, 0, 0.04) 2px,
rgba(0, 0, 0, 0.04) 4px
);
pointer-events: none;
z-index: 9998;
}
html[data-theme="light"] .lt-scanlines::after { display: none; }
/* ================================================================
RADAR SWEEP LOADING INDICATOR
<div class="lt-radar"></div>
Drop-in replacement for lt-spinner where a radar aesthetic fits.
================================================================ */
.lt-radar {
display: inline-block;
width: 48px; height: 48px;
border-radius: 50%;
border: 1px solid var(--accent-cyan);
position: relative;
overflow: hidden;
flex-shrink: 0;
}
.lt-radar::before {
content: '';
position: absolute;
inset: 0;
background: conic-gradient(
from 0deg,
transparent 70%,
rgba(0, 212, 255, 0.35) 100%
);
animation: lt-radar-sweep 2s linear infinite;
transform-origin: center;
}
.lt-radar::after {
content: '';
position: absolute;
inset: 50% 0 0 50%;
width: 1px; height: 50%;
background: var(--accent-cyan);
transform-origin: top left;
animation: lt-radar-sweep 2s linear infinite;
opacity: 0.6;
}
.lt-radar--sm { width: 28px; height: 28px; }
.lt-radar--lg { width: 72px; height: 72px; }
.lt-radar--green { border-color: var(--accent-green); }
.lt-radar--green::before { background: conic-gradient(from 0deg, transparent 70%, rgba(0,255,136,0.35) 100%); }
.lt-radar--green::after { background: var(--accent-green); }
@keyframes lt-radar-sweep { to { transform: rotate(360deg); } }
assets/css/ticket.css
+2 -10
View File
@@ -289,13 +289,5 @@ kbd {
} }
.ticket-description-view p:last-child { margin-bottom: 0; } .ticket-description-view p:last-child { margin-bottom: 0; }
/* ── Disabled metadata selects (read mode) ───────────────────── */ /* Metadata selects use .lt-display-field (base.css) in read mode
/* base.css sets opacity:0.45 on :disabled — override for read- */ instead of disabled — full opacity, non-interactive, no fading. */
/* only display fields so they remain legible on dark/OLED screens */
.editable-metadata:disabled,
.editable-metadata[disabled] {
opacity: 1;
color: var(--text-secondary, #7fa3bf);
cursor: default;
pointer-events: none;
}
assets/js/base.js
-2
View File
@@ -466,7 +466,6 @@
let data; let data;
try { data = await resp.json(); } catch (_) { data = { success: resp.ok }; } try { data = await resp.json(); } catch (_) { data = { success: resp.ok }; }
if (!resp.ok) throw new Error(data.error || data.message || 'HTTP ' + resp.status); if (!resp.ok) throw new Error(data.error || data.message || 'HTTP ' + resp.status);
if (data && data.csrf_token) global.CSRF_TOKEN = data.csrf_token;
return data; return data;
} }
@@ -2703,7 +2702,6 @@
let data; let data;
try { data = await resp.json(); } catch (_) { data = { success: resp.ok }; } try { data = await resp.json(); } catch (_) { data = { success: resp.ok }; }
if (!resp.ok) throw new Error(data.error || data.message || 'HTTP ' + resp.status); if (!resp.ok) throw new Error(data.error || data.message || 'HTTP ' + resp.status);
if (data && data.csrf_token) global.CSRF_TOKEN = data.csrf_token;
return data; return data;
} }
api.get = url => _apiFetchAuth('GET', url); api.get = url => _apiFetchAuth('GET', url);
assets/js/ticket.js
+5 -5
View File
@@ -134,9 +134,9 @@ function toggleEditMode() {
descriptionField.style.height = descriptionField.scrollHeight + 'px'; descriptionField.style.height = descriptionField.scrollHeight + 'px';
} }
// Enable metadata fields (priority, category, type) // Enable metadata fields (priority, category, type) — remove display-only class
metadataFields.forEach(field => { metadataFields.forEach(field => {
field.disabled = false; field.classList.remove('lt-display-field');
}); });
} else { } else {
saveTicket(); saveTicket();
@@ -148,16 +148,16 @@ function toggleEditMode() {
titleField.setAttribute('contenteditable', 'false'); titleField.setAttribute('contenteditable', 'false');
} }
// Disable description — re-render view div with latest content // Re-render description view div with latest content
if (descriptionField) { if (descriptionField) {
descriptionField.disabled = true; descriptionField.disabled = true;
renderDescriptionView(); renderDescriptionView();
showDescriptionView(); showDescriptionView();
} }
// Disable metadata fields // Return metadata fields to display-only using .lt-display-field (not disabled)
metadataFields.forEach(field => { metadataFields.forEach(field => {
field.disabled = true; field.classList.add('lt-display-field');
}); });
} }
} }
views/TicketView.php
+5 -5
View File
@@ -167,7 +167,7 @@ include __DIR__ . '/layout_header.php';
<div class="lt-kv-row"> <div class="lt-kv-row">
<span class="lt-kv-label">Priority</span> <span class="lt-kv-label">Priority</span>
<span class="lt-kv-value"> <span class="lt-kv-value">
<select id="prioritySelect" class="lt-select lt-select-sm editable-metadata" disabled aria-label="Priority"> <select id="prioritySelect" class="lt-select lt-select-sm editable-metadata lt-display-field" aria-label="Priority">
<?php foreach ([1=>'P1 - Critical',2=>'P2 - High',3=>'P3 - Medium',4=>'P4 - Low',5=>'P5 - Minimal'] as $v=>$l): ?> <?php foreach ([1=>'P1 - Critical',2=>'P2 - High',3=>'P3 - Medium',4=>'P4 - Low',5=>'P5 - Minimal'] as $v=>$l): ?>
<option value="<?= $v ?>" <?= (int)$ticket['priority'] === $v ? 'selected' : '' ?>><?= $l ?></option> <option value="<?= $v ?>" <?= (int)$ticket['priority'] === $v ? 'selected' : '' ?>><?= $l ?></option>
<?php endforeach ?> <?php endforeach ?>
@@ -177,7 +177,7 @@ include __DIR__ . '/layout_header.php';
<div class="lt-kv-row"> <div class="lt-kv-row">
<span class="lt-kv-label">Category</span> <span class="lt-kv-label">Category</span>
<span class="lt-kv-value"> <span class="lt-kv-value">
<select id="categorySelect" class="lt-select lt-select-sm editable-metadata" disabled aria-label="Category"> <select id="categorySelect" class="lt-select lt-select-sm editable-metadata lt-display-field" aria-label="Category">
<?php foreach (['Hardware','Software','Network','Security','General'] as $c): ?> <?php foreach (['Hardware','Software','Network','Security','General'] as $c): ?>
<option value="<?= $c ?>" <?= $ticket['category'] === $c ? 'selected' : '' ?>><?= $c ?></option> <option value="<?= $c ?>" <?= $ticket['category'] === $c ? 'selected' : '' ?>><?= $c ?></option>
<?php endforeach ?> <?php endforeach ?>
@@ -187,7 +187,7 @@ include __DIR__ . '/layout_header.php';
<div class="lt-kv-row"> <div class="lt-kv-row">
<span class="lt-kv-label">Type</span> <span class="lt-kv-label">Type</span>
<span class="lt-kv-value"> <span class="lt-kv-value">
<select id="typeSelect" class="lt-select lt-select-sm editable-metadata" disabled aria-label="Type"> <select id="typeSelect" class="lt-select lt-select-sm editable-metadata lt-display-field" aria-label="Type">
<?php foreach (['Maintenance','Install','Task','Upgrade','Issue','Problem'] as $t): ?> <?php foreach (['Maintenance','Install','Task','Upgrade','Issue','Problem'] as $t): ?>
<option value="<?= $t ?>" <?= $ticket['type'] === $t ? 'selected' : '' ?>><?= $t ?></option> <option value="<?= $t ?>" <?= $ticket['type'] === $t ? 'selected' : '' ?>><?= $t ?></option>
<?php endforeach ?> <?php endforeach ?>
@@ -211,7 +211,7 @@ include __DIR__ . '/layout_header.php';
<div class="lt-kv-row"> <div class="lt-kv-row">
<span class="lt-kv-label">Visibility</span> <span class="lt-kv-label">Visibility</span>
<span class="lt-kv-value"> <span class="lt-kv-value">
<select id="visibilitySelect" class="lt-select lt-select-sm editable-metadata" disabled <select id="visibilitySelect" class="lt-select lt-select-sm editable-metadata lt-display-field"
data-action="toggle-visibility-groups" aria-label="Visibility"> data-action="toggle-visibility-groups" aria-label="Visibility">
<option value="public" <?= $currentVisibility === 'public' ? 'selected' : '' ?>>Public</option> <option value="public" <?= $currentVisibility === 'public' ? 'selected' : '' ?>>Public</option>
<option value="internal" <?= $currentVisibility === 'internal' ? 'selected' : '' ?>>Internal</option> <option value="internal" <?= $currentVisibility === 'internal' ? 'selected' : '' ?>>Internal</option>
@@ -265,7 +265,7 @@ include __DIR__ . '/layout_header.php';
<?php foreach ($allAvailableGroups as $group): <?php foreach ($allAvailableGroups as $group):
$isChecked = in_array($group, $currentVisibilityGroups, true); ?> $isChecked = in_array($group, $currentVisibilityGroups, true); ?>
<label class="lt-filter-option"> <label class="lt-filter-option">
<input type="checkbox" class="lt-checkbox visibility-group-checkbox editable-metadata" disabled <input type="checkbox" class="lt-checkbox visibility-group-checkbox editable-metadata lt-display-field"
value="<?= htmlspecialchars($group, ENT_QUOTES, 'UTF-8') ?>" value="<?= htmlspecialchars($group, ENT_QUOTES, 'UTF-8') ?>"
<?= $isChecked ? 'checked' : '' ?>> <?= $isChecked ? 'checked' : '' ?>>
<span class="lt-badge"><?= htmlspecialchars($group) ?></span> <span class="lt-badge"><?= htmlspecialchars($group) ?></span>
views/layout_header.php
+2 -2
View File
@@ -31,7 +31,7 @@ $_lt_assetVer = $GLOBALS['config']['ASSET_VERSION'] ?? '20260329';
<meta name="robots" content="noindex, nofollow"> <meta name="robots" content="noindex, nofollow">
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,400;0,600;0,700;1,400&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,400;0,600;0,700;1,400&family=VT323&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/assets/css/base.css?v=<?= $_lt_assetVer ?>"> <link rel="stylesheet" href="/assets/css/base.css?v=<?= $_lt_assetVer ?>">
<?php if (!empty($pageStyles)): ?> <?php if (!empty($pageStyles)): ?>
<?php foreach ($pageStyles as $_lt_css): ?> <?php foreach ($pageStyles as $_lt_css): ?>
@@ -55,7 +55,7 @@ $_lt_assetVer = $GLOBALS['config']['ASSET_VERSION'] ?? '20260329';
], JSON_UNESCAPED_UNICODE | JSON_HEX_TAG) ?>; ], JSON_UNESCAPED_UNICODE | JSON_HEX_TAG) ?>;
</script> </script>
</head> </head>
<body> <body class="lt-scanlines">
<!-- SKIP LINK --> <!-- SKIP LINK -->
<a class="lt-skip-link" href="#main-content">Skip to main content</a> <a class="lt-skip-link" href="#main-content">Skip to main content</a>