From 13fa0de8913215f80337e79d5cbaa307efe58d06 Mon Sep 17 00:00:00 2001 From: dobby-d-elf Date: Thu, 21 May 2026 07:59:16 -0600 Subject: [PATCH] refined iOS enter animations --- static/sessions.js | 2 +- static/style.css | 5 ++--- tests/test_session_touch_actions.py | 5 ++++- 3 files changed, 7 insertions(+), 5 deletions(-) diff --git a/static/sessions.js b/static/sessions.js index decb50ec..fbde5c7b 100644 --- a/static/sessions.js +++ b/static/sessions.js @@ -3735,7 +3735,7 @@ function renderSessionListFromCache(){ const overshoot=Math.max(0,Math.abs(rawOffset)-72); const offset=Math.sign(rawOffset)*(Math.abs(revealedOffset)+Math.sqrt(overshoot)*5); const progress=Math.min(1,Math.abs(revealedOffset)/72); - const reveal=Math.min(132,Math.max(36,Math.abs(rawOffset)+24)); + const reveal=Math.abs(offset); const iconScale=1+Math.min(.45,Math.max(0,Math.abs(rawOffset)-52)/130); el.style.setProperty('--session-swipe-offset',offset+'px'); el.style.setProperty('--session-swipe-reveal',reveal+'px'); diff --git a/static/style.css b/static/style.css index b3a3fd0c..1e1536f0 100644 --- a/static/style.css +++ b/static/style.css @@ -676,12 +676,11 @@ justify-content:center; gap:3px; width:var(--session-swipe-reveal,0px); - min-width:36px; padding:0 8px; box-sizing:border-box; opacity:0; overflow:hidden; - transform:translate3d(calc(-1 * var(--session-swipe-offset,0px)),0,0) scale(calc(.82 + var(--session-swipe-progress,0) * .18)); + transform:translate3d(calc(-1 * var(--session-swipe-offset,0px)),0,0); pointer-events:none; z-index:0; } @@ -712,7 +711,7 @@ align-items:center; justify-content:center; color:#fff; - transform:scaleX(var(--session-swipe-icon-scale,1)); + transform:scale(var(--session-swipe-icon-scale,1)); transform-origin:center; } .session-swipe-badge svg{display:block;stroke-width:2.2;} diff --git a/tests/test_session_touch_actions.py b/tests/test_session_touch_actions.py index 0e9e36e4..f42f8353 100644 --- a/tests/test_session_touch_actions.py +++ b/tests/test_session_touch_actions.py @@ -129,6 +129,7 @@ def test_session_swipe_paint_uses_transform_only_exit(): assert "--session-swipe-offset" in paint assert "--session-swipe-reveal" in paint assert "--session-swipe-progress" in paint + assert "const reveal=Math.abs(offset);" in paint assert "window.innerWidth+'px'" in complete assert "el.style.height=rect.height+'px'" in complete assert "requestAnimationFrame(()=>el.classList.add('swipe-removing'))" in complete @@ -136,7 +137,9 @@ def test_session_swipe_paint_uses_transform_only_exit(): assert "el.classList.remove('swiping-right','swiping-left','swipe-committed','swipe-removing')" in clear assert ".session-item.swipe-committed,\n .session-item.swipe-removing{transition:" in STYLE_CSS assert "transition:background .15s,color .15s,transform .5s cubic-bezier(.22,.61,.36,1),box-shadow .15s ease" in STYLE_CSS - assert "transform:translate3d(calc(-1 * var(--session-swipe-offset,0px)),0,0) scale(calc(.82 + var(--session-swipe-progress,0) * .18))" in STYLE_CSS + assert "transform:translate3d(calc(-1 * var(--session-swipe-offset,0px)),0,0)" in STYLE_CSS + assert "transform:scale(var(--session-swipe-icon-scale,1))" in STYLE_CSS + assert "min-width:36px" not in STYLE_CSS[STYLE_CSS.find(".session-swipe-affordance{"):STYLE_CSS.find(".session-swipe-affordance-right{")] swipe_start = STYLE_CSS.find(".session-item.swipe-removing{") swipe_end = STYLE_CSS.find("}", swipe_start) assert swipe_start >= 0 and swipe_end > swipe_start