From fdc6d3d46374e736f9ca39c9de57ad8daa099f79 Mon Sep 17 00:00:00 2001
From: Jared Vititoe <jjvititoe1@gmail.com>
Date: Tue, 31 Mar 2026 19:43:18 -0400
Subject: [PATCH] Fix ASCII art alignment, readonly input opacity, api key
 visibility
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Use white-space:pre-wrap on description view div so newlines and multiple
spaces are preserved natively — no <br> replacement, ASCII art aligns
correctly since body is already monospace (JetBrains Mono).

Override opacity:1 on readonly API key input so generated keys are fully
readable instead of being faded to 0.45 by base.css [readonly] rule.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 assets/css/ticket.css       | 4 ++++
 assets/js/ticket.js         | 5 +++--
 views/admin/ApiKeysView.php | 2 +-
 3 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/assets/css/ticket.css b/assets/css/ticket.css
index 7ac6c0b..da5edaa 100644
--- a/assets/css/ticket.css
+++ b/assets/css/ticket.css
@@ -278,6 +278,10 @@ kbd {
   padding: 0.5rem 0.25rem;
   line-height: 1.75;
   color: var(--text-primary);
+  /* pre-wrap preserves newlines and multiple spaces so ASCII art aligns correctly.
+     font-mono is inherited from body, so box-drawing characters line up. */
+  white-space: pre-wrap;
+  word-break: break-word;
 }
 .ticket-description-view p {
   color: var(--text-secondary);
diff --git a/assets/js/ticket.js b/assets/js/ticket.js
index 05925d8..427daf8 100644
--- a/assets/js/ticket.js
+++ b/assets/js/ticket.js
@@ -89,8 +89,9 @@ function renderDescriptionView() {
     if (!raw.trim()) {
         viewDiv.innerHTML = '<p class="lt-text-muted lt-text-sm"><em>No description provided.</em></p>';
     } else {
-        // Ticket descriptions are plain text — preserve line breaks, never run markdown.
-        viewDiv.innerHTML = lt.escHtml(raw).replace(/\n/g, '<br>');
+        // Ticket descriptions are plain text. CSS white-space:pre-wrap handles
+        // line breaks and multiple spaces (ASCII art) — no <br> replacement needed.
+        viewDiv.innerHTML = lt.escHtml(raw);
     }
 }
 
diff --git a/views/admin/ApiKeysView.php b/views/admin/ApiKeysView.php
index 6b2dd6b..92a40e3 100644
--- a/views/admin/ApiKeysView.php
+++ b/views/admin/ApiKeysView.php
@@ -44,7 +44,7 @@ include __DIR__ . '/../../views/layout_header.php';
     <div id="newKeyDisplay" class="lt-frame-inner lt-mt-sm is-hidden">
       <div class="lt-subsection-header lt-text-amber">&#x26A0; Copy this key now — you won't see it again!</div>
       <div class="lt-flex lt-flex-gap-sm lt-mt-sm">
-        <input type="text" id="newKeyValue" readonly class="lt-input" style="flex:1;font-family:monospace">
+        <input type="text" id="newKeyValue" readonly class="lt-input" style="flex:1;font-family:monospace;opacity:1;cursor:text">
         <button type="button" class="lt-btn lt-btn-sm" data-action="copy-api-key">COPY</button>
       </div>
     </div>