update transaction tag icon style

This commit is contained in:
MaysWind
2025-01-21 00:27:45 +08:00
parent 852c7899b5
commit 568abb6e03
14 changed files with 32 additions and 14 deletions
@@ -29,7 +29,7 @@
<template #title>
<f7-block class="no-padding no-margin">
<div class="display-flex">
<f7-icon f7="number"></f7-icon>
<f7-icon class="transaction-tag-icon" f7="number"></f7-icon>
<div class="tag-selection-list-item list-item-valign-middle padding-left-half">
{{ tag.name }}
</div>
@@ -44,7 +44,7 @@
</f7-list-item>
<f7-list-item checkbox indeterminate disabled v-if="allowAddNewTag && newTag">
<template #media>
<f7-icon f7="number"></f7-icon>
<f7-icon class="transaction-tag-icon" f7="number"></f7-icon>
</template>
<template #title>
<div class="display-flex">
+1
View File
@@ -77,6 +77,7 @@
--ebk-transaction-day-of-week-font-size: 12px;
--ebk-transaction-account-arrow-font-size: 12px;
--ebk-transaction-account-arrow-margin-top: -1px;
--ebk-transaction-tag-icon-font-size: 22px;
--ebk-transaction-tag-chip-font-size: 13px;
--ebk-transaction-tag-chip-media-size: 19px;
--ebk-transaction-tag-chip-height: 19px;
+1
View File
@@ -77,6 +77,7 @@
--ebk-transaction-day-of-week-font-size: 13px;
--ebk-transaction-account-arrow-font-size: 13px;
--ebk-transaction-account-arrow-margin-top: -2px;
--ebk-transaction-tag-icon-font-size: 24px;
--ebk-transaction-tag-chip-font-size: 13px;
--ebk-transaction-tag-chip-media-size: 20px;
--ebk-transaction-tag-chip-height: 20px;
+1
View File
@@ -77,6 +77,7 @@
--ebk-transaction-day-of-week-font-size: 12px;
--ebk-transaction-account-arrow-font-size: 12px;
--ebk-transaction-account-arrow-margin-top: -1px;
--ebk-transaction-tag-icon-font-size: 20px;
--ebk-transaction-tag-chip-font-size: 13px;
--ebk-transaction-tag-chip-media-size: 18px;
--ebk-transaction-tag-chip-height: 18px;
+1
View File
@@ -77,6 +77,7 @@
--ebk-transaction-day-of-week-font-size: 14px;
--ebk-transaction-account-arrow-font-size: 14px;
--ebk-transaction-account-arrow-margin-top: -2px;
--ebk-transaction-tag-icon-font-size: 26px;
--ebk-transaction-tag-chip-font-size: 14px;
--ebk-transaction-tag-chip-media-size: 22px;
--ebk-transaction-tag-chip-height: 22px;
+1
View File
@@ -77,6 +77,7 @@
--ebk-transaction-day-of-week-font-size: 15px;
--ebk-transaction-account-arrow-font-size: 15px;
--ebk-transaction-account-arrow-margin-top: -3px;
--ebk-transaction-tag-icon-font-size: 28px;
--ebk-transaction-tag-chip-font-size: 15px;
--ebk-transaction-tag-chip-media-size: 22px;
--ebk-transaction-tag-chip-height: 22px;
@@ -77,6 +77,7 @@
--ebk-transaction-day-of-week-font-size: 17px;
--ebk-transaction-account-arrow-font-size: 17px;
--ebk-transaction-account-arrow-margin-top: -4px;
--ebk-transaction-tag-icon-font-size: 30px;
--ebk-transaction-tag-chip-font-size: 16px;
--ebk-transaction-tag-chip-media-size: 24px;
--ebk-transaction-tag-chip-height: 24px;
@@ -77,6 +77,7 @@
--ebk-transaction-day-of-week-font-size: 19px;
--ebk-transaction-account-arrow-font-size: 19px;
--ebk-transaction-account-arrow-margin-top: -4px;
--ebk-transaction-tag-icon-font-size: 32px;
--ebk-transaction-tag-chip-font-size: 18px;
--ebk-transaction-tag-chip-media-size: 26px;
--ebk-transaction-tag-chip-height: 26px;
+5
View File
@@ -138,6 +138,11 @@ i.icon.la, i.icon.las, i.icon.lab {
font-size: var(--ebk-hide-icon-font-size);
}
.transaction-tag-icon {
font-size: var(--ebk-transaction-tag-icon-font-size);
align-self: center;
}
.login-page-logo {
width: 80px;
height: 80px;
@@ -64,7 +64,8 @@
</div>
<div class="item-footer">
<div class="transaction-tags">
<f7-chip media-bg-color="black" class="transaction-tag" :text="tt('Tag Title')">
<f7-chip media-text-color="var(--f7-chip-text-color)"
class="transaction-tag" :text="tt('Tag Title')">
<template #media>
<f7-icon f7="number"></f7-icon>
</template>
@@ -81,7 +81,7 @@
v-show="showHidden || !transactionTag.hidden"
@change="selectTransactionTag">
<template #media>
<f7-icon f7="number">
<f7-icon class="transaction-tag-icon" f7="number">
<f7-badge color="gray" class="right-bottom-icon" v-if="transactionTag.hidden">
<f7-icon f7="eye_slash_fill"></f7-icon>
</f7-badge>
+3 -3
View File
@@ -13,7 +13,7 @@
<f7-list strong inset dividers class="tag-item-list margin-top skeleton-text" v-if="loading">
<f7-list-item :key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]">
<template #media>
<f7-icon f7="number"></f7-icon>
<f7-icon class="transaction-tag-icon" f7="number"></f7-icon>
</template>
<template #title>
<div class="display-flex">
@@ -38,7 +38,7 @@
v-show="showHidden || !tag.hidden"
@taphold="setSortable()">
<template #media>
<f7-icon f7="number">
<f7-icon class="transaction-tag-icon" f7="number">
<f7-badge color="gray" class="right-bottom-icon" v-if="tag.hidden">
<f7-icon f7="eye_slash_fill"></f7-icon>
</f7-badge>
@@ -91,7 +91,7 @@
<f7-list-item v-if="newTag">
<template #media>
<f7-icon f7="number"></f7-icon>
<f7-icon class="transaction-tag-icon" f7="number"></f7-icon>
</template>
<template #title>
<div class="display-flex">
+8 -3
View File
@@ -320,7 +320,7 @@
<template #footer>
<f7-block class="margin-top-half no-padding no-margin" v-if="transaction.tagIds && transaction.tagIds.length">
<f7-chip media-bg-color="black" class="transaction-edit-tag"
<f7-chip media-text-color="var(--f7-chip-text-color)" class="transaction-edit-tag"
:text="getTagName(tagId)"
:key="tagId"
v-for="tagId in transaction.tagIds">
@@ -1431,8 +1431,13 @@ export default {
text-overflow: ellipsis;
}
.transaction-edit-tag > .chip-media {
opacity: 0.6;
.chip.transaction-edit-tag .chip-media+.chip-label {
margin-left: 0;
}
.chip.transaction-edit-tag .chip-media i.icon {
font-size: calc(var(--f7-chip-media-size) - 12px);
height: calc(var(--f7-chip-media-size) - 12px);
}
.transaction-pictures {
+4 -4
View File
@@ -212,7 +212,7 @@
</div>
<div class="item-footer">
<div class="transaction-tags" v-if="showTagInTransactionListPage && transaction.tagIds && transaction.tagIds.length">
<f7-chip media-bg-color="black" class="transaction-tag"
<f7-chip media-text-color="var(--f7-chip-text-color)" class="transaction-tag"
:text="allTransactionTags[tagId].name"
:key="tagId"
v-for="tagId in transaction.tagIds">
@@ -495,7 +495,7 @@
@click="changeTagFilter(transactionTag.id)"
>
<template #before-title>
<f7-icon f7="number" class="transaction-tag-name"></f7-icon>
<f7-icon class="transaction-tag-name transaction-tag-icon" f7="number"></f7-icon>
</template>
<template #after>
<f7-icon class="list-item-checked-icon"
@@ -1283,8 +1283,8 @@ export default {
text-overflow: ellipsis;
}
.list.transaction-info-list li.transaction-info .chip.transaction-tag > .chip-media {
opacity: 0.6;
.list.transaction-info-list li.transaction-info .chip.transaction-tag .chip-media+.chip-label {
margin-left: 0;
}
.list.transaction-info-list li.transaction-info .transaction-footer {