UNPKG

@mijadesign/mjui-react-taro

Version:

京东风格的轻量级移动端 React 组件库,支持一套代码生成 H5 和小程序

2 lines (1 loc) 3.33 kB
.nut-numberkeyboard{width:100%;padding:var(--nutui-numberkeyboard-padding, 0 0 22px 0);-webkit-user-select:none;user-select:none;background-color:var(--nutui-numberkeyboard-background-color, #f8f8f8)}.nut-numberkeyboard-header{position:relative;display:flex;align-items:center;justify-content:center;box-sizing:content-box;padding:16px;color:#000000f2;font-size:17px}.nut-numberkeyboard-header-title{color:#000000f2;display:inline-block}.nut-numberkeyboard-header-close{position:absolute;display:block;right:0;padding:var(--nutui-numberkeyboard-header-close-padding, 0 16px);color:var(--nutui-numberkeyboard-header-close-color, rgba(0, 0, 0, .6));font-size:var(--nutui-numberkeyboard-header-close-font-size, 14px);background-color:var(--nutui-numberkeyboard-header-close-background-color, transparent);border:none;cursor:pointer}.nut-numberkeyboard-body{display:flex;padding:6px 0 0 6px}.nut-numberkeyboard-body-keys{display:flex;flex:3;flex-wrap:wrap}.nut-numberkeyboard-body-wrapper{position:relative;flex:1;flex-basis:33%;box-sizing:border-box;padding:0 6px 6px 0;background-color:var(--nutui-numberkeyboard-wrapper-background-color, #f8f8f8)}.nut-numberkeyboard-body-wrapper .key{display:flex;align-items:center;justify-content:center;height:var(--nutui-numberkeyboard-key-height, 48px);font-size:var(--nutui-numberkeyboard-key-font-size, 19px);line-height:var(--nutui-numberkeyboard-key-line-height, 1.5);background-color:var(--nutui-numberkeyboard-key-background-color, #fff);color:var(--nutui-numberkeyboard-key-color, rgba(0, 0, 0, .6));border-radius:8px;border:var(--nutui-numberkeyboard-key-border, none);font-weight:var(--nutui-font-weight-bold, 700);cursor:pointer}.nut-numberkeyboard-body-wrapper .key.active{background-color:var(--nutui-numberkeyboard-key-active-background-color, #ebedf0)}.nut-numberkeyboard-sidebar{display:flex;flex:1;flex-direction:column}.nut-numberkeyboard-sidebar .nut-numberkeyboard-body-wrapper .key{position:absolute;top:0;right:6px;bottom:6px;left:0;height:auto}.nut-numberkeyboard-sidebar .nut-numberkeyboard-body-wrapper .confirm{font-size:var(--nutui-numberkeyboard-key-confirm-font-size, 17px);color:var(--nutui-numberkeyboard-key-confirm-color, #fff);background-color:var(--nutui-numberkeyboard-key-confirm-background-color, var(--nutui-color-primary, #006DFC))}.nut-numberkeyboard-sidebar .nut-numberkeyboard-body-wrapper .confirm.active{background-color:#ff0000b3}[dir=rtl] .nut-popup .nut-numberkeyboard-header-close,.nut-rtl .nut-popup .nut-numberkeyboard-header-close{right:auto;left:0}[dir=rtl] .nut-popup .nut-numberkeyboard-body,.nut-rtl .nut-popup .nut-numberkeyboard-body{padding:6px 6px 0 0}[dir=rtl] .nut-popup .nut-numberkeyboard-body-wrapper,.nut-rtl .nut-popup .nut-numberkeyboard-body-wrapper{padding:0 0 6px 6px}[dir=rtl] .nut-popup .nut-numberkeyboard-body-wrapper .delete,.nut-rtl .nut-popup .nut-numberkeyboard-body-wrapper .delete{transform:rotate(-180deg)}[dir=rtl] .nut-popup .nut-numberkeyboard-sidebar .nut-numberkeyboard-body-wrapper .key,.nut-rtl .nut-popup .nut-numberkeyboard-sidebar .nut-numberkeyboard-body-wrapper .key{left:6px;right:0}[dir=rtl] .nut-popup .nut-numberkeyboard-sidebar .nut-numberkeyboard-body-wrapper .key.delete,.nut-rtl .nut-popup .nut-numberkeyboard-sidebar .nut-numberkeyboard-body-wrapper .key.delete{transform:rotate(-180deg)}