Fix bracket buttons rendering below text + UI/security improvements

CSS fixes:
- Fix [ ] brackets appearing below button text by replacing display:inline-flex
  with display:inline-block + white-space:nowrap on .btn — removes cross-browser
  flex pseudo-element inconsistency as root cause
- Remove conflicting .btn::before ripple block (position:absolute was overriding
  bracket content positioning)
- Remove overflow:hidden from .btn which was clipping bracket content
- Fix body::after duplicate rule causing GPU layer blink (second position:fixed
  rule re-created compositor layer, overriding display:none suppression)
- Replace all transition:all with scoped property transitions in dashboard.css,
  ticket.css, base.css (prevents full CSS property evaluation on every hover)
- Convert pulse-warning/pulse-critical keyframes from box-shadow to opacity
  animation (GPU-composited, eliminates CPU repaints at 60fps)
- Fix mobile *::before/*::after blanket content:none rule — now targets only
  decorative frame glyphs, preserving button brackets and status indicators
- Remove --terminal-green-dim override that broke .lt-btn hover backgrounds

JS fixes:
- Fix all lt.lt.toast.* double-prefix instances in dashboard.js
- Add null guard before .appendChild() on bulkAssignUser select
- Replace all remaining emoji with terminal bracket notation (dashboard.js,
  ticket.js, markdown.js)
- Migrate all toast.*() shim calls to lt.toast.* across all JS files

View fixes:
- Remove hardcoded [ ] brackets from .btn buttons (CSS now adds them)
- Replace all emoji with terminal bracket notation in all views and admin views
- Add missing CSP nonces to AuditLogView.php and UserActivityView.php script tags
- Bump CSS version strings to ?v=20260319b for cache busting

Security fixes:
- update_ticket.php: add authorization check (non-admins can only edit their own
  or assigned tickets)
- add_comment.php: validate and cast ticket_id to integer with 400 response
- clone_ticket.php: fix unconditional session_start(), add ticket ID validation,
  add internal ticket access check
- bulk_operation.php: add HTTP 401/403 status codes on auth failures
- upload_attachment.php: fix missing $conn arg in AttachmentModel constructor
- assign_ticket.php: add ticket existence check and permission verification

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-19 22:20:43 -04:00
parent dd8833ee2f
commit 27075a62ee
23 changed files with 376 additions and 328 deletions

View File

@@ -345,6 +345,7 @@ textarea[data-field="description"]:not(:disabled)::after {
color: var(--terminal-amber);
border-color: var(--terminal-amber);
background: rgba(255, 176, 0, 0.1);
box-shadow: 0 0 6px rgba(255, 176, 0, 0.4);
animation: pulse-warning 2s ease-in-out infinite;
}
@@ -352,17 +353,18 @@ textarea[data-field="description"]:not(:disabled)::after {
color: var(--priority-1);
border-color: var(--priority-1);
background: rgba(255, 77, 77, 0.15);
box-shadow: 0 0 8px rgba(255, 77, 77, 0.5);
animation: pulse-critical 1s ease-in-out infinite;
}
@keyframes pulse-warning {
0%, 100% { box-shadow: 0 0 5px rgba(255, 176, 0, 0.3); }
50% { box-shadow: 0 0 15px rgba(255, 176, 0, 0.6); }
0%, 100% { opacity: 0.75; }
50% { opacity: 1; }
}
@keyframes pulse-critical {
0%, 100% { box-shadow: 0 0 5px rgba(255, 77, 77, 0.3); }
50% { box-shadow: 0 0 20px rgba(255, 77, 77, 0.8); }
0%, 100% { opacity: 0.7; }
50% { opacity: 1; }
}
/* Tab transition animations */
@@ -507,7 +509,7 @@ textarea[data-field="description"]:not(:disabled)::after {
border-radius: 0;
background: var(--bg-primary);
color: var(--text-primary);
transition: all 0.3s ease;
transition: border-color 0.2s ease;
}
input.editable {
@@ -547,7 +549,7 @@ textarea.editable {
font-weight: 500;
background: var(--bg-primary);
color: var(--text-primary);
transition: all 0.3s ease;
transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.btn.primary {
@@ -626,7 +628,7 @@ textarea.editable {
margin-bottom: 1rem;
position: relative;
box-shadow: none;
transition: all 0.3s ease;
transition: border-color 0.2s ease;
animation: comment-appear 0.4s ease-out;
}
@@ -643,7 +645,6 @@ textarea.editable {
.comment:hover {
border-color: var(--terminal-amber);
background: linear-gradient(135deg, var(--bg-primary) 0%, rgba(255, 176, 0, 0.03) 100%);
}
.comment:hover::before,
@@ -760,13 +761,16 @@ textarea.editable {
padding: 0.25rem 0.5rem;
font-size: 0.85rem;
cursor: pointer;
transition: all 0.2s ease;
transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
font-family: var(--font-mono);
line-height: 1;
}
.comment-action-btn:hover {
.comment-action-btn:hover,
.comment-action-btn:focus-visible {
background: rgba(0, 255, 65, 0.1);
outline: 2px solid var(--terminal-amber);
outline-offset: 2px;
}
.comment-action-btn.edit-btn:hover {
@@ -1055,7 +1059,7 @@ textarea.editable {
font-size: 1em;
font-family: var(--font-mono);
color: var(--terminal-green);
transition: all 0.3s ease;
transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
position: relative;
margin-right: -2px;
}
@@ -1070,9 +1074,12 @@ textarea.editable {
color: var(--terminal-green);
}
.tab-btn:hover {
.tab-btn:hover,
.tab-btn:focus-visible {
background: rgba(0, 255, 65, 0.05);
color: var(--terminal-amber);
outline: 2px solid var(--terminal-amber);
outline-offset: -2px;
}
.tab-btn.active {
@@ -1155,7 +1162,7 @@ textarea.editable {
right: 0;
bottom: 0;
background-color: var(--bg-secondary);
transition: .4s;
transition: background-color 0.4s ease;
}
.slider:before {
@@ -1166,7 +1173,7 @@ textarea.editable {
left: 4px;
bottom: 4px;
background-color: white;
transition: .4s;
transition: transform 0.4s ease;
}
.slider.round {
@@ -1353,7 +1360,7 @@ body.dark-mode .timeline-date {
letter-spacing: 0.5px;
border: 2px solid transparent;
cursor: pointer;
transition: all 0.2s ease;
transition: opacity 0.15s ease, border-color 0.15s ease;
}
.status-select:hover {
@@ -1604,7 +1611,7 @@ body.dark-mode .editable {
padding: 2rem;
text-align: center;
cursor: pointer;
transition: all 0.3s ease;
transition: border-color 0.2s ease, background-color 0.2s ease;
background: var(--bg-primary);
}
@@ -1691,7 +1698,7 @@ body.dark-mode .editable {
padding: 0.75rem 1rem;
border: 1px solid var(--terminal-green);
background: var(--bg-primary);
transition: all 0.2s ease;
transition: border-color 0.15s ease, background-color 0.15s ease;
}
.attachment-item:hover {
@@ -1782,7 +1789,7 @@ body.dark-mode .editable {
border-radius: 0;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
transition: background-color 0.15s ease;
}
.mention:hover {
@@ -1816,7 +1823,7 @@ body.dark-mode .editable {
cursor: pointer;
font-family: var(--font-mono);
color: var(--terminal-green);
transition: all 0.2s ease;
transition: background-color 0.15s ease, color 0.15s ease;
display: flex;
align-items: center;
gap: 0.5rem;
@@ -1857,7 +1864,7 @@ body.dark-mode .editable {
font-family: var(--font-mono);
font-size: 0.85rem;
cursor: pointer;
transition: all 0.2s ease;
transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
min-width: 32px;
}
@@ -1910,7 +1917,7 @@ body.dark-mode .editable {
color: var(--terminal-green);
text-decoration: none;
font-family: var(--font-mono);
transition: all 0.2s ease;
transition: background-color 0.15s ease, color 0.15s ease;
}
.export-dropdown-content a:hover {