色彩调整
All checks were successful
Docker Build & Deploy / Build Docker Image (push) Successful in 24s
Docker Build & Deploy / Deploy to Production (push) Successful in 10s
Docker Build & Deploy / Cleanup Dangling Images (push) Successful in 1s
Docker Build & Deploy / WeChat Notification (push) Successful in 1s
All checks were successful
Docker Build & Deploy / Build Docker Image (push) Successful in 24s
Docker Build & Deploy / Deploy to Production (push) Successful in 10s
Docker Build & Deploy / Cleanup Dangling Images (push) Successful in 1s
Docker Build & Deploy / WeChat Notification (push) Successful in 1s
This commit is contained in:
@@ -47,7 +47,7 @@
|
||||
<!-- 分类 -->
|
||||
<van-field name="category" label="分类">
|
||||
<template #input>
|
||||
<span v-if="!categoryName" style="color: #c8c9cc;">请选择分类</span>
|
||||
<span v-if="!categoryName" style="color: var(--van-text-color-3);">请选择分类</span>
|
||||
<span v-else>{{ categoryName }}</span>
|
||||
</template>
|
||||
</van-field>
|
||||
|
||||
@@ -121,6 +121,6 @@ const handleSave = async (payload) => {
|
||||
margin-bottom: 16px;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
border: 1px solid #ebedf0;
|
||||
border: 1px solid var(--van-border-color);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -120,7 +120,7 @@
|
||||
<van-progress
|
||||
:percentage="timePercentage"
|
||||
stroke-width="4"
|
||||
color="#969799"
|
||||
color="var(--van-gray-6)"
|
||||
:show-pivot="false"
|
||||
/>
|
||||
<span class="percent">{{ timePercentage }}%</span>
|
||||
@@ -168,7 +168,7 @@ const props = defineProps({
|
||||
},
|
||||
progressColor: {
|
||||
type: String,
|
||||
default: '#1989fa'
|
||||
default: 'var(--van-primary-color)'
|
||||
},
|
||||
percentClass: {
|
||||
type: [String, Object],
|
||||
@@ -332,7 +332,7 @@ const timePercentage = computed(() => {
|
||||
|
||||
.compact-label {
|
||||
font-size: 12px;
|
||||
color: #969799;
|
||||
color: var(--van-text-color-2);
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
@@ -346,22 +346,22 @@ const timePercentage = computed(() => {
|
||||
}
|
||||
|
||||
.compact-value.warning {
|
||||
color: #ff976a;
|
||||
color: var(--van-warning-color);
|
||||
}
|
||||
|
||||
.compact-value.income {
|
||||
color: #07c160;
|
||||
color: var(--van-success-color);
|
||||
}
|
||||
|
||||
.expand-icon {
|
||||
color: #1989fa;
|
||||
color: var(--van-primary-color);
|
||||
font-size: 14px;
|
||||
transition: transform 0.3s ease;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.collapse-icon {
|
||||
color: #1989fa;
|
||||
color: var(--van-primary-color);
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -386,7 +386,7 @@ const timePercentage = computed(() => {
|
||||
|
||||
.card-subtitle {
|
||||
font-size: 12px;
|
||||
color: #969799;
|
||||
color: var(--van-text-color-2);
|
||||
font-weight: normal;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
@@ -420,7 +420,7 @@ const timePercentage = computed(() => {
|
||||
|
||||
:deep(.info-item) .label {
|
||||
font-size: 12px;
|
||||
color: #969799;
|
||||
color: var(--van-text-color-2);
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
@@ -430,11 +430,11 @@ const timePercentage = computed(() => {
|
||||
}
|
||||
|
||||
:deep(.value.expense) {
|
||||
color: #ee0a24;
|
||||
color: var(--van-danger-color);
|
||||
}
|
||||
|
||||
:deep(.value.income) {
|
||||
color: #07c160;
|
||||
color: var(--van-success-color);
|
||||
}
|
||||
|
||||
.progress-section {
|
||||
@@ -443,7 +443,7 @@ const timePercentage = computed(() => {
|
||||
gap: 12px;
|
||||
margin-bottom: 12px;
|
||||
font-size: 13px;
|
||||
color: #646566;
|
||||
color: var(--van-gray-6);
|
||||
}
|
||||
|
||||
.progress-section :deep(.van-progress) {
|
||||
@@ -462,12 +462,12 @@ const timePercentage = computed(() => {
|
||||
}
|
||||
|
||||
.percent.warning {
|
||||
color: #ff976a;
|
||||
color: var(--van-warning-color);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.percent.income {
|
||||
color: #07c160;
|
||||
color: var(--van-success-color);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@@ -483,26 +483,26 @@ const timePercentage = computed(() => {
|
||||
|
||||
.budget-description {
|
||||
margin-top: 8px;
|
||||
background-color: #f7f8fa;
|
||||
background-color: var(--van-background);
|
||||
border-radius: 4px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.description-content {
|
||||
font-size: 11px;
|
||||
color: #646566;
|
||||
color: var(--van-gray-6);
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
/* @media (prefers-color-scheme: dark) {
|
||||
.budget-description {
|
||||
background-color: #2c2c2c;
|
||||
background-color: var(--van-background-2);
|
||||
}
|
||||
.description-content {
|
||||
color: #969799;
|
||||
color: var(--van-text-color-2);
|
||||
}
|
||||
.collapsed-row .value {
|
||||
color: #f5f5f5;
|
||||
color: var(--van-text-color);
|
||||
}
|
||||
}
|
||||
} */
|
||||
</style>
|
||||
|
||||
@@ -40,7 +40,7 @@
|
||||
</van-field>
|
||||
<van-field label="相关分类">
|
||||
<template #input>
|
||||
<div v-if="form.selectedCategories.length === 0" style="color: #c8c9cc;">可多选分类</div>
|
||||
<div v-if="form.selectedCategories.length === 0" style="color: var(--van-text-color-3);">可多选分类</div>
|
||||
<div v-else class="selected-categories">
|
||||
<span class="ellipsis-text">
|
||||
{{ form.selectedCategories.join('、') }}
|
||||
@@ -176,7 +176,7 @@ const getCategoryName = (category) => {
|
||||
|
||||
.ellipsis-text {
|
||||
font-size: 14px;
|
||||
color: #323233;
|
||||
color: var(--van-text-color);
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@@ -185,7 +185,7 @@ const getCategoryName = (category) => {
|
||||
|
||||
.no-data {
|
||||
font-size: 13px;
|
||||
color: #969799;
|
||||
color: var(--van-text-color-2);
|
||||
padding: 8px 16px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -130,7 +130,7 @@ const formatMoney = (val) => {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 18px;
|
||||
color: #c8c9cc;
|
||||
color: var(--van-gray-5);
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
z-index: 1;
|
||||
@@ -150,7 +150,7 @@ const formatMoney = (val) => {
|
||||
}
|
||||
|
||||
.nav-arrow.disabled {
|
||||
color: #f2f3f5;
|
||||
color: var(--van-gray-3);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
@@ -200,26 +200,26 @@ const formatMoney = (val) => {
|
||||
|
||||
.summary-item .label {
|
||||
font-size: 12px;
|
||||
color: #969799;
|
||||
color: var(--van-text-color-2);
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.summary-item .value {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #323233;
|
||||
color: var(--van-text-color);
|
||||
}
|
||||
|
||||
.summary-item :deep(.value.expense) {
|
||||
color: #ee0a24;
|
||||
color: var(--van-danger-color);
|
||||
}
|
||||
|
||||
.summary-item :deep(.value.income) {
|
||||
color: #07c160;
|
||||
color: var(--van-success-color);
|
||||
}
|
||||
|
||||
.summary-item :deep(.value.warning) {
|
||||
color: #ff976a;
|
||||
color: var(--van-warning-color);
|
||||
}
|
||||
|
||||
.summary-item .unit {
|
||||
@@ -230,7 +230,7 @@ const formatMoney = (val) => {
|
||||
|
||||
.summary-item .sub-info {
|
||||
font-size: 12px;
|
||||
color: #c8c9cc;
|
||||
color: var(--van-text-color-3);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@@ -238,35 +238,35 @@ const formatMoney = (val) => {
|
||||
}
|
||||
|
||||
.summary-item .amount {
|
||||
color: #646566;
|
||||
color: var(--van-text-color-2);
|
||||
}
|
||||
|
||||
.summary-item .separator {
|
||||
color: #c8c9cc;
|
||||
color: var(--van-text-color-3);
|
||||
}
|
||||
|
||||
.divider {
|
||||
width: 1px;
|
||||
height: 24px;
|
||||
background-color: #ebedf0;
|
||||
background-color: var(--van-border-color);
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
/* @media (prefers-color-scheme: dark) {
|
||||
.nav-arrow:active {
|
||||
background-color: rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
.nav-arrow.disabled {
|
||||
color: #323233;
|
||||
color: var(--van-text-color);
|
||||
}
|
||||
.summary-item .value {
|
||||
color: #f5f5f5;
|
||||
color: var(--van-text-color);
|
||||
}
|
||||
.summary-item .amount {
|
||||
color: #c8c9cc;
|
||||
color: var(--van-text-color-3);
|
||||
}
|
||||
.divider {
|
||||
background-color: #2c2c2c;
|
||||
background-color: var(--van-border-color);
|
||||
}
|
||||
}
|
||||
} */
|
||||
</style>
|
||||
|
||||
@@ -91,7 +91,7 @@ const onSubmit = async () => {
|
||||
|
||||
.subtitle {
|
||||
font-size: 14px;
|
||||
color: #969799;
|
||||
color: var(--van-text-color-2);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -103,7 +103,7 @@ const onSubmit = async () => {
|
||||
|
||||
.no-data {
|
||||
text-align: center;
|
||||
color: #969799;
|
||||
color: var(--van-text-color-2);
|
||||
width: 100%;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
@@ -79,6 +79,6 @@ const handleSuccess = () => {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
background-color: #fff;
|
||||
background-color: var(--van-background-2);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -91,8 +91,8 @@ const hasActions = computed(() => !!slots['header-actions'])
|
||||
.popup-header-fixed {
|
||||
flex-shrink: 0;
|
||||
padding: 16px;
|
||||
background-color: var(--van-background-2, #f7f8fa);
|
||||
border-bottom: 1px solid var(--van-border-color, #ebedf0);
|
||||
background-color: var(--van-background-2);
|
||||
border-bottom: 1px solid var(--van-border-color);
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
@@ -121,7 +121,7 @@ const hasActions = computed(() => !!slots['header-actions'])
|
||||
font-weight: 500;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
color: var(--van-text-color, #323233);
|
||||
color: var(--van-text-color);
|
||||
/*超出长度*/
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@@ -139,7 +139,7 @@ const hasActions = computed(() => !!slots['header-actions'])
|
||||
.stats-text {
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
color: var(--van-text-color-2, #646566);
|
||||
color: var(--van-text-color-2);
|
||||
grid-column: 2;
|
||||
text-align: center;
|
||||
}
|
||||
@@ -159,8 +159,8 @@ const hasActions = computed(() => !!slots['header-actions'])
|
||||
|
||||
.popup-footer-fixed {
|
||||
flex-shrink: 0;
|
||||
border-top: 1px solid var(--van-border-color, #ebedf0);
|
||||
background-color: var(--van-background-2, #f7f8fa);
|
||||
border-top: 1px solid var(--van-border-color);
|
||||
background-color: var(--van-background-2);
|
||||
padding: 12px 16px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -627,13 +627,13 @@ defineExpose({
|
||||
|
||||
.count-text {
|
||||
font-size: 13px;
|
||||
color: #969799;
|
||||
color: var(--van-text-color-2);
|
||||
}
|
||||
|
||||
.amount-text {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #ff976a;
|
||||
color: var(--van-orange);
|
||||
}
|
||||
|
||||
:deep(.van-cell-group--inset) {
|
||||
|
||||
@@ -80,7 +80,7 @@
|
||||
</span>
|
||||
<div class="suggestion-apply">应用</div>
|
||||
</div>
|
||||
<span v-else-if="!editForm.classify" style="color: #c8c9cc;">请选择交易分类</span>
|
||||
<span v-else-if="!editForm.classify" style="color: var(--van-gray-5);">请选择交易分类</span>
|
||||
<span v-else>{{ editForm.classify }}</span>
|
||||
</div>
|
||||
</template>
|
||||
@@ -377,17 +377,18 @@ const handleCandidateSelect = (candidate) => {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 6px 10px;
|
||||
background: #ecf9ff;
|
||||
color: #1989fa;
|
||||
background: var(--van-active-color);
|
||||
color: var(--van-primary-color);
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
transition: opacity 0.2s;
|
||||
border: 1px solid rgba(25, 137, 250, 0.1);
|
||||
border: 1px solid var(--van-primary-color);
|
||||
width: fit-content;
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
.suggestion-tip:active {
|
||||
opacity: 0.7;
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
.suggestion-icon {
|
||||
@@ -402,23 +403,12 @@ const handleCandidateSelect = (candidate) => {
|
||||
.suggestion-apply {
|
||||
margin-left: 8px;
|
||||
padding: 0 6px;
|
||||
background: #1989fa;
|
||||
color: #fff;
|
||||
background: var(--van-primary-color);
|
||||
color: var(--van-white);
|
||||
border-radius: 4px;
|
||||
font-size: 10px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.suggestion-tip {
|
||||
background: rgba(25, 137, 250, 0.15);
|
||||
border-color: rgba(25, 137, 250, 0.2);
|
||||
color: #58a6ff;
|
||||
}
|
||||
.suggestion-apply {
|
||||
background: #58a6ff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -33,7 +33,7 @@
|
||||
<span v-if="transaction.classify">
|
||||
分类: {{ transaction.classify }}
|
||||
</span>
|
||||
<span v-if="transaction.upsetedClassify && transaction.upsetedClassify !== transaction.classify" style="color: #ff976a">
|
||||
<span v-if="transaction.upsetedClassify && transaction.upsetedClassify !== transaction.classify" style="color: var(--van-warning-color)">
|
||||
→ {{ transaction.upsetedClassify }}
|
||||
</span>
|
||||
|
||||
@@ -74,7 +74,7 @@
|
||||
退款: {{ formatMoney(transaction.refundAmount) }}
|
||||
</div>
|
||||
</div>
|
||||
<van-icon name="arrow" size="16" color="#c8c9cc" />
|
||||
<van-icon name="arrow" size="16" color="var(--van-gray-5)" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -315,12 +315,12 @@ const formatDate = (dateString) => {
|
||||
|
||||
.transaction-info {
|
||||
font-size: 12px;
|
||||
color: #969799;
|
||||
color: var(--van-text-color-2);
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.original-info {
|
||||
color: #ff976a;
|
||||
color: var(--van-orange);
|
||||
font-style: italic;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -343,16 +343,16 @@ const formatDate = (dateString) => {
|
||||
}
|
||||
|
||||
.amount.expense {
|
||||
color: #ee0a24;
|
||||
color: var(--van-danger-color);
|
||||
}
|
||||
|
||||
.amount.income {
|
||||
color: #07c160;
|
||||
color: var(--van-success-color);
|
||||
}
|
||||
|
||||
.balance {
|
||||
font-size: 12px;
|
||||
color: #969799;
|
||||
color: var(--van-text-color-2);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user