mirror of https://github.com/sveltejs/svelte
fix: improve animation name transformation (#10432)
* fix: improve animation name transformation * oops * s * minor style tweaks * expand changeset description --------- Co-authored-by: Rich Harris <rich.harris@vercel.com>pull/10441/head
parent
2d032c733d
commit
49bfb6b1d6
@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
'svelte': patch
|
||||||
|
---
|
||||||
|
|
||||||
|
fix: make CSS animation declaration transformation more robust
|
@ -0,0 +1,24 @@
|
|||||||
|
|
||||||
|
@keyframes svelte-xyz-a {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: scale(2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes svelte-xyz-animation {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: scale(2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h1.svelte-xyz {
|
||||||
|
animation: 1s linear infinite svelte-xyz-a;
|
||||||
|
animation: svelte-xyz-a 1s linear infinite;
|
||||||
|
animation: 1s linear infinite svelte-xyz-a,svelte-xyz-animation 1s linear infinite;
|
||||||
|
}
|
@ -0,0 +1,27 @@
|
|||||||
|
<h1>test</h1>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
@keyframes a {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: scale(2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes animation {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: scale(2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
animation: 1s linear infinite a;
|
||||||
|
animation: a 1s linear infinite;
|
||||||
|
animation: 1s linear infinite a,animation 1s linear infinite;
|
||||||
|
}
|
||||||
|
</style>
|
Loading…
Reference in new issue