style(css): 添加字体大小 CSS 变量和弹出动画
- 新增 --font-size-base CSS 变量支持全局字体大小 - body 使用 CSS 变量控制字体大小 - 添加 popUp 动画效果用于弹出菜单
This commit is contained in:
parent
5444e7a579
commit
6d1bf7275b
@ -59,6 +59,9 @@
|
||||
--transition-fast: 0.15s ease;
|
||||
--transition-base: 0.2s ease;
|
||||
--transition-slow: 0.3s ease;
|
||||
|
||||
/* 字体大小 */
|
||||
--font-size-base: 15px;
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
@ -92,6 +95,7 @@ body {
|
||||
background-color: var(--color-bg-secondary);
|
||||
color: var(--color-text-primary);
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
||||
font-size: var(--font-size-base);
|
||||
line-height: 1.5;
|
||||
min-height: 100vh;
|
||||
}
|
||||
@ -151,6 +155,17 @@ body {
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes popUp {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(8px) scale(0.95);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.animate-fade-in {
|
||||
animation: fadeIn var(--transition-base);
|
||||
}
|
||||
@ -163,6 +178,10 @@ body {
|
||||
animation: slideDown var(--transition-fast);
|
||||
}
|
||||
|
||||
.animate-pop-up {
|
||||
animation: popUp 0.15s ease-out;
|
||||
}
|
||||
|
||||
/* ========================================
|
||||
响应式设计
|
||||
======================================== */
|
||||
|
||||
Loading…
Reference in New Issue
Block a user