mirror of
https://github.com/mayswind/ezbookkeeping.git
synced 2026-05-14 06:57:35 +08:00
update transaction tag icon style
This commit is contained in:
@@ -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">
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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">
|
||||
|
||||
@@ -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 {
|
||||
|
||||
@@ -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 {
|
||||
|
||||
Reference in New Issue
Block a user