feat(chat): soften the committed-block reveal into a materialize cascade

The 140ms fade read as a pop next to the scroll glide. The reveal now
runs 320ms on an ease-out-quint curve with a 10px rise and a touch of
blur resolving — paint-only properties throughout, so row measurement is
untouched — and blocks committed in the same tick cascade with a 55ms
stagger instead of appearing together. Reduced motion still disables the
whole thing.
This commit is contained in:
Bohdan Triapitsyn
2026-08-25 23:08:36 +03:00
parent d71bcb5025
commit 5e37a436c1
2 changed files with 21 additions and 5 deletions
+12 -4
View File
@@ -1378,21 +1378,29 @@ html:not(.dark) .chat-scroll {
}
}
/* A block committed mid-stream enters with a short fade-and-rise; the
transform is paint-only, so virtualized row measurement is unaffected. */
/* A block committed mid-stream materializes: fade, a gentle rise, and a
touch of blur resolving. Transform and filter are paint-only, so
virtualized row measurement is unaffected. Blocks committed in the same
tick cascade via --oc-md-enter-delay set inline by the renderer. */
@keyframes oc-md-block-enter {
from {
opacity: 0;
transform: translateY(4px);
transform: translateY(10px);
filter: blur(2px);
}
60% {
filter: blur(0);
}
to {
opacity: 1;
transform: none;
filter: none;
}
}
.oc-md-block-enter {
animation: oc-md-block-enter 140ms ease-out both;
animation: oc-md-block-enter 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
animation-delay: var(--oc-md-enter-delay, 0ms);
}
@media (prefers-reduced-motion: reduce) {