|
@@ -182,16 +182,16 @@ export default {
|
|
|
}
|
|
}
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
-<style scoped>
|
|
|
|
|
|
|
+<style scoped lang="scss">
|
|
|
.toolbox-container {
|
|
.toolbox-container {
|
|
|
min-height: 100vh;
|
|
min-height: 100vh;
|
|
|
- background: linear-gradient(180deg, #F0FDF4 0%, #FFFFFF 50%, #FFF7ED 100%);
|
|
|
|
|
|
|
+ background: linear-gradient(180deg, $status-success-tint-2 0%, $app-surface 50%, $facade-brand-tint 100%);
|
|
|
padding-bottom: 40rpx;
|
|
padding-bottom: 40rpx;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.tool-section {
|
|
.tool-section {
|
|
|
margin: 24rpx 32rpx;
|
|
margin: 24rpx 32rpx;
|
|
|
- background: #fff;
|
|
|
|
|
|
|
+ background: $app-surface;
|
|
|
border-radius: 20rpx;
|
|
border-radius: 20rpx;
|
|
|
padding: 28rpx;
|
|
padding: 28rpx;
|
|
|
box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.04);
|
|
box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.04);
|
|
@@ -211,12 +211,12 @@ export default {
|
|
|
.section-title {
|
|
.section-title {
|
|
|
font-size: 30rpx;
|
|
font-size: 30rpx;
|
|
|
font-weight: 600;
|
|
font-weight: 600;
|
|
|
- color: #333;
|
|
|
|
|
|
|
+ color: $facade-text-strong;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.section-desc {
|
|
.section-desc {
|
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
|
- color: #999;
|
|
|
|
|
|
|
+ color: $facade-text-muted;
|
|
|
display: block;
|
|
display: block;
|
|
|
margin-bottom: 20rpx;
|
|
margin-bottom: 20rpx;
|
|
|
}
|
|
}
|
|
@@ -233,11 +233,11 @@ export default {
|
|
|
width: 280rpx;
|
|
width: 280rpx;
|
|
|
height: 280rpx;
|
|
height: 280rpx;
|
|
|
border-radius: 50%;
|
|
border-radius: 50%;
|
|
|
- background: linear-gradient(135deg, #A7F3D0, #6EE7B7);
|
|
|
|
|
|
|
+ background: linear-gradient(135deg, $status-success-light, $status-success-light-2);
|
|
|
display: flex;
|
|
display: flex;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
justify-content: center;
|
|
|
- transition: all 0.3s;
|
|
|
|
|
|
|
+ transition: background 0.3s ease;
|
|
|
box-shadow: 0 8rpx 40rpx rgba(16, 185, 129, 0.2);
|
|
box-shadow: 0 8rpx 40rpx rgba(16, 185, 129, 0.2);
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -246,7 +246,7 @@ export default {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.breath-circle.hold {
|
|
.breath-circle.hold {
|
|
|
- background: linear-gradient(135deg, #FDE68A, #F59E0B);
|
|
|
|
|
|
|
+ background: linear-gradient(135deg, $status-warning-light, $dim-wealth);
|
|
|
box-shadow: 0 8rpx 40rpx rgba(245, 158, 11, 0.3);
|
|
box-shadow: 0 8rpx 40rpx rgba(245, 158, 11, 0.3);
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -257,21 +257,21 @@ export default {
|
|
|
.breath-text {
|
|
.breath-text {
|
|
|
font-size: 36rpx;
|
|
font-size: 36rpx;
|
|
|
font-weight: 600;
|
|
font-weight: 600;
|
|
|
- color: #fff;
|
|
|
|
|
|
|
+ color: $app-surface;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.breath-hint {
|
|
.breath-hint {
|
|
|
display: block;
|
|
display: block;
|
|
|
text-align: center;
|
|
text-align: center;
|
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
|
- color: #999;
|
|
|
|
|
|
|
+ color: $facade-text-muted;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.breath-count {
|
|
.breath-count {
|
|
|
display: block;
|
|
display: block;
|
|
|
text-align: center;
|
|
text-align: center;
|
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
|
- color: #10B981;
|
|
|
|
|
|
|
+ color: $status-success;
|
|
|
margin-top: 8rpx;
|
|
margin-top: 8rpx;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -284,26 +284,26 @@ export default {
|
|
|
|
|
|
|
|
.mind-card {
|
|
.mind-card {
|
|
|
padding: 20rpx;
|
|
padding: 20rpx;
|
|
|
- background: #F9F9F9;
|
|
|
|
|
|
|
+ background: $facade-fill-ghost-2;
|
|
|
border-radius: 12rpx;
|
|
border-radius: 12rpx;
|
|
|
border: 2rpx solid transparent;
|
|
border: 2rpx solid transparent;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.mind-card-active {
|
|
.mind-card-active {
|
|
|
- background: #F0FDF4;
|
|
|
|
|
- border-color: #10B981;
|
|
|
|
|
|
|
+ background: $status-success-tint-2;
|
|
|
|
|
+ border-color: $status-success;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.mind-card-title {
|
|
.mind-card-title {
|
|
|
font-size: 26rpx;
|
|
font-size: 26rpx;
|
|
|
font-weight: 600;
|
|
font-weight: 600;
|
|
|
- color: #333;
|
|
|
|
|
|
|
+ color: $facade-text-strong;
|
|
|
display: block;
|
|
display: block;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.mind-card-desc {
|
|
.mind-card-desc {
|
|
|
font-size: 22rpx;
|
|
font-size: 22rpx;
|
|
|
- color: #999;
|
|
|
|
|
|
|
+ color: $facade-text-muted;
|
|
|
display: block;
|
|
display: block;
|
|
|
margin-top: 4rpx;
|
|
margin-top: 4rpx;
|
|
|
}
|
|
}
|
|
@@ -311,14 +311,14 @@ export default {
|
|
|
.mindfulness-content {
|
|
.mindfulness-content {
|
|
|
margin-top: 16rpx;
|
|
margin-top: 16rpx;
|
|
|
padding: 20rpx;
|
|
padding: 20rpx;
|
|
|
- background: #F0FDF4;
|
|
|
|
|
|
|
+ background: $status-success-tint-2;
|
|
|
border-radius: 12rpx;
|
|
border-radius: 12rpx;
|
|
|
- border-left: 6rpx solid #10B981;
|
|
|
|
|
|
|
+ border-left: 6rpx solid $status-success;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.mindfulness-text {
|
|
.mindfulness-text {
|
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
|
- color: #555;
|
|
|
|
|
|
|
+ color: $facade-text-deep;
|
|
|
line-height: 1.8;
|
|
line-height: 1.8;
|
|
|
white-space: pre-wrap;
|
|
white-space: pre-wrap;
|
|
|
}
|
|
}
|
|
@@ -336,7 +336,7 @@ export default {
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
gap: 12rpx;
|
|
gap: 12rpx;
|
|
|
padding: 20rpx;
|
|
padding: 20rpx;
|
|
|
- background: #FFFBEB;
|
|
|
|
|
|
|
+ background: $dim-wealth-tint;
|
|
|
border-radius: 12rpx;
|
|
border-radius: 12rpx;
|
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
|
}
|
|
}
|
|
@@ -347,7 +347,7 @@ export default {
|
|
|
|
|
|
|
|
.doodle-text {
|
|
.doodle-text {
|
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
|
- color: #666;
|
|
|
|
|
|
|
+ color: $facade-text-body;
|
|
|
flex: 1;
|
|
flex: 1;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -360,22 +360,22 @@ export default {
|
|
|
|
|
|
|
|
.exercise-item {
|
|
.exercise-item {
|
|
|
padding: 20rpx;
|
|
padding: 20rpx;
|
|
|
- background: #F0F9FF;
|
|
|
|
|
|
|
+ background: $tint-sky-soft;
|
|
|
border-radius: 12rpx;
|
|
border-radius: 12rpx;
|
|
|
- border-left: 6rpx solid #3B82F6;
|
|
|
|
|
|
|
+ border-left: 6rpx solid $status-info;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.exercise-name {
|
|
.exercise-name {
|
|
|
font-size: 26rpx;
|
|
font-size: 26rpx;
|
|
|
font-weight: 600;
|
|
font-weight: 600;
|
|
|
- color: #2563EB;
|
|
|
|
|
|
|
+ color: $status-info-deep;
|
|
|
display: block;
|
|
display: block;
|
|
|
margin-bottom: 6rpx;
|
|
margin-bottom: 6rpx;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.exercise-desc {
|
|
.exercise-desc {
|
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
|
- color: #666;
|
|
|
|
|
|
|
+ color: $facade-text-body;
|
|
|
line-height: 1.6;
|
|
line-height: 1.6;
|
|
|
display: block;
|
|
display: block;
|
|
|
}
|
|
}
|
|
@@ -384,13 +384,13 @@ export default {
|
|
|
.disclaimer {
|
|
.disclaimer {
|
|
|
margin: 32rpx;
|
|
margin: 32rpx;
|
|
|
padding: 20rpx;
|
|
padding: 20rpx;
|
|
|
- background: #FEF3C7;
|
|
|
|
|
|
|
+ background: $status-warning-soft;
|
|
|
border-radius: 12rpx;
|
|
border-radius: 12rpx;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.disclaimer-text {
|
|
.disclaimer-text {
|
|
|
font-size: 22rpx;
|
|
font-size: 22rpx;
|
|
|
- color: #92400E;
|
|
|
|
|
|
|
+ color: $status-warning-strong;
|
|
|
line-height: 1.6;
|
|
line-height: 1.6;
|
|
|
}
|
|
}
|
|
|
</style>
|
|
</style>
|