| 1 |
- .container{background-color:#f5f7fa;min-height:100vh;display:flex;flex-direction:column}.nav-bar{background-color:#fff;padding-top:var(--status-bar-height);padding-left:.9375rem;padding-right:.9375rem;height:2.75rem;box-sizing:content-box;display:flex;justify-content:space-between;align-items:center;position:-webkit-sticky;position:sticky;top:0;z-index:100}.nav-left{height:100%;display:flex;align-items:center;width:1.875rem}.back-icon{width:1.25rem;height:1.25rem;transform:rotate(180deg)}.nav-title{font-size:.875rem;font-weight:700;color:#333}.nav-right{width:1.875rem}.content-area{flex:1;display:flex;flex-direction:column}.tabs-row{background-color:#fff;display:flex;justify-content:space-around;padding-top:.625rem;padding-bottom:.0625rem;margin-bottom:.625rem}.tab-item{padding-bottom:.5rem;font-size:.875rem;color:#666;position:relative;display:flex;flex-direction:column;align-items:center;min-width:3.125rem}.tab-item.active{font-weight:700;color:#ff9800}.tab-line{width:1.25rem;height:.125rem;background-color:#ff9800;border-radius:.125rem;position:absolute;bottom:0}.bill-list{flex:1;padding:0 .625rem;box-sizing:border-box}.month-group{background-color:#fff;border-radius:.5rem;padding:0 .625rem;margin-bottom:.625rem;box-shadow:0 .0625rem .1875rem rgba(0,0,0,.02)}.group-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem .3125rem;border-bottom:.03125rem solid #f9f9f9}.month-title{font-size:.9375rem;font-weight:700;color:#333}.month-summary{font-size:.75rem;color:#999}.list-item{display:flex;align-items:center;padding:.9375rem .3125rem;border-bottom:.03125rem solid #f9f9f9}.list-item:last-child{border-bottom:none}.item-icon-box{width:2.5rem;height:2.5rem;border-radius:50%;display:flex;justify-content:center;align-items:center;margin-right:.625rem;flex-shrink:0}.item-icon-box.income{background-color:#fff8e1}.item-icon-box.expense{background-color:#f5f5f5}.item-icon-symbol{font-size:1.25rem;font-weight:300;line-height:1;margin-top:-.125rem}.item-icon-box.income .item-icon-symbol{color:#ff9800}.item-icon-box.expense .item-icon-symbol{color:#333}.item-center{flex:1;display:flex;flex-direction:column;justify-content:space-around;height:2.5rem}.item-title{font-size:.875rem;font-weight:500;color:#333}.item-desc{font-size:.6875rem;color:#999;margin-top:.25rem}.item-right{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-around;height:2.5rem;margin-left:.3125rem}.item-amount{font-size:.9375rem;font-weight:700}.item-amount.income{color:#ff9800}.item-amount.expense{color:#333}.item-tag{display:inline-flex;justify-content:flex-end;margin-top:.1875rem}.item-tag uni-text{background-color:#fff;border:.03125rem solid #eee;padding:.0625rem .25rem;border-radius:.1875rem;font-size:.625rem;color:#999}.list-padding-bottom{height:1.25rem}
|
