vue-slim-better-scroll/demo/complex/dist/main.94f8c344.css

💇‍ 开箱即用的/渐进式的 vue 移动端滚动组件

.vue-slim-better-scroll__loading{width:20px;height:20px;position:relative;display:block;box-sizing:border-box;animation:spinner-rotate 1s linear infinite;animation-timing-function:steps(12);color:#8c8c8c}.vue-slim-better-scroll__loading i{top:0;left:0;width:100%;height:100%;position:absolute}.vue-slim-better-scroll__loading i:before{width:9%;height:25%;content:"";display:block;margin:0 auto;border-radius:10px;background-color:currentColor}.vue-slim-better-scroll__loading i:first-of-type{opacity:1;transform:rotate(30deg)}.vue-slim-better-scroll__loading i:nth-of-type(2){opacity:.9375;transform:rotate(60deg)}.vue-slim-better-scroll__loading i:nth-of-type(3){opacity:.875;transform:rotate(90deg)}.vue-slim-better-scroll__loading i:nth-of-type(4){opacity:.8125;transform:rotate(120deg)}.vue-slim-better-scroll__loading i:nth-of-type(5){opacity:.75;transform:rotate(150deg)}.vue-slim-better-scroll__loading i:nth-of-type(6){opacity:.6875;transform:rotate(180deg)}.vue-slim-better-scroll__loading i:nth-of-type(7){opacity:.625;transform:rotate(210deg)}.vue-slim-better-scroll__loading i:nth-of-type(8){opacity:.5625;transform:rotate(240deg)}.vue-slim-better-scroll__loading i:nth-of-type(9){opacity:.5;transform:rotate(270deg)}.vue-slim-better-scroll__loading i:nth-of-type(10){opacity:.4375;transform:rotate(300deg)}.vue-slim-better-scroll__loading i:nth-of-type(11){opacity:.375;transform:rotate(330deg)}.vue-slim-better-scroll__loading i:nth-of-type(12){opacity:.3125;transform:rotate(1turn)}@-moz-keyframes spinner-rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@-webkit-keyframes spinner-rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@-o-keyframes spinner-rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes spinner-rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.vue-slim-better-scroll{width:100%;height:100%;overflow:hidden;box-sizing:border-box;position:relative}.vue-slim-better-scroll__wrapper{position:relative;z-index:1}.vue-slim-better-scroll__pullup{height:50px}.vue-slim-better-scroll__pulldown,.vue-slim-better-scroll__pullup{width:100%;display:flex;justify-content:center;align-items:center;font-size:14px;color:#999}.vue-slim-better-scroll__pulldown{position:absolute;left:0;top:-50px;transition:all}.vue-slim-better-scroll__pulldown__before{display:flex}.vue-slim-better-scroll__pulldown__after{width:100%;height:40px;display:flex;justify-content:center;align-items:center}.detail .back-btn{display:block;width:44px;height:100%;position:absolute;top:50%;left:0;transform:translateY(-50%)}.detail .deatil-content{margin-top:20px;text-align:center}*{padding:0;margin:0}.app,.router-view,body,html{width:100%;height:100%;overflow:hidden}.app,.router-view{box-sizing:border-box;display:flex;flex-direction:column}.app .header,.router-view .header{position:relative;font-weight:500}.app .footer,.app .header,.router-view .footer,.router-view .header{flex:0 0 44px;line-height:44px;text-align:center;color:#fff;background:#6a9fb5}.app .content,.router-view .content{flex:1;background-color:#fafafa;overflow:hidden;box-sizing:border-box}.app .content ul li,.router-view .content ul li{background:#fff;height:44px;line-height:44px;text-align:center;color:#6a9fb5;border-bottom:1px solid #eee;position:relative}.allow-left-icon{border-color:#fff;left:20px;transform:translateY(-50%) rotate(-135deg)}.allow-left-icon,.allow-right-icon{border-style:solid;border-width:2px 2px 0 0;position:absolute;top:50%;width:8px;height:8px}.allow-right-icon{border-color:#c8c8cd;right:20px;transform:translateY(-50%) rotate(45deg)}