Feature: Modal de confirmation pour les suppressions et style barré pour les todos

- Ajout modal de confirmation personnalisé avec icône, titre et message
- Remplacement de tous les confirm() natifs par le nouveau modal
- Modal animé avec backdrop et fermeture Escape
- Style barré automatique pour les todos complétées (déjà présent)
- Exposition globale des fonctions toggleTodo et deleteTodo
- Confirmation visuelle pour :
  * Suppression de notes
  * Suppression de todos (note et globaux)
  * Suppression d'images
  * Suppression d'utilisateurs
  * Création d'admin
- Design cohérent avec boutons Annuler/Confirmer
- Animations smooth avec transitions CSS
This commit is contained in:
Claude committed 2025-11-11 12:06:59 +00:00
1 parent c70a6725d2
commit 8c39ead2c6
3 files changed
+190 -11

No files matched your search

+65
View File
@@ -524,3 +524,68 @@
background: #c0392b;
transform: translateY(-1px);
}
/* Modal de confirmation */
.confirm-modal {
max-width: 450px;
text-align: center;
padding: var(--spacing-xl) var(--spacing-lg);
}
.confirm-icon {
font-size: 3rem;
margin-bottom: var(--spacing-md);
}
.confirm-title {
font-size: var(--font-size-xl);
font-weight: 600;
margin-bottom: var(--spacing-md);
color: var(--color-text);
}
.confirm-message {
font-size: var(--font-size-base);
color: var(--color-text-secondary);
margin-bottom: var(--spacing-xl);
line-height: 1.6;
}
.confirm-actions {
display: flex;
gap: var(--spacing-md);
justify-content: center;
}
.btn-cancel,
.btn-confirm {
padding: var(--spacing-md) var(--spacing-xl);
border: none;
border-radius: var(--radius-md);
font-size: var(--font-size-base);
font-weight: 500;
cursor: pointer;
transition: all var(--transition-speed);
min-width: 120px;
}
.btn-cancel {
background: var(--color-background);
color: var(--color-text);
border: 2px solid var(--color-border);
}
.btn-cancel:hover {
background: var(--color-border);
}
.btn-confirm {
background: var(--color-danger);
color: white;
}
.btn-confirm:hover {
background: #c0392b;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(231, 76, 60, 0.3);
}