Add UI animations: dialogs, tabs, settings, browser stagger, banner pulse
- Dialog modals: scale+fade entrance/exit with animated backdrop - Tab panels: fade-in with subtle slide on switch - Settings sections: content slide-down on expand - Browser grid/list items: staggered cascade entrance animation - Connection banner: slide-in + attention pulse on disconnect - Accessibility: prefers-reduced-motion disables all animations Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -331,6 +331,14 @@ function showToast(message, type = 'success') {
|
||||
}, TOAST_DURATION_MS);
|
||||
}
|
||||
|
||||
function closeDialog(dialog) {
|
||||
dialog.classList.add('dialog-closing');
|
||||
dialog.addEventListener('animationend', () => {
|
||||
dialog.classList.remove('dialog-closing');
|
||||
dialog.close();
|
||||
}, { once: true });
|
||||
}
|
||||
|
||||
function showConfirm(message) {
|
||||
return new Promise((resolve) => {
|
||||
const dialog = document.getElementById('confirmDialog');
|
||||
@@ -344,7 +352,7 @@ function showConfirm(message) {
|
||||
btnCancel.removeEventListener('click', onCancel);
|
||||
btnConfirm.removeEventListener('click', onConfirm);
|
||||
dialog.removeEventListener('close', onClose);
|
||||
dialog.close();
|
||||
closeDialog(dialog);
|
||||
}
|
||||
|
||||
function onCancel() { cleanup(); resolve(false); }
|
||||
|
||||
Reference in New Issue
Block a user