Fix card-enter animation re-trigger and drag hover suppression

Remove card-enter class after entrance animation completes to prevent
re-triggering when card-highlight is removed. Change fill-mode from
both to backwards so stale transforms don't block hover effects.
Suppress hover globally during drag via body.cs-drag-active class.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-02-27 01:10:09 +03:00
parent 9194b978e0
commit f6977105b8
2 changed files with 48 additions and 25 deletions

View File

@@ -73,7 +73,7 @@ section {
}
.card-enter {
animation: cardEnter 0.25s ease-out both;
animation: cardEnter 0.25s ease-out backwards;
}
/* ── Card drag-and-drop reordering ── */
@@ -135,14 +135,22 @@ section {
transition: none;
}
/* Suppress hover effects during drag */
.cs-dragging .card,
.cs-dragging .template-card {
/* Suppress hover effects globally during drag */
body.cs-drag-active .card,
body.cs-drag-active .template-card,
body.cs-drag-active .add-template-card {
transition: none !important;
transform: none !important;
}
.cs-dragging .card-drag-handle {
body.cs-drag-active .add-template-card {
pointer-events: none;
border-color: var(--border-color) !important;
background: transparent !important;
box-shadow: none !important;
}
body.cs-drag-active .card-drag-handle {
opacity: 0 !important;
}