GithubBackup/MoviePilot-Frontend
1
0
Fork 0
mirror of https://github.com/jxxghp/MoviePilot-Frontend.git synced 2026-07-09 06:21:57 +08:00
Code Issues Packages Projects Releases Wiki Activity

优化加载动画

Browse Source
This commit is contained in:
jxxghp
2025-04-23 08:24:21 +08:00
parent 74d7b2b280
commit 3b0123f2be
3 changed files with 11 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
public/loader.css
View File

@@ -5,25 +5,28 @@
background: var(--initial-loader-bg, #fff);
block-size: 100vh;
inline-size: 100vw;
transition: opacity 0.8s ease;
transition: opacity 0.8s ease, transform 0.8s ease, filter 0.8s ease;
}
.loading-logo {
position: absolute;
inset-block-start: 35%;
inset-inline-start: calc(50% - 5rem);
transition: transform 0.8s ease, opacity 0.8s ease;
transition: opacity 0.8s ease, transform 0.8s ease, filter 0.8s ease;
}
/* 添加logo完成动画 */
/* 添加logo完成动画 - 放大虚化效果 */
.loading-complete .loading-logo {
filter: blur(10px);
opacity: 0;
transform: scale(1.2) rotate(360deg);
transform: scale(1.5);
}
/* 添加加载背景消失动画 */
/* 添加加载背景消失动画 - 放大虚化效果 */
.loading-complete {
filter: blur(15px);
opacity: 0;
transform: scale(1.2);
}
.loading {
@@ -92,18 +95,3 @@
transform: rotate(1turn);
}
}
/* 添加logo脉冲效果动画 */
@keyframes pulse-scale {
0% {
transform: scale(1);
}
50% {
transform: scale(1.1);
}
100% {
transform: scale(1);
}
}