bd4rr/vue-naive-admin
1
0
Fork 0
mirror of https://github.com/zclzone/vue-naive-admin.git synced 2026-01-23 16:10:21 +08:00
Code Activity

style: 优化主题切换过渡动画

Browse Source
This commit is contained in:
zclzone
2024-06-25 18:17:17 +08:00
parent c230e86767
commit 3c2e120e34
2 changed files with 49 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/styles/global.scss
View File

@@ -74,21 +74,18 @@ body {
}
/* 切换主题的动画效果 */
::view-transition-old(root) {
::view-transition-old(root),
::view-transition-new(root) {
animation: none;
mix-blend-mode: normal;
}
::view-transition-new(root) {
animation: 0.5s ease-in circle-animation;
mix-blend-mode: normal;
::view-transition-old(root),
.dark::view-transition-new(root) {
z-index: 1;
}
@keyframes circle-animation {
from {
clip-path: circle(0 at var(--circle-x) var(--circle-y));
}
to {
clip-path: circle(var(--circle-r) at var(--circle-x) var(--circle-y));
}
::view-transition-new(root),
.dark::view-transition-old(root) {
z-index: 9999;
}