From 196fcea328887b40d9dd7ba1cd0bf0f18f54ee86 Mon Sep 17 00:00:00 2001 From: Sunil Mohan Adapa Date: Tue, 3 Feb 2026 14:20:36 -0800 Subject: [PATCH] ui: Add animation for notification dismissal Tests: - When a notification dismiss button is clicked, first it fades and collapses at the same time. Signed-off-by: Sunil Mohan Adapa Reviewed-by: Joseph Nuthalapati --- static/themes/default/css/main.css | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/static/themes/default/css/main.css b/static/themes/default/css/main.css index 603b120bc..d6d7ec504 100644 --- a/static/themes/default/css/main.css +++ b/static/themes/default/css/main.css @@ -945,12 +945,20 @@ section.app-description { .notification { padding: 0.625rem 0.9375rem; border-left: 0.3125rem solid; + max-height: 100rem; /* HACK: Very high value for closing transition. */ } .notification:not(:first-child) { border-top: 1px solid var(--bs-border-color-translucent); } +.notification.htmx-swapping { + opacity: 0; + overflow: hidden; + max-height: 0; + transition: opacity 0.3s, max-height 0.3s; +} + .notification-time { float: right; font-size: 0.8rem;