@icreate/ics-mui
Version:
京东风格的轻量级移动端 Vue2、Vue3 组件库(支持小程序开发)
1 lines • 3.7 kB
CSS
.number-keyboard-popup{padding-top:10px;background:var(--nut-numberkeyboard-background-color, #f2f3f5) }.number-keyboard-popup .temp-input{padding:0 6px;box-sizing:border-box}.number-keyboard-popup .temp-input .nut-cell-group__wrap{margin:0;border-radius:6px }.number-keyboard-popup .quick-box{display:flex;align-items:flex-start;justify-content:space-between;width:100%;height:48px;padding:3px 6px;box-sizing:border-box;overflow:hidden}.number-keyboard-popup .quick::-webkit-scrollbar{display:none}.number-keyboard-popup .quick{-ms-overflow-style:none;scrollbar-width:none;overflow:-moz-scrollbars-none;overflow-y:scroll}.number-keyboard-popup .quick{flex:1;display:flex;align-items:center;justify-content:space-between;height:48px;padding-bottom:20px;overflow-x:auto;overflow-y:hidden;touch-action:pan-x;will-change:scroll-position;transform:translateZ(0)}.number-keyboard-popup .quick .quick-item{display:flex;align-items:center;justify-content:flex-end;padding:6px 10px;box-sizing:border-box;font-size:var(--nut-numberkeyboard-key-font-size, 14px);color:var(--nut-numberkeyboard-key-font-size-color, #333);cursor:pointer}.number-keyboard-popup .quick .quick-item--checked{border-radius:4px;background-color:var(--nut-numberkeyboard-key-background-color, #fff)}.number-keyboard-popup .quick-fiexd{display:flex;align-items:center;height:48px;margin-left:12px}.number-keyboard-popup .quick-fiexd .quick-item{display:flex;align-items:center;justify-content:center;padding:6px 12px;box-sizing:border-box;font-size:var(--nut-numberkeyboard-key-font-size, 14px);color:var(--nut-numberkeyboard-key-font-size-color, #333);cursor:pointer}.number-keyboard-popup .quick-fiexd .quick-item--checked{border-radius:4px;background-color:var(--nut-numberkeyboard-key-background-color, #fff)}.number-keyboard-popup .number-keyboard{display:flex;align-items:flex-end;width:100%}.number-keyboard-popup .number-keyboard .temp-list-box{width:calc((100% - 36px)/5);margin-bottom:28px;margin-left:6px;border-radius:var(--nut-numberkeyboard-key-border-radius, 8px);overflow:hidden}.number-keyboard-popup .number-keyboard .temp-list::-webkit-scrollbar{display:none}.number-keyboard-popup .number-keyboard .temp-list{-ms-overflow-style:none;scrollbar-width:none;overflow:-moz-scrollbars-none;overflow-y:scroll}.number-keyboard-popup .number-keyboard .temp-list{width:100%;height:210px;display:flex;flex-direction:column;justify-content:space-between;padding-right:20px;border-radius:var(--nut-numberkeyboard-key-border-radius, 8px);background-color:var(--nut-numberkeyboard-background-color, #fff);user-select:none;overflow-y:auto;overflow-x:hidden}.number-keyboard-popup .number-keyboard .temp-list .nut-key__wrapper{width:100%;padding:0}.number-keyboard-popup .number-keyboard .temp-list .nut-key__wrapper .nut-key{flex:1;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:var(--nut-numberkeyboard-key-height, 42px);font-size:var(--nut-numberkeyboard-key-font-size, 14px);line-height:var(--nut-numberkeyboard-key-line-height, 1.5);background-color:var(--nut-numberkeyboard-key-background-color, #fff);color:var(--nut-numberkeyboard-key-font-size-color, #333);border-radius:var(--nut-numberkeyboard-key-border-radius, 8px);cursor:pointer}.number-keyboard-popup .number-keyboard .temp-list .nut-key__wrapper--checked .nut-key{background-color:var(--nut-numberkeyboard-key-background-color, rgba(0, 0, 0, 0.25))}.number-keyboard-popup .number-keyboard .number-keyboard-box{flex:1}.number-keyboard-popup .number-keyboard-style{position:inherit;width:100%}.number-keyboard-overlay{background:none }