fix: 所有页面卡片背景统一替换为 var(--glass-bg) 确保玻璃效果一致

This commit is contained in:
Yuzhiran Dev
2026-07-11 15:05:43 +08:00
parent 0709e457b3
commit 8149d2a93c
13 changed files with 46 additions and 46 deletions
@@ -192,8 +192,8 @@ function formatDate(dateStr) {
// 总览卡片 // 总览卡片
.overview-card { .overview-card {
padding: 16px 18px; padding: 16px 18px;
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 14px; border-radius: 14px;
margin-bottom: 20px; margin-bottom: 20px;
} }
@@ -262,8 +262,8 @@ function formatDate(dateStr) {
align-items: center; align-items: center;
gap: 12px; gap: 12px;
padding: 12px; padding: 12px;
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 12px; border-radius: 12px;
} }
+2 -2
View File
@@ -306,8 +306,8 @@ function goShare() {
// 欢迎卡片 // 欢迎卡片
.welcome-card { .welcome-card {
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 14px; border-radius: 14px;
padding: 16px; padding: 16px;
margin-bottom: 16px; margin-bottom: 16px;
+4 -5
View File
@@ -299,8 +299,8 @@ function goToAI() {
.content-section, .content-section,
.content-block, .content-block,
.qa-section { .qa-section {
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 12px; border-radius: 12px;
padding: 16px; padding: 16px;
margin-bottom: 12px; margin-bottom: 12px;
@@ -368,15 +368,14 @@ function goToAI() {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 8px; gap: 8px;
margin-top: 12px;
.qa-option { .qa-option {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 12px; gap: 12px;
padding: 12px; padding: 12px;
background: rgba(255, 255, 255, 0.04); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.08); border: 1px solid var(--glass-border);
border-radius: 10px; border-radius: 10px;
transition: all 0.3s; transition: all 0.3s;
+2 -2
View File
@@ -225,8 +225,8 @@ function goDetail(item) {
border-radius: 14px; border-radius: 14px;
padding: 16px; padding: 16px;
margin-bottom: 10px; margin-bottom: 10px;
background: rgba(255,255,255,0.03); background: var(--glass-bg);
border: 1px solid rgba(255,255,255,0.05); border: 1px solid var(--glass-border);
display: flex; display: flex;
gap: 14px; gap: 14px;
align-items: flex-start; align-items: flex-start;
+2 -2
View File
@@ -158,8 +158,8 @@ function goHome() {
flex-direction: column; flex-direction: column;
gap: 8px; gap: 8px;
padding: 16px; padding: 16px;
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 14px; border-radius: 14px;
backdrop-filter: blur(8px); backdrop-filter: blur(8px);
} }
+8 -8
View File
@@ -284,8 +284,8 @@ function goBack() {
.type-btn { .type-btn {
padding: 10px 6px; padding: 10px 6px;
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 10px; border-radius: 10px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@@ -313,8 +313,8 @@ function goBack() {
.form-input { .form-input {
width: 100%; width: 100%;
height: 44px; height: 44px;
background: rgba(255, 255, 255, 0.04); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.08); border: 1px solid var(--glass-border);
border-radius: 10px; border-radius: 10px;
padding: 0 14px; padding: 0 14px;
font-size: 14px; font-size: 14px;
@@ -327,8 +327,8 @@ function goBack() {
.form-textarea { .form-textarea {
width: 100%; width: 100%;
min-height: 100px; min-height: 100px;
background: rgba(255, 255, 255, 0.04); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.08); border: 1px solid var(--glass-border);
border-radius: 10px; border-radius: 10px;
padding: 12px 14px; padding: 12px 14px;
font-size: 14px; font-size: 14px;
@@ -386,8 +386,8 @@ function goBack() {
} }
.my-item { .my-item {
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 10px; border-radius: 10px;
padding: 10px 14px; padding: 10px 14px;
margin-bottom: 8px; margin-bottom: 8px;
+2 -2
View File
@@ -194,8 +194,8 @@ function dimDotColor(id) {
align-items: center; align-items: center;
gap: 12px; gap: 12px;
padding: 12px 14px; padding: 12px 14px;
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 14px; border-radius: 14px;
} }
+6 -5
View File
@@ -257,8 +257,9 @@ onMounted(() => {
gap: 16px; gap: 16px;
margin: 0 20px 20px; margin: 0 20px 20px;
padding: 16px; padding: 16px;
background: rgba(255,255,255,0.02); background: var(--glass-bg);
border-radius: 12px; border-radius: 12px;
border: 1px solid var(--glass-border);
} }
.meta-item { .meta-item {
@@ -323,8 +324,8 @@ onMounted(() => {
.tag-item { .tag-item {
padding: 6px 12px; padding: 6px 12px;
background: rgba(255,255,255,0.03); background: var(--glass-bg);
border: 1px solid rgba(255,255,255,0.08); border: 1px solid var(--glass-border);
border-radius: 20px; border-radius: 20px;
} }
@@ -344,8 +345,8 @@ onMounted(() => {
justify-content: center; justify-content: center;
gap: 8px; gap: 8px;
padding: 14px; padding: 14px;
background: rgba(255,255,255,0.03); background: var(--glass-bg);
border: 1px solid rgba(255,255,255,0.08); border: 1px solid var(--glass-border);
border-radius: 12px; border-radius: 12px;
} }
+6 -6
View File
@@ -244,8 +244,8 @@ function goBack() {
.plan-tag { .plan-tag {
flex: 1; flex: 1;
padding: 16px; padding: 16px;
background: rgba(255, 255, 255, 0.04); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.08); border: 1px solid var(--glass-border);
border-radius: 14px; border-radius: 14px;
text-align: center; text-align: center;
position: relative; position: relative;
@@ -306,8 +306,8 @@ function goBack() {
// 权益 // 权益
.benefits { .benefits {
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 14px; border-radius: 14px;
padding: 16px; padding: 16px;
margin-bottom: 20px; margin-bottom: 20px;
@@ -351,8 +351,8 @@ function goBack() {
.duration-item { .duration-item {
flex: 1; flex: 1;
padding: 12px 8px; padding: 12px 8px;
background: rgba(255, 255, 255, 0.04); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.08); border: 1px solid var(--glass-border);
border-radius: 12px; border-radius: 12px;
text-align: center; text-align: center;
} }
+2 -2
View File
@@ -404,8 +404,8 @@ function goSettings() {
border-radius: 16px; border-radius: 16px;
padding: 16px; padding: 16px;
margin-bottom: 20px; margin-bottom: 20px;
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
} }
.quota-card-title { .quota-card-title {
+2 -2
View File
@@ -344,8 +344,8 @@ function goBack() {
// 维度卡片 // 维度卡片
.dim-card { .dim-card {
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 14px; border-radius: 14px;
margin-bottom: 10px; margin-bottom: 10px;
overflow: hidden; overflow: hidden;
+4 -4
View File
@@ -227,8 +227,8 @@ onUnmounted(() => {
position: relative; position: relative;
margin: 0 20px 16px; margin: 0 20px 16px;
flex-shrink: 0; flex-shrink: 0;
background: rgba(255, 255, 255, 0.04); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.08); border: 1px solid var(--glass-border);
border-radius: 14px; border-radius: 14px;
padding: 10px 44px 10px 14px; padding: 10px 44px 10px 14px;
backdrop-filter: blur(10px); backdrop-filter: blur(10px);
@@ -317,8 +317,8 @@ onUnmounted(() => {
} }
.result-card { .result-card {
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 14px; border-radius: 14px;
padding: 14px 16px; padding: 14px 16px;
margin-bottom: 10px; margin-bottom: 10px;
+2 -2
View File
@@ -243,8 +243,8 @@ function getSampleData() {
} }
.trend-card { .trend-card {
background: rgba(255, 255, 255, 0.03); background: var(--glass-bg);
border: 1px solid rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border);
border-radius: 14px; border-radius: 14px;
padding: 16px; padding: 16px;
margin-bottom: 12px; margin-bottom: 12px;