CSS class migrations: admin views and boot overlay fade-out
- 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:
@@ -66,7 +66,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
</div>
|
||||
|
||||
<!-- 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>
|
||||
<p class="text-danger text-sm mb-1">
|
||||
Copy this key now. You won't be able to see it again!
|
||||
@@ -195,7 +195,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
if (data.success) {
|
||||
// Show the new 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 = '';
|
||||
|
||||
lt.toast.success('API key generated successfully');
|
||||
|
||||
@@ -123,7 +123,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
<option value="number">Number</option>
|
||||
</select>
|
||||
</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>
|
||||
<textarea id="field_options" name="field_options" rows="4" placeholder="Option 1 Option 2 Option 3"></textarea>
|
||||
</div>
|
||||
@@ -208,7 +208,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
|
||||
function toggleOptionsField() {
|
||||
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) {
|
||||
|
||||
@@ -135,7 +135,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
<option value="monthly">Monthly</option>
|
||||
</select>
|
||||
</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>
|
||||
<select id="schedule_day" name="schedule_day"></select>
|
||||
</div>
|
||||
@@ -251,15 +251,15 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
daySelect.innerHTML = '';
|
||||
|
||||
if (type === 'daily') {
|
||||
dayRow.style.display = 'none';
|
||||
dayRow.classList.add('is-hidden');
|
||||
} else if (type === 'weekly') {
|
||||
dayRow.style.display = 'flex';
|
||||
dayRow.classList.remove('is-hidden');
|
||||
const days = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
|
||||
days.forEach((day, i) => {
|
||||
daySelect.innerHTML += `<option value="${i + 1}">${day}</option>`;
|
||||
});
|
||||
} else if (type === 'monthly') {
|
||||
dayRow.style.display = 'flex';
|
||||
dayRow.classList.remove('is-hidden');
|
||||
for (let i = 1; i <= 28; i++) {
|
||||
daySelect.innerHTML += `<option value="${i}">Day ${i}</option>`;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user