mirror of
https://github.com/mayswind/ezbookkeeping.git
synced 2026-05-19 01:04:25 +08:00
code refactor
This commit is contained in:
MaysWind
+100
-85
@@ -97,6 +97,7 @@ export default {
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/** Global style **/
|
||||
html, body {
|
||||
position: fixed;
|
||||
}
|
||||
@@ -108,6 +109,24 @@ body {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
/** Common class **/
|
||||
.no-right-border {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
.no-bottom-border {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.work-break-all {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.full-line {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/** Replacing the default style of framework7 **/
|
||||
:root {
|
||||
--f7-theme-color: #c67e48;
|
||||
--f7-theme-color-rgb: 198, 126, 72;
|
||||
@@ -121,14 +140,6 @@ body {
|
||||
--default-icon-color: var(--f7-text-color);
|
||||
}
|
||||
|
||||
.no-right-border {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
.no-bottom-border {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
i.icon.la, i.icon.las, i.icon.lab {
|
||||
font-size: 28px;
|
||||
}
|
||||
@@ -137,45 +148,11 @@ i.icon.la, i.icon.las, i.icon.lab {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/** Common class for replacing the default style of framework7 **/
|
||||
.navbar .navbar-compact-icons.right a + a {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.vue-pincode-input {
|
||||
margin: 3px !important;
|
||||
padding: 5px !important;
|
||||
box-shadow: 0 0 2px rgba(0,0,0,.5) !important;
|
||||
}
|
||||
|
||||
.theme-dark .vue-pincode-input {
|
||||
box-shadow: 0 0 2px rgba(255,255,255,.5) !important;
|
||||
}
|
||||
|
||||
.work-break-all {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.full-line {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.icon-after-text {
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.badge.right-bottom-icon {
|
||||
margin-left: -12px;
|
||||
margin-top: 14px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.badge.right-bottom-icon > .icon {
|
||||
font-size: 13px;
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
}
|
||||
|
||||
.toolbar-item-auto-size .toolbar-inner {
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
@@ -185,6 +162,10 @@ i.icon.la, i.icon.las, i.icon.lab {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.tabbar-item-changed {
|
||||
color: var(--f7-theme-color);
|
||||
}
|
||||
|
||||
.tabbar-text-with-ellipsis > span {
|
||||
display: block;
|
||||
width: 100%;
|
||||
@@ -195,48 +176,6 @@ i.icon.la, i.icon.las, i.icon.lab {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.tabbar-item-changed {
|
||||
color: var(--f7-theme-color);
|
||||
}
|
||||
|
||||
.card-header-content {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.card-chevron-icon {
|
||||
color: var(--f7-list-chevron-icon-color);
|
||||
font-size: var(--f7-list-chevron-icon-font-size);
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
.nested-list-item .item-title {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.nested-list-item .item-inner {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.nested-list-item.has-child-list-item .nested-list-item-child .item-inner {
|
||||
padding-bottom: var(--f7-list-item-padding-vertical);
|
||||
}
|
||||
|
||||
.nested-list-item .nested-list-item-title {
|
||||
align-self: center;
|
||||
margin-left: var(--f7-list-item-media-margin);
|
||||
margin-right: var(--f7-list-item-media-margin);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.sortable-enabled .nested-list-item .nested-list-item-child .item-inner {
|
||||
padding-right: var(--f7-safe-area-right) !important;
|
||||
}
|
||||
|
||||
.no-sortable > .sortable-handler {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.list-item-media-valign-middle .item-media {
|
||||
align-self: normal !important;
|
||||
}
|
||||
@@ -245,6 +184,15 @@ i.icon.la, i.icon.las, i.icon.lab {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.list-item-with-header-and-title .item-content .item-header {
|
||||
margin-bottom: 11px;
|
||||
}
|
||||
|
||||
.list-item-with-header-and-title.list-item-title-hide-overflow .item-content .list-item-custom-title {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.list .item-content .input.list-title-input {
|
||||
margin-top: calc(-1 * var(--f7-list-item-padding-vertical));
|
||||
margin-bottom: calc(-1 * var(--f7-list-item-padding-vertical));
|
||||
@@ -276,4 +224,71 @@ i.icon.la, i.icon.las, i.icon.lab {
|
||||
.ebk-list-item-error-info div.item-footer {
|
||||
color: var(--f7-input-error-text-color)
|
||||
}
|
||||
|
||||
.no-sortable > .sortable-handler {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.card-header-content {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.card-chevron-icon {
|
||||
color: var(--f7-list-chevron-icon-color);
|
||||
font-size: var(--f7-list-chevron-icon-font-size);
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
.icon-after-text {
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.badge.right-bottom-icon {
|
||||
margin-left: -12px;
|
||||
margin-top: 14px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.badge.right-bottom-icon > .icon {
|
||||
font-size: 13px;
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
}
|
||||
|
||||
/** Nested List item for framework7 **/
|
||||
.nested-list-item .item-title {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.nested-list-item .item-inner {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.nested-list-item.has-child-list-item .nested-list-item-child .item-inner {
|
||||
padding-bottom: var(--f7-list-item-padding-vertical);
|
||||
}
|
||||
|
||||
.nested-list-item .nested-list-item-title {
|
||||
align-self: center;
|
||||
margin-left: var(--f7-list-item-media-margin);
|
||||
margin-right: var(--f7-list-item-media-margin);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.sortable-enabled .nested-list-item .nested-list-item-child .item-inner {
|
||||
padding-right: var(--f7-safe-area-right) !important;
|
||||
}
|
||||
|
||||
/** Replacing the default style of Vue-pincode-input **/
|
||||
.vue-pincode-input {
|
||||
margin: 3px !important;
|
||||
padding: 5px !important;
|
||||
box-shadow: 0 0 2px rgba(0,0,0,.5) !important;
|
||||
}
|
||||
|
||||
.theme-dark .vue-pincode-input {
|
||||
box-shadow: 0 0 2px rgba(255,255,255,.5) !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user