vue-plain-slider/dist/vue-plain-slider.css

A simple slider component for Vue.js

.slider{position:relative;overflow:hidden}.slider .slider-wrap{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;height:100%;-webkit-transition:all 0ms ease;transition:all 0ms ease}.slider .slider-wrap>div{overflow:hidden;-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%}.slider.horizontal .slider-wrap{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.slider.vertical .slider-wrap{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.slider .slider-pagination{position:absolute}.slider .slider-pagination .slider-pagination-bullet{width:8px;height:8px;border-radius:50%;background-color:#000;opacity:.2;-webkit-transition:all .5s ease;transition:all .5s ease}.slider .slider-pagination .slider-pagination-bullet.active{background:#007aff;opacity:1}.slider.vertical .slider-pagination{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.slider.vertical .slider-pagination .slider-pagination-bullet{display:block;margin:6px 0}.slider.horizontal .slider-pagination{bottom:10px;width:100%;text-align:center}.slider.horizontal .slider-pagination .slider-pagination-bullet{display:inline-block;margin:0 3px}