UNPKG

modo-mobile

Version:

A mobile UI toolkit, based on React

75 lines (74 loc) 1.54 kB
.m-stepper { height: 20px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .m-stepper.m-stepper-disabled .m-stepper-button { opacity: 0.4; } .m-stepper.m-stepper-disabled input { opacity: 0.4; } .m-stepper-button { position: relative; width: 20px; height: 20px; border-radius: 2px; } .m-stepper-button::after { content: ''; position: absolute; width: 10px; height: 2px; top: 50%; left: 50%; background: rgba(0, 0, 0, 0.65); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-radius: 2px; } .m-stepper-button.m-stepper-button-add::before { content: ''; position: absolute; width: 2px; height: 10px; top: 50%; left: 50%; background: rgba(0, 0, 0, 0.65); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-radius: 2px; } .m-stepper-button-disabled { opacity: 0.4; } .m-stepper-number { width: 44px; height: 20px; font-size: 0; position: relative; background-color: #f8f8f8; border-radius: 2px; margin: 0 3px; padding: 0 3px; } .m-stepper-number input { width: 100%; height: 20px; border: none; outline: none; font-size: 14px; line-height: 10px; background-color: transparent; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; color: rgba(0, 0, 0, 0.65); padding: 0; margin: 0; display: inline-block; }