1 line
2.9 KiB
CSS
1 line
2.9 KiB
CSS
.so-mask{position:fixed;top:0;bottom:0;right:0;left:0;background:rgba(0,0,0,0.5);z-index:998}.so-plate{box-sizing:border-box;position:absolute;bottom:0;width:100%;left:0;background:#fff;padding:25rpx 25rpx 0 25rpx}.so-plate-head{display:-webkit-box;display:flex;-webkit-box-pack:justify;justify-content:space-between;-webkit-box-align:center;align-items:center}.so-plate-type{-webkit-box-flex:1;flex:1;display:block}.so-plate-type label{display:inline-block;min-height:32rpx;font-size:26rpx;margin-right:10rpx}.so-plate-body{box-sizing:border-box;padding:30rpx 0;display:-webkit-box;display:flex;-webkit-box-pack:justify;justify-content:space-between;-webkit-box-align:center;align-items:center}.so-plate-word{border:1rpx solid #ccc;border-radius:10rpx;height:0;margin:0 5rpx;box-sizing:border-box;padding-bottom:calc(4.28571429%);width:calc(4.28571429%);position:relative}.so-plate-word.active{border-color:#007aff;box-shadow:0 0 15rpx 0 #007aff}.so-plate-word text{position:absolute;top:50%;left:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);font-weight:700;font-size:32rpx}.so-plate-dot{width:15rpx;height:15rpx;background:#ccc;border-radius:50%;margin:0 5rpx}.so-plate-keyboard{background:#eee;margin-left:-25rpx;margin-right:-25rpx;padding:20rpx 25rpx 10rpx 25rpx;box-sizing:border-box;-webkit-transition:all .3s;transition:all .3s}.so-plate-keyboard>view{display:-webkit-box;display:flex;flex-wrap:wrap;-webkit-box-pack:justify;justify-content:space-between}.so-plate-key{display:block;background:#fff;border-radius:10rpx;box-shadow:0 0 8rpx 0 #bbb;width:80rpx;height:80rpx;margin:5rpx 0;font-size:32rpx;text-align:center;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;position:relative}.so-plate-key.hover{background:#efefef}.so-plate-key.fill-block{width:80rpx;height:80rpx;background:none;box-shadow:none}.so-plate-btn{display:inline-block;background:#fff;border-radius:10rpx;box-shadow:0 0 10rpx 0 #bbb;font-size:28rpx;text-align:center;margin:0 0 0 10rpx}.so-plate-btn-group{display:-webkit-box;display:flex;-webkit-box-pack:justify;justify-content:space-between;background:#eee;margin-left:-25rpx;margin-right:-25rpx;box-sizing:border-box;padding:0 25rpx 10rpx 25rpx}.so-plate-btn--cancel{margin:0}.so-plate-btn--submit{background:#5773f9;color:#fff}.so-plate-btn--delete{color:#fd6b6d}.animation-scale-up{-webkit-animation-duration:.2s;animation-duration:.2s;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-name:scale-up;animation-name:scale-up}@-webkit-keyframes scale-up{0%{opacity:.8;-webkit-transform:scale(.8);transform:scale(.8)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes scale-up{0%{opacity:.8;-webkit-transform:scale(.8);transform:scale(.8)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}} |