mirror of
https://github.com/hicccc77/WeFlow.git
synced 2026-03-25 07:16:51 +00:00
页面交互与动画优化
This commit is contained in:
@@ -11,6 +11,33 @@
|
||||
padding: 28px 32px;
|
||||
background: rgba(15, 23, 42, 0.28);
|
||||
backdrop-filter: blur(10px);
|
||||
animation: settingsFadeIn 0.2s ease;
|
||||
|
||||
&.closing {
|
||||
animation: settingsFadeOut 0.2s ease forwards;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes settingsFadeIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
backdrop-filter: blur(0);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes settingsFadeOut {
|
||||
from {
|
||||
opacity: 1;
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
to {
|
||||
opacity: 0;
|
||||
backdrop-filter: blur(0);
|
||||
}
|
||||
}
|
||||
|
||||
.settings-page {
|
||||
@@ -25,6 +52,33 @@
|
||||
border-radius: 24px;
|
||||
box-shadow: 0 28px 80px rgba(15, 23, 42, 0.22);
|
||||
overflow: hidden;
|
||||
animation: settingsSlideUp 0.3s ease;
|
||||
|
||||
&.closing {
|
||||
animation: settingsSlideDown 0.2s ease forwards;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes settingsSlideUp {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(30px) scale(0.96);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes settingsSlideDown {
|
||||
from {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
to {
|
||||
opacity: 0;
|
||||
transform: translateY(20px) scale(0.98);
|
||||
}
|
||||
}
|
||||
|
||||
.settings-header {
|
||||
|
||||
Reference in New Issue
Block a user