UNPKG

@mijadesign/mjui-react-taro

Version:

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

2 lines (1 loc) 3.03 kB
.nut-picker{background-color:#fff;width:100%}.nut-picker-control{display:flex;height:var(--nutui-popup-title-height, 50px);font-size:17px;align-items:center;justify-content:space-between;padding:16px}.nut-picker-cancel-btn{color:var(--nutui-picker-title-cancel-color, rgba(0, 0, 0, .6));font-size:var(--nutui-picker-title-cancel-font-size, 15px)}.nut-picker-confirm-btn{color:var(--nutui-picker-title-ok-color, var(--nutui-color-primary, #006DFC));font-size:var(--nutui-picker-title-ok-font-size, 15px)}.nut-picker-title{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;color:#000000f2;font-size:17px;font-weight:var(--nutui-font-weight-bold, 700)}.nut-picker-panel{display:flex;position:relative}.nut-picker-indicator{position:absolute;top:108px;height:48px;width:100%;border:var(--nutui-picker-item-active-line-border, 1px solid rgba(0, 0, 0, .1));border-left:0;border-right:0;color:var(--nutui-picker-item-text-color, rgba(0, 0, 0, .95));font-size:var(--nutui-picker-item-text-font-size, 15px);z-index:3}.nut-picker-indicator-taro{height:48px;border:0}.nut-picker-indicator-taro:before,.nut-picker-indicator-taro:after{border:var(--nutui-picker-item-active-line-border, 1px solid rgba(0, 0, 0, .1));border-left:0;border-right:0}.nut-picker-list{flex:1;position:relative;height:var(--nutui-picker-list-height, 252px);overflow:hidden;text-align:center}.nut-picker-list-panel{transform-style:preserve-3d}.nut-picker-mask{position:absolute;top:0;left:0;right:0;bottom:0;background-image:var(--picker-mask-background, linear-gradient(180deg, var(--nutui-white-12), var(--nutui-white-7)), linear-gradient(0deg, var(--nutui-white-12), var(--nutui-white-7)));background-position:top,bottom;background-size:100% 108px;background-repeat:no-repeat;transform:translateZ(0);z-index:3}.nut-picker-view-panel{height:var(--nutui-picker-list-height, 252px);flex-grow:1}.nut-picker-content,.nut-picker-roller{position:absolute;top:108px;width:100%;height:48px}.nut-picker-content{background:#fff;z-index:2;overflow:hidden}.nut-picker-item,.nut-picker-roller-item{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;height:48px;line-height:48px;color:var(--nutui-picker-item-text-color, rgba(0, 0, 0, .95));font-size:var(--nutui-picker-item-text-font-size, 15px);text-align:center}.nut-picker-item{font-size:16px;background:#fff}.nut-picker-roller{z-index:1;transform-style:preserve-3d}.nut-picker-roller-item{backface-visibility:hidden;-moz-backface-visibility:hidden;-webkit-backface-visibility:hidden;position:absolute;top:0;width:100%}.nut-picker-roller-item-title{display:block;width:100%;height:48px;line-height:48px;text-align:center;color:#000000f2;font-size:15px}.nut-picker-roller-item-hidden{visibility:hidden;opacity:0}.nut-picker-placeholder{height:1px}[dir=rtl] .nut-picker-mask,.nut-rtl .nut-picker-mask{background-image:var(--picker-mask-background, linear-gradient(-180deg, var(--nutui-white-12), var(--nutui-white-7)), linear-gradient(0deg, var(--nutui-white-12), var(--nutui-white-7)))}