Rubicon/tutu
1
0
Fork 0
Code Issues 19 Pull requests Projects Activity Actions

Toot: fix expansion animation on WebKit (fix #29)

Browse source
This commit is contained in:
thislight 2024-10-22 23:24:31 +08:00
parent 1134372432
commit faf0700f0c
No known key found for this signature in database
GPG key ID: A50F9451AC56A63E
2 changed files with 8 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
docs/devnotes.md
View file

@ -41,3 +41,9 @@ export function updateAcctInf(idx: number) {
```
Ja, the code is weird, but that's the best we know. Anyway, you need new object on the path of your changed value.
## `transition: *-block or *-inline` does not work on WebKit
Idk why, but transition on logical directions may not work on WebKit - sometimes they work.
Use physical directions to avoid trouble, like "margin-top, margin-bottom".

3
src/timelines/toot.module.css
View file

@ -8,7 +8,8 @@
&.toot {
/* fix composition ordering: I think the css module processor should aware the overriding and behaves, but no */
transition:
margin-block 125ms var(--tutu-anim-curve-std),
margin-top 125ms var(--tutu-anim-curve-std),
margin-bottom 125ms var(--tutu-anim-curve-std),
height 225ms var(--tutu-anim-curve-std),
var(--tutu-transition-shadow);
border-radius: 0;