.container { padding: 0 14rpx; .message { padding: 14rpx 0; text-align: center; font-size: 24rpx; color: #FE9221; background: #FFFAEA; } .total { margin: 12rpx 0 0; background: #FFFFFF; border-radius: 20rpx; .box { padding: 27rpx 31rpx; display: flex; align-items: center; justify-content: space-between; font-size: 30rpx; } } .historyList { position: fixed; top: 0; left: 0; height: 100vh; padding: 250rpx 14rpx 0rpx; padding-bottom: calc(136rpx + env(safe-area-inset-bottom)) !important; box-sizing: border-box; z-index: -1; .user { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20rpx; padding: 20rpx 28rpx; background: #FFFFFF; border-radius: 20rpx; .avatar { width: 64rpx; height: 64rpx; background: #D8D8D8; border-radius: 50%; border: 1rpx solid #979797; } .info { flex: 1; margin-left: 30rpx; .nickName { margin-bottom: 6rpx; font-size: 30rpx; } .addTime { font-size: 26rpx; color: #7B7B7B; } } } } } .bottom { position: absolute; width: 100%; padding: 26rpx 0; bottom: 0; left: 0; background-color: white; .btn { margin: 0 auto; margin-bottom: env(safe-area-inset-bottom) !important; width: 466rpx; padding: 14rpx 0; background: linear-gradient(180deg, #6EC8FF 0%, #31BDFE 100%); border-radius: 39rpx; color: white; } } .empty { margin-top: 190rpx; .nullImg { transform: scale(0.8); } }