CSS class migrations: stat-card cursor, view toggle, bulk actions visibility
- Replace stat-card cursor:pointer inline style with CSS rule - Convert view toggle (table/card) to use .is-hidden CSS class - Convert bulk-actions and export-dropdown to use .is-visible class - Add .is-hidden/.is-visible utility rules to dashboard.css - Remove duplicate lt.keys.initDefaults() call from dashboard.js - Remove redundant setTimeout from view mode restore - Add lt.keys.initDefaults() to dashboard.js (was missing entirely) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1413,6 +1413,11 @@ h1 {
|
||||
.loading-overlay--hiding { opacity: 0; }
|
||||
.has-overlay { position: relative; }
|
||||
|
||||
/* Visibility utilities — !important required to override HTML inline style="display:none" */
|
||||
.is-hidden { display: none !important; }
|
||||
.bulk-actions-inline.is-visible { display: flex !important; }
|
||||
.export-dropdown.is-visible { display: inline-block !important; }
|
||||
|
||||
.loading-overlay .loading-text {
|
||||
margin-top: 1rem;
|
||||
animation: blink-cursor 1s step-end infinite;
|
||||
@@ -4580,6 +4585,7 @@ tr:hover .quick-actions {
|
||||
transition: border-color 0.2s ease, transform 0.15s ease;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Corner accent */
|
||||
|
||||
@@ -683,22 +683,14 @@ function updateSelectionCount() {
|
||||
const exportCount = document.getElementById('exportCount');
|
||||
|
||||
if (toolbar && countDisplay) {
|
||||
if (count > 0) {
|
||||
toolbar.style.display = 'flex';
|
||||
countDisplay.textContent = count;
|
||||
} else {
|
||||
toolbar.style.display = 'none';
|
||||
}
|
||||
toolbar.classList.toggle('is-visible', count > 0);
|
||||
if (count > 0) countDisplay.textContent = count;
|
||||
}
|
||||
|
||||
// Show/hide export dropdown based on selection
|
||||
if (exportDropdown) {
|
||||
if (count > 0) {
|
||||
exportDropdown.style.display = '';
|
||||
if (exportCount) exportCount.textContent = count;
|
||||
} else {
|
||||
exportDropdown.style.display = 'none';
|
||||
}
|
||||
exportDropdown.classList.toggle('is-visible', count > 0);
|
||||
if (count > 0 && exportCount) exportCount.textContent = count;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1359,14 +1351,14 @@ function setViewMode(mode) {
|
||||
if (!tableView || !cardView) return;
|
||||
|
||||
if (mode === 'card') {
|
||||
tableView.style.display = 'none';
|
||||
cardView.style.display = 'block';
|
||||
tableView.classList.add('is-hidden');
|
||||
cardView.classList.remove('is-hidden');
|
||||
tableBtn.classList.remove('active');
|
||||
cardBtn.classList.add('active');
|
||||
populateKanbanCards();
|
||||
} else {
|
||||
tableView.style.display = 'block';
|
||||
cardView.style.display = 'none';
|
||||
tableView.classList.remove('is-hidden');
|
||||
cardView.classList.add('is-hidden');
|
||||
tableBtn.classList.add('active');
|
||||
cardBtn.classList.remove('active');
|
||||
}
|
||||
@@ -1444,8 +1436,7 @@ function populateKanbanCards() {
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const savedMode = localStorage.getItem('ticketViewMode');
|
||||
if (savedMode === 'card') {
|
||||
// Delay to ensure DOM is ready
|
||||
setTimeout(() => setViewMode('card'), 100);
|
||||
setViewMode('card');
|
||||
}
|
||||
});
|
||||
|
||||
@@ -1755,6 +1746,7 @@ function initRelativeTimes() {
|
||||
document.addEventListener('DOMContentLoaded', initRelativeTimes);
|
||||
setInterval(initRelativeTimes, 60000);
|
||||
|
||||
|
||||
// Export for use in other scripts
|
||||
window.generateSkeletonRows = generateSkeletonRows;
|
||||
window.generateSkeletonComments = generateSkeletonComments;
|
||||
|
||||
@@ -524,7 +524,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
<!-- END OUTER FRAME -->
|
||||
|
||||
<!-- Kanban Card View -->
|
||||
<section id="cardView" class="card-view-container" style="display: none;" aria-label="Kanban board view">
|
||||
<section id="cardView" class="card-view-container is-hidden" aria-label="Kanban board view">
|
||||
<div class="kanban-board">
|
||||
<div class="kanban-column" data-status="Open">
|
||||
<div class="kanban-column-header status-Open">
|
||||
@@ -992,7 +992,6 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
|
||||
// Stat card click handlers for filtering
|
||||
document.querySelectorAll('.stat-card').forEach(card => {
|
||||
card.style.cursor = 'pointer';
|
||||
card.addEventListener('click', function() {
|
||||
const classList = this.classList;
|
||||
let url = '/?';
|
||||
|
||||
Reference in New Issue
Block a user