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

CSS class migrations: admin views and boot overlay fade-out

Browse Source 
- Replace style.display with .is-hidden classList in ApiKeysView, CustomFieldsView, RecurringTicketsView
- Convert boot overlay fade-out from style.opacity to .boot-overlay--fade-out CSS class
- Add .boot-overlay--fade-out rule to dashboard.css

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Jared Vititoe
2026-03-20 21:20:55 -04:00
parent f45ec9b0f7
commit ce95e555d5
5 changed files with 10 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
assets/css/dashboard.css
View File

@@ -2725,6 +2725,7 @@ input[type="checkbox"]:checked {
justify-content: center; justify-content: center;
transition: opacity 0.5s; transition: opacity 0.5s;
} }
.boot-overlay--fade-out { opacity: 0; }
#boot-text { #boot-text {
font-family: var(--font-mono); font-family: var(--font-mono);

2
views/DashboardView.php
View File

@@ -63,7 +63,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
i++; i++;
} else { } else {
setTimeout(() => { setTimeout(() => {
bootOverlay.style.opacity = '0'; bootOverlay.classList.add('boot-overlay--fade-out');
setTimeout(() => bootOverlay.remove(), 500); setTimeout(() => bootOverlay.remove(), 500);
}, 500); }, 500);
clearInterval(interval); clearInterval(interval);

4
views/admin/ApiKeysView.php
View File

@@ -66,7 +66,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
</div> </div>
<!-- New Key Display (hidden by default) --> <!-- New Key Display (hidden by default) -->
<div id="newKeyDisplay" class="ascii-frame-inner key-generated-alert" style="display: none;"> <div id="newKeyDisplay" class="ascii-frame-inner key-generated-alert is-hidden">
<h3 class="admin-section-title">New API Key Generated</h3> <h3 class="admin-section-title">New API Key Generated</h3>
<p class="text-danger text-sm mb-1"> <p class="text-danger text-sm mb-1">
Copy this key now. You won't be able to see it again! Copy this key now. You won't be able to see it again!
@@ -195,7 +195,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
if (data.success) { if (data.success) {
// Show the new key // Show the new key
document.getElementById('newKeyValue').value = data.api_key; document.getElementById('newKeyValue').value = data.api_key;
document.getElementById('newKeyDisplay').style.display = 'block'; document.getElementById('newKeyDisplay').classList.remove('is-hidden');
document.getElementById('keyName').value = ''; document.getElementById('keyName').value = '';
lt.toast.success('API key generated successfully'); lt.toast.success('API key generated successfully');

4
views/admin/CustomFieldsView.php
View File

@@ -123,7 +123,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
<option value="number">Number</option> <option value="number">Number</option>
</select> </select>
</div> </div>
<div class="setting-row" id="options_row" style="display: none;"> <div class="setting-row is-hidden" id="options_row">
<label for="field_options">Options (one per line)</label> <label for="field_options">Options (one per line)</label>
<textarea id="field_options" name="field_options" rows="4" placeholder="Option 1&#10;Option 2&#10;Option 3"></textarea> <textarea id="field_options" name="field_options" rows="4" placeholder="Option 1&#10;Option 2&#10;Option 3"></textarea>
</div> </div>
@@ -208,7 +208,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
function toggleOptionsField() { function toggleOptionsField() {
const type = document.getElementById('field_type').value; const type = document.getElementById('field_type').value;
document.getElementById('options_row').style.display = type === 'select' ? 'block' : 'none'; document.getElementById('options_row').classList.toggle('is-hidden', type !== 'select');
} }
function saveField(e) { function saveField(e) {

8
views/admin/RecurringTicketsView.php
View File

@@ -135,7 +135,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
<option value="monthly">Monthly</option> <option value="monthly">Monthly</option>
</select> </select>
</div> </div>
<div class="setting-row" id="schedule_day_row" style="display: none;"> <div class="setting-row is-hidden" id="schedule_day_row">
<label for="schedule_day">Schedule Day</label> <label for="schedule_day">Schedule Day</label>
<select id="schedule_day" name="schedule_day"></select> <select id="schedule_day" name="schedule_day"></select>
</div> </div>
@@ -251,15 +251,15 @@ $nonce = SecurityHeadersMiddleware::getNonce();
daySelect.innerHTML = ''; daySelect.innerHTML = '';
if (type === 'daily') { if (type === 'daily') {
dayRow.style.display = 'none'; dayRow.classList.add('is-hidden');
} else if (type === 'weekly') { } else if (type === 'weekly') {
dayRow.style.display = 'flex'; dayRow.classList.remove('is-hidden');
const days = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; const days = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
days.forEach((day, i) => { days.forEach((day, i) => {
daySelect.innerHTML += `<option value="${i + 1}">${day}</option>`; daySelect.innerHTML += `<option value="${i + 1}">${day}</option>`;
}); });
} else if (type === 'monthly') { } else if (type === 'monthly') {
dayRow.style.display = 'flex'; dayRow.classList.remove('is-hidden');
for (let i = 1; i <= 28; i++) { for (let i = 1; i <= 28; i++) {
daySelect.innerHTML += `<option value="${i}">Day ${i}</option>`; daySelect.innerHTML += `<option value="${i}">Day ${i}</option>`;
} }