From 98ee414dc5ab49bdc56ccb4e1fe47ab04ea29e25 Mon Sep 17 00:00:00 2001 From: CasVT Date: Sat, 28 Jun 2025 17:33:26 +0200 Subject: [PATCH] Reduced window slide animation speed on phones --- frontend/static/css/general.css | 8 +++++++- frontend/static/css/reminders.css | 6 +++--- 2 files changed, 10 insertions(+), 4 deletions(-) diff --git a/frontend/static/css/general.css b/frontend/static/css/general.css index bc8a81e..7812753 100644 --- a/frontend/static/css/general.css +++ b/frontend/static/css/general.css @@ -27,7 +27,7 @@ --nav-button-spacing: .5rem; --scrollbar-width: 12px; - --window-slice-duration: 500ms; + --window-slide-duration: 500ms; --dyn-spacing: clamp(.5rem, 2vw, 1rem); --playful-curve: cubic-bezier(0.87, 0, 0.13, 1); --default-shadow: @@ -557,6 +557,12 @@ dialog[open]::backdrop { } } +@media (max-width: 34rem) { + :root { + --window-slide-duration: 200ms; + } +} + @media (max-width: 29rem) { .collaps-table tbody { display: flex; diff --git a/frontend/static/css/reminders.css b/frontend/static/css/reminders.css index 6b74273..54a5e7c 100644 --- a/frontend/static/css/reminders.css +++ b/frontend/static/css/reminders.css @@ -133,12 +133,12 @@ nav > div > button { flex: 0 0 auto; translate: 0 0; - transition: translate var(--window-slice-duration) ease-in-out; + transition: translate var(--window-slide-duration) ease-in-out; } .window-container.inter-window-ani > :where(#home, .extra-window-container) { - transition: translate var(--window-slice-duration) ease-in-out, - transform var(--window-slice-duration) ease-in-out; + transition: translate var(--window-slide-duration) ease-in-out, + transform var(--window-slide-duration) ease-in-out; } .extra-window-container {