mirror of
https://github.com/fastapiadmin/FastapiAdmin.git
synced 2026-10-02 00:27:16 +00:00
47 lines
1.1 KiB
CSS
47 lines
1.1 KiB
CSS
/* ============================================================================
|
|
* Animations — 关键帧动画(去重) + 应用
|
|
* 集中所有 @keyframes,避免在多文件中重复定义。
|
|
* ============================================================================ */
|
|
|
|
/* 页面渐入 */
|
|
@keyframes fadeInUp {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(40px);
|
|
filter: blur(8px);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
filter: blur(0);
|
|
}
|
|
}
|
|
|
|
/* 视图过渡(View Transitions API) */
|
|
@keyframes vtFadeOut {
|
|
from { opacity: 1; }
|
|
to { opacity: 0; }
|
|
}
|
|
|
|
@keyframes vtFadeIn {
|
|
from { opacity: 0; transform: translateY(8px); }
|
|
to { opacity: 1; transform: translateY(0); }
|
|
}
|
|
|
|
::view-transition-old(root) {
|
|
animation: vtFadeOut 0.3s ease;
|
|
}
|
|
|
|
::view-transition-new(root) {
|
|
animation: vtFadeIn 0.4s ease 0.05s;
|
|
}
|
|
|
|
/* Hero 与 Features 应用渐入动画 */
|
|
.dark :deep(.VPHero) {
|
|
animation: fadeInUp 0.9s cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
}
|
|
|
|
.dark :deep(.VPHero .features) {
|
|
animation: fadeInUp 1s cubic-bezier(0.34, 1.56, 0.64, 1) 0.25s both;
|
|
}
|