/* packageI/parkCouponFree/components/car-number-keyboard/car-number-keyboard.wxss */ .custom-keyboard { display: flex; flex-direction: column; border-top: 1rpx solid #e6e6e6; /* position: absolute; */ position: fixed; bottom: 0; width: 100%; transform: translateY(100%); transition: all .5s cubic-bezier(0, 1, 0.5, 1); } .custom-keyboard.show { transform: translateY(0%); } .custom-keyboard.hide { transform: translateY(100%); } .custom-keyboard .toolbar { display: flex; flex-direction: row; align-items: center; justify-content: flex-end; padding: 10rpx 24rpx; color: #05aeff; background-color: #ffffff; font-size: 28rpx; } .custom-keyboard .keyboard { background-color: #d1d4db; display: flex; flex-direction: column; padding: 40rpx 10rpx; } .custom-keyboard .keyboard .row { display: flex; flex-direction: row; align-items: center; justify-content: space-around; margin-bottom: 20rpx; } .custom-keyboard .keyboard .row:last-child { margin-bottom: 0; } .custom-keyboard .keyboard .row .col { width: 65rpx; height: 84rpx; line-height: 84rpx; text-align: center; background-color: #ffffff; border-radius: 10rpx; margin-right: 15rpx; font-size: 28rpx; box-shadow: 2rpx 6rpx 5rpx #888888; color: #000; } .custom-keyboard .keyboard .row .col:last-child { margin-right: 0; } .custom-keyboard .keyboard .row .col:active { box-shadow: 0rpx 0rpx 0rpx #888888; } .custom-keyboard .keyboard .row .col.disabled { color: #c6c6c8; } .custom-keyboard .keyboard .row .col.empty { background-color: transparent; box-shadow: unset; } .custom-keyboard .keyboard .row .col.backspace { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 130rpx; } .custom-keyboard .keyboard .row .col.backspace .icon { width: 42rpx; height: 28rpx; } .custom-keyboard .footer { height: env(safe-area-inset-bottom); background-color: #d1d4db; }