fix: resolve build errors and complete missing files

Fix CSS issues, add missing files, and optimize documentation page.

Co-authored-by: null <4804959+fnvtk@users.noreply.github.com>
This commit is contained in:
v0
2025-07-19 02:39:56 +00:00
parent 901763fae0
commit 4ea8963ddc
8 changed files with 408 additions and 1064 deletions

View File

@@ -4,7 +4,6 @@
@layer base {
:root {
/* 更新为毛玻璃风格的颜色变量 */
--background: 240 10% 98%;
--foreground: 240 10% 3.9%;
--card: 240 10% 100%;
@@ -70,7 +69,6 @@
@apply bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900;
}
/* 移动端优化 */
@media (max-width: 768px) {
body {
background-attachment: scroll;
@@ -79,28 +77,30 @@
}
@layer components {
/* 毛玻璃效果基础类 */
.glass {
@apply backdrop-blur-md bg-white/10 border border-white/20;
@apply backdrop-blur-md border border-white/20;
background-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
}
.glass-light {
@apply backdrop-blur-sm bg-white/20 border border-white/30;
@apply backdrop-blur-sm border border-white/30;
background-color: rgba(255, 255, 255, 0.2);
box-shadow: 0 4px 16px 0 rgba(31, 38, 135, 0.2);
}
.glass-heavy {
@apply backdrop-blur-xl bg-white/30 border border-white/40;
@apply backdrop-blur-xl border border-white/40;
background-color: rgba(255, 255, 255, 0.3);
box-shadow: 0 16px 64px 0 rgba(31, 38, 135, 0.5);
}
.glass-dark {
@apply backdrop-blur-md bg-black/10 border border-white/10;
@apply backdrop-blur-md border border-white/10;
background-color: rgba(0, 0, 0, 0.1);
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
}
/* 移动端毛玻璃效果优化 */
@media (max-width: 768px) {
.glass {
@apply backdrop-blur-sm;
@@ -118,42 +118,49 @@
}
}
/* 卡片毛玻璃效果 */
.glass-card {
@apply glass rounded-2xl p-6 transition-all duration-300 hover:bg-white/20 hover:shadow-glass-lg;
@apply glass rounded-2xl p-6 transition-all duration-300;
}
.glass-card:hover {
background-color: rgba(255, 255, 255, 0.2);
}
/* 移动端卡片优化 */
@media (max-width: 768px) {
.glass-card {
@apply p-4 rounded-xl;
}
}
/* 导航栏毛玻璃效果 */
.glass-nav {
@apply glass-light rounded-2xl transition-all duration-300;
}
/* 按钮毛玻璃效果 */
.glass-button {
@apply glass-light rounded-xl px-4 py-2 transition-all duration-300 hover:bg-white/30 hover:scale-105;
@apply glass-light rounded-xl px-4 py-2 transition-all duration-300;
}
.glass-button:hover {
background-color: rgba(255, 255, 255, 0.3);
transform: scale(1.05);
}
/* 移动端按钮优化 */
@media (max-width: 768px) {
.glass-button {
@apply px-6 py-3 text-base;
min-height: 44px; /* iOS推荐的最小触摸目标 */
min-height: 44px;
}
}
/* 输入框毛玻璃效果 */
.glass-input {
@apply glass-light rounded-xl px-4 py-2 transition-all duration-300 focus:bg-white/30 focus:ring-2 focus:ring-white/50;
@apply glass-light rounded-xl px-4 py-2 transition-all duration-300;
}
.glass-input:focus {
background-color: rgba(255, 255, 255, 0.3);
@apply ring-2 ring-white/50;
}
/* 移动端输入框优化 */
@media (max-width: 768px) {
.glass-input {
@apply px-4 py-3 text-base;
@@ -161,7 +168,6 @@
}
}
/* 安全区域适配 */
.safe-area-top {
padding-top: env(safe-area-inset-top);
}
@@ -179,7 +185,6 @@
}
}
/* 移动端滚动优化 */
@media (max-width: 768px) {
.overflow-scroll {
-webkit-overflow-scrolling: touch;