xuchao/pingxiangcard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(reserve): migrate hardcoded colors, font sizes, and weights to design tokens

Browse Source
This commit is contained in:
jacobxu666
2026-06-26 11:05:22 +08:00
parent 824bb3b808
commit c78f97301d
3 changed files with 96 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/reserve/reserve-index.vue
+38 -38
View File
@@ -230,7 +230,7 @@ $bar-height: 120rpx;
.page {
min-height: 100vh;
background: #f7f8fa;
background: $color-background;
padding-bottom: calc(#{$bar-height} + env(safe-area-inset-bottom));
font-family: $font-family-body;
}
@@ -238,7 +238,7 @@ $bar-height: 120rpx;
/* ===== 景区信息卡片 ===== */
.scenic-card {
margin: 24rpx 24rpx 0;
background: #ffffff;
background: $color-card;
border-radius: $radius-lg;
overflow: hidden;
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.04);
@@ -256,8 +256,8 @@ $bar-height: 120rpx;
.scenic-name {
display: block;
font-family: $font-family-body;
font-size: 28rpx;
font-weight: 700;
font-size: $font-size-base;
font-weight: $font-weight-bold;
color: $uv-main-color;
margin-bottom: 12rpx;
}
@@ -320,7 +320,7 @@ $bar-height: 120rpx;
.scenic-text {
font-family: $font-family-body;
font-size: 24rpx;
font-size: $font-size-sm;
color: $uv-tips-color;
}
@@ -336,7 +336,7 @@ $bar-height: 120rpx;
/* ===== 日期选择 ===== */
.date-card {
margin: 24rpx 32rpx 0;
background: #ffffff;
background: $color-card;
border-radius: $radius-lg;
padding: 32rpx;
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.04);
@@ -345,8 +345,8 @@ $bar-height: 120rpx;
.section-title {
display: block;
font-family: $font-family-body;
font-size: 30rpx;
font-weight: 500;
font-size: $font-size-lg;
font-weight: $font-weight-medium;
color: $uv-main-color;
margin-bottom: 24rpx;
}
@@ -368,7 +368,7 @@ $bar-height: 120rpx;
padding: 16rpx 12rpx;
border-radius: 16rpx;
border: 2rpx solid $uv-border-color;
transition: all 0.15s ease;
transition: all $transition-fast;
&--active {
background: $uv-primary;
@@ -378,7 +378,7 @@ $bar-height: 120rpx;
.date-week {
font-family: $font-family-body;
font-size: 18rpx;
font-size: $font-size-xxs;
color: $uv-tips-color;
margin-bottom: 4rpx;
}
@@ -389,8 +389,8 @@ $bar-height: 120rpx;
.date-day {
font-family: $font-family-body;
font-size: 20rpx;
font-weight: 700;
font-size: $font-size-xs;
font-weight: $font-weight-bold;
color: $uv-main-color;
margin-bottom: 4rpx;
}
@@ -401,11 +401,11 @@ $bar-height: 120rpx;
.date-stock {
font-family: $font-family-body;
font-size: 18rpx;
font-size: $font-size-xxs;
color: $uv-placeholder-color;
&--empty {
color: #f53f3f;
color: $uv-error;
}
}
@@ -432,8 +432,8 @@ $bar-height: 120rpx;
.session-title {
display: block;
font-family: $font-family-body;
font-size: 26rpx;
font-weight: 500;
font-size: $font-size-sm;
font-weight: $font-weight-medium;
color: $uv-main-color;
margin-bottom: 16rpx;
}
@@ -451,7 +451,7 @@ $bar-height: 120rpx;
padding: 16rpx 28rpx;
border-radius: 12rpx;
border: 2rpx solid $uv-border-color;
transition: all 0.15s ease;
transition: all $transition-fast;
&--active {
background: rgba(60, 156, 255, 0.08);
@@ -465,8 +465,8 @@ $bar-height: 120rpx;
.session-time {
font-family: $font-family-body;
font-size: 20rpx;
font-weight: 500;
font-size: $font-size-xs;
font-weight: $font-weight-medium;
color: $uv-main-color;
margin-bottom: 4rpx;
}
@@ -477,11 +477,11 @@ $bar-height: 120rpx;
.session-stock {
font-family: $font-family-body;
font-size: 18rpx;
font-size: $font-size-xxs;
color: $uv-placeholder-color;
&--empty {
color: #f53f3f;
color: $uv-error;
}
}
@@ -493,14 +493,14 @@ $bar-height: 120rpx;
.no-session-tip__text {
font-family: $font-family-body;
font-size: 18rpx;
font-size: $font-size-xxs;
color: $uv-placeholder-color;
}
.date-tip {
display: block;
font-family: $font-family-body;
font-size: 18rpx;
font-size: $font-size-xxs;
color: $uv-placeholder-color;
margin-top: 16rpx;
}
@@ -508,7 +508,7 @@ $bar-height: 120rpx;
/* ===== 预约人信息 ===== */
.user-card {
margin: 24rpx 32rpx 0;
background: #ffffff;
background: $color-card;
border-radius: $radius-lg;
padding: 32rpx;
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.04);
@@ -523,21 +523,21 @@ $bar-height: 120rpx;
.user-label {
font-family: $font-family-body;
font-size: 26rpx;
font-size: $font-size-sm;
color: $uv-main-color;
}
.user-value {
font-family: $font-family-body;
font-size: 26rpx;
font-size: $font-size-sm;
color: $uv-content-color;
}
.user-warn {
display: block;
font-family: $font-family-body;
font-size: 24rpx;
color: #e53935;
font-size: $font-size-sm;
color: $uv-error;
margin-top: 12rpx;
}
@@ -552,8 +552,8 @@ $bar-height: 120rpx;
.notice-title {
display: block;
font-family: $font-family-body;
font-size: 30rpx;
font-weight: 700;
font-size: $font-size-lg;
font-weight: $font-weight-bold;
color: $uv-main-color;
margin-bottom: 20rpx;
}
@@ -580,7 +580,7 @@ $bar-height: 120rpx;
.notice-text {
font-family: $font-family-body;
font-size: 26rpx;
font-size: $font-size-sm;
color: $uv-tips-color;
line-height: 1.6;
}
@@ -591,9 +591,9 @@ $bar-height: 120rpx;
.notice-link__text {
font-family: $font-family-body;
font-size: 26rpx;
font-size: $font-size-sm;
color: $uv-primary;
font-weight: 500;
font-weight: $font-weight-medium;
}
/* ===== 底部 ===== */
@@ -609,7 +609,7 @@ $bar-height: 120rpx;
width: 100%;
box-sizing: border-box;
height: $bar-height;
background: #ffffff;
background: $color-card;
display: flex;
align-items: center;
justify-content: center;
@@ -628,7 +628,7 @@ $bar-height: 120rpx;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.15s ease;
transition: all $transition-fast;
&::after { display: none; }
@@ -637,14 +637,14 @@ $bar-height: 120rpx;
}
&--disabled {
background: #e5e7eb;
background: $uv-bg-color;
}
}
.btn-submit__text {
font-family: $font-family-body;
font-size: 30rpx;
font-weight: 700;
font-size: $font-size-lg;
font-weight: $font-weight-bold;
color: #ffffff;
}