|
|
|
@ -64,7 +64,7 @@ function toggleTheme(event: MouseEvent) {
|
|
|
|
`circle(0px at ${x}px ${y}px)`,
|
|
|
|
`circle(0px at ${x}px ${y}px)`,
|
|
|
|
`circle(${endRadius}px at ${x}px ${y}px)`,
|
|
|
|
`circle(${endRadius}px at ${x}px ${y}px)`,
|
|
|
|
];
|
|
|
|
];
|
|
|
|
document.documentElement.animate(
|
|
|
|
const animate = document.documentElement.animate(
|
|
|
|
{
|
|
|
|
{
|
|
|
|
clipPath: isDark.value ? [...clipPath].reverse() : clipPath,
|
|
|
|
clipPath: isDark.value ? [...clipPath].reverse() : clipPath,
|
|
|
|
},
|
|
|
|
},
|
|
|
|
@ -76,6 +76,9 @@ function toggleTheme(event: MouseEvent) {
|
|
|
|
: '::view-transition-new(root)',
|
|
|
|
: '::view-transition-new(root)',
|
|
|
|
},
|
|
|
|
},
|
|
|
|
);
|
|
|
|
);
|
|
|
|
|
|
|
|
animate.onfinish = () => {
|
|
|
|
|
|
|
|
transition.skipTransition();
|
|
|
|
|
|
|
|
};
|
|
|
|
});
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
|
|