fix: 所有页面卡片背景统一替换为 var(--glass-bg) 确保玻璃效果一致
This commit is contained in:
@@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -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;
|
||||||
|
|||||||
@@ -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;
|
||||||
|
|
||||||
|
|||||||
@@ -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;
|
||||||
|
|||||||
@@ -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);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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;
|
||||||
|
|||||||
@@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -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;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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 {
|
||||||
|
|||||||
@@ -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;
|
||||||
|
|||||||
@@ -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;
|
||||||
|
|||||||
@@ -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;
|
||||||
|
|||||||
Reference in New Issue
Block a user