|
|
@@ -339,10 +339,10 @@ export default {
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style scoped>
|
|
|
+<style scoped lang="scss">
|
|
|
.dd-container {
|
|
|
min-height: 100vh;
|
|
|
- background: #F5FAFE;
|
|
|
+ background: $brand-legacy-blue-tint;
|
|
|
padding-bottom: 100rpx;
|
|
|
}
|
|
|
.dd-loading {
|
|
|
@@ -353,13 +353,13 @@ export default {
|
|
|
}
|
|
|
.loading-text {
|
|
|
font-size: 28rpx;
|
|
|
- color: #999;
|
|
|
+ color: $facade-text-muted;
|
|
|
}
|
|
|
.dd-header {
|
|
|
- background: linear-gradient(135deg, #4A9BD7, #63B3ED);
|
|
|
+ background: linear-gradient(135deg, $brand-legacy-blue, $brand-legacy-blue-light);
|
|
|
padding: 60rpx 0;
|
|
|
text-align: center;
|
|
|
- color: #fff;
|
|
|
+ color: $app-surface;
|
|
|
}
|
|
|
.dd-score-ring {
|
|
|
width: 160rpx;
|
|
|
@@ -395,7 +395,7 @@ export default {
|
|
|
background: rgba(255,255,255,0.2);
|
|
|
}
|
|
|
.dd-section {
|
|
|
- background: #fff;
|
|
|
+ background: $app-surface;
|
|
|
margin: 20rpx 30rpx;
|
|
|
border-radius: 20rpx;
|
|
|
padding: 30rpx;
|
|
|
@@ -404,7 +404,7 @@ export default {
|
|
|
.dd-section-title {
|
|
|
font-size: 32rpx;
|
|
|
font-weight: 600;
|
|
|
- color: #333;
|
|
|
+ color: $facade-text-strong;
|
|
|
margin-bottom: 20rpx;
|
|
|
display: block;
|
|
|
}
|
|
|
@@ -422,11 +422,11 @@ export default {
|
|
|
}
|
|
|
.empty-text {
|
|
|
font-size: 28rpx;
|
|
|
- color: #999;
|
|
|
+ color: $facade-text-muted;
|
|
|
}
|
|
|
.empty-sub {
|
|
|
font-size: 24rpx;
|
|
|
- color: #ccc;
|
|
|
+ color: $facade-text-ghost;
|
|
|
margin-top: 10rpx;
|
|
|
}
|
|
|
.dd-percentile-wrap {
|
|
|
@@ -436,11 +436,11 @@ export default {
|
|
|
.dd-percentile-value {
|
|
|
font-size: 48rpx;
|
|
|
font-weight: 700;
|
|
|
- color: #4A9BD7;
|
|
|
+ color: $brand-legacy-blue;
|
|
|
}
|
|
|
.dd-percentile-label {
|
|
|
font-size: 26rpx;
|
|
|
- color: #888;
|
|
|
+ color: $facade-text-faint;
|
|
|
margin-top: 10rpx;
|
|
|
display: block;
|
|
|
}
|
|
|
@@ -448,7 +448,7 @@ export default {
|
|
|
display: flex;
|
|
|
align-items: flex-start;
|
|
|
padding: 16rpx 0;
|
|
|
- border-bottom: 1rpx solid #f5f5f5;
|
|
|
+ border-bottom: 1rpx solid $facade-fill-2;
|
|
|
}
|
|
|
.dd-suggestion-item:last-child {
|
|
|
border-bottom: none;
|
|
|
@@ -456,8 +456,8 @@ export default {
|
|
|
.dd-sug-num {
|
|
|
width: 40rpx;
|
|
|
height: 40rpx;
|
|
|
- background: #4A9BD7;
|
|
|
- color: #fff;
|
|
|
+ background: $brand-legacy-blue;
|
|
|
+ color: $app-surface;
|
|
|
border-radius: 50%;
|
|
|
text-align: center;
|
|
|
line-height: 40rpx;
|
|
|
@@ -468,14 +468,14 @@ export default {
|
|
|
}
|
|
|
.dd-sug-text {
|
|
|
font-size: 28rpx;
|
|
|
- color: #555;
|
|
|
+ color: $facade-text-deep;
|
|
|
line-height: 1.6;
|
|
|
flex: 1;
|
|
|
}
|
|
|
.dd-product-item {
|
|
|
display: flex;
|
|
|
padding: 20rpx 0;
|
|
|
- border-bottom: 1rpx solid #f5f5f5;
|
|
|
+ border-bottom: 1rpx solid $facade-fill-2;
|
|
|
}
|
|
|
.dd-product-item:last-child {
|
|
|
border-bottom: none;
|
|
|
@@ -486,7 +486,7 @@ export default {
|
|
|
border-radius: 12rpx;
|
|
|
margin-right: 20rpx;
|
|
|
flex-shrink: 0;
|
|
|
- background: #f0f0f0;
|
|
|
+ background: $facade-fill;
|
|
|
}
|
|
|
.dd-prod-info {
|
|
|
flex: 1;
|
|
|
@@ -496,12 +496,12 @@ export default {
|
|
|
}
|
|
|
.dd-prod-name {
|
|
|
font-size: 28rpx;
|
|
|
- color: #333;
|
|
|
+ color: $facade-text-strong;
|
|
|
font-weight: 500;
|
|
|
}
|
|
|
.dd-prod-price {
|
|
|
font-size: 30rpx;
|
|
|
- color: #FF6B35;
|
|
|
+ color: $mind-accent;
|
|
|
font-weight: 600;
|
|
|
margin-top: 8rpx;
|
|
|
}
|
|
|
@@ -514,15 +514,15 @@ export default {
|
|
|
flex: 1;
|
|
|
height: 88rpx;
|
|
|
line-height: 88rpx;
|
|
|
- background: linear-gradient(135deg, #4A9BD7, #63B3ED);
|
|
|
- color: #fff;
|
|
|
+ background: linear-gradient(135deg, $brand-legacy-blue, $brand-legacy-blue-light);
|
|
|
+ color: $app-surface;
|
|
|
font-size: 32rpx;
|
|
|
border-radius: 44rpx;
|
|
|
text-align: center;
|
|
|
}
|
|
|
.dd-btn-outline {
|
|
|
- background: #fff;
|
|
|
- color: #4A9BD7;
|
|
|
- border: 2rpx solid #4A9BD7;
|
|
|
+ background: $app-surface;
|
|
|
+ color: $brand-legacy-blue;
|
|
|
+ border: 2rpx solid $brand-legacy-blue;
|
|
|
}
|
|
|
</style>
|