.hc-ledger-table-form { .hc-page-bar { position: relative; display: flex; align-items: center; justify-content: flex-end; .icon { font-size: 36rpx; margin-right: 6rpx; } .text { font-size: 26rpx; } } .title-bar { position: absolute; display: flex; width: 100%; padding: 15rpx; background: #E8EEF2; overflow-x: auto; white-space: nowrap; .title-bar-btn { flex: 1; color: #6FCC9F; background-color: #EBF9F4; height: 58rpx; font-size: 25rpx; padding: 0; margin: 0; line-height: initial; border-radius: 6rpx; display: flex; justify-content: center; align-items: center; &:after { display: none; } } .title-bar-btn + .title-bar-btn { margin-left: 16rpx; } } .action-bar { position: absolute; bottom: 0; width: 100%; background: white; padding: 22rpx 28rpx calc(var(--window-bottom) + 30rpx); .text-bar { position: relative; display: flex; align-items: center; color: #be98fa; text-decoration: underline; font-size: 26rpx; margin-bottom: 40rpx; .left { position: relative; text-align: center; flex: 1; } .right { position: relative; text-align: center; flex: 1; } } .cu-btn { width: 100%; color: white; } .cu-btn.c1 { background-color: #778e53; border: 1px solid #617f33; } .cu-btn.c2 { background-color: #828282; border: 1px solid #5d5d5d; } .cu-btn.c3 { background-color: #e99d42; border: 1px solid #ad7030; } .cu-btn.c4 { background-color: #72a6d7; border: 1px solid #2856ee; } } }