fix: kanban not loading on refresh + modal horizontal scroll + lt-kv-row CSS
Kanban restore bug: - set-view-mode click handler called populateKanbanCards() directly but never called setViewMode(), so ticketViewMode was never saved to localStorage - DOMContentLoaded restore checked ticketViewMode (never written) — it should check lt_activeTab_<path> which lt.tabs.init() actually saves - Fix: delegate to setViewMode() from the click handler; DOMContentLoaded reads lt_activeTab_<path> and calls populateKanbanCards() when tab-kanban Settings modal horizontal scroll: - .lt-modal-body was missing overflow-x: hidden; content wider than the modal (e.g. kbd elements with white-space: nowrap) caused horizontal scrollbar - Added overflow-x: hidden + min-width: 0 to .lt-modal-body Missing lt-kv-row / lt-kv-label / lt-kv-value CSS: - These classes were used in TicketView, DashboardView, admin views but had no primary CSS rules (only a light-theme color override existed) - Without rules, lt-kv-row divs were block-level grid children consuming one grid cell each, making lt-kv-label/value stack inside wrong columns - Added display:contents on lt-kv-row so children participate directly in the lt-kv-grid 2-column grid; lt-kv-label/value get padding, border, and min-width:0 + overflow-wrap:break-word to prevent grid column blowout Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1319,7 +1319,9 @@ select option:checked {
|
|||||||
.lt-modal-body {
|
.lt-modal-body {
|
||||||
padding: var(--space-lg);
|
padding: var(--space-lg);
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
|
overflow-x: hidden;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.lt-modal-footer {
|
.lt-modal-footer {
|
||||||
@@ -3187,6 +3189,29 @@ 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); }
|
||||||
|
|
||||||
|
/* lt-kv-row / lt-kv-label / lt-kv-value — alternate KV row pattern */
|
||||||
|
.lt-kv-row {
|
||||||
|
display: contents; /* children become direct grid items of lt-kv-grid */
|
||||||
|
}
|
||||||
|
.lt-kv-label {
|
||||||
|
padding: var(--space-xs) var(--space-md) var(--space-xs) 0;
|
||||||
|
color: var(--text-dim);
|
||||||
|
font-size: 0.75rem;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: 0.05em;
|
||||||
|
white-space: nowrap;
|
||||||
|
border-bottom: 1px solid var(--border-dim);
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
.lt-kv-value {
|
||||||
|
padding: var(--space-xs) 0 var(--space-xs) var(--space-md);
|
||||||
|
color: var(--text-primary);
|
||||||
|
border-bottom: 1px solid var(--border-dim);
|
||||||
|
min-width: 0;
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/* ----------------------------------------------------------------
|
/* ----------------------------------------------------------------
|
||||||
43. HERO / BANNER SECTION
|
43. HERO / BANNER SECTION
|
||||||
|
|||||||
@@ -191,7 +191,7 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||||||
break;
|
break;
|
||||||
// View mode toggle
|
// View mode toggle
|
||||||
case 'set-view-mode':
|
case 'set-view-mode':
|
||||||
if (target.dataset.mode === 'card') populateKanbanCards();
|
setViewMode(target.dataset.mode);
|
||||||
break;
|
break;
|
||||||
// Settings
|
// Settings
|
||||||
case 'open-settings':
|
case 'open-settings':
|
||||||
@@ -1245,14 +1245,15 @@ function populateKanbanCards() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Restore view mode on page load — click the kanban tab button to trigger lt.tabs
|
// Restore view mode on page load — lt.tabs already restores the active panel visually
|
||||||
|
// via lt_activeTab_<path>; we just need to populate kanban cards if that panel is active
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
const savedMode = localStorage.getItem('ticketViewMode');
|
try {
|
||||||
if (savedMode === 'card') {
|
const savedTab = localStorage.getItem('lt_activeTab_' + location.pathname);
|
||||||
const cardBtn = document.getElementById('cardViewBtn');
|
if (savedTab === 'tab-kanban') {
|
||||||
if (cardBtn) cardBtn.click();
|
populateKanbanCards();
|
||||||
else populateKanbanCards();
|
|
||||||
}
|
}
|
||||||
|
} catch (_) {}
|
||||||
});
|
});
|
||||||
|
|
||||||
// ========================================
|
// ========================================
|
||||||
|
|||||||
Reference in New Issue
Block a user