material-components-vue/dist/slider/slider.min.css

Material Design components for Vue.js

@-webkit-keyframes mdc-slider-emphasize{0%{-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-transform:scale(.85);transform:scale(.85)}to{-webkit-transform:scale(.571);transform:scale(.571)}}@keyframes mdc-slider-emphasize{0%{-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-transform:scale(.85);transform:scale(.85)}to{-webkit-transform:scale(.571);transform:scale(.571)}}.mdc-slider{position:relative;width:100%;height:48px;cursor:pointer;-ms-touch-action:pan-x;touch-action:pan-x;-webkit-tap-highlight-color:rgba(0,0,0,0)}.mdc-slider:not(.mdc-slider--disabled) .mdc-slider__track{background-color:#018786;background-color:var(--mdc-theme-secondary,#018786)}.mdc-slider:not(.mdc-slider--disabled) .mdc-slider__track-container{background-color:rgba(1,135,134,.26)}.mdc-slider:not(.mdc-slider--disabled) .mdc-slider__track-marker-container:after,.mdc-slider:not(.mdc-slider--disabled) .mdc-slider__track-marker:after{background-color:#018786;background-color:var(--mdc-theme-secondary,#018786)}.mdc-slider:not(.mdc-slider--disabled) .mdc-slider__thumb{fill:#018786;fill:var(--mdc-theme-secondary,#018786);stroke:#018786;stroke:var(--mdc-theme-secondary,#018786)}.mdc-slider:not(.mdc-slider--disabled) .mdc-slider__focus-ring,.mdc-slider:not(.mdc-slider--disabled) .mdc-slider__pin{background-color:#018786;background-color:var(--mdc-theme-secondary,#018786)}.mdc-slider:not(.mdc-slider--disabled) .mdc-slider__pin{color:#fff;color:var(--mdc-theme-text-primary-on-dark,#fff)}.mdc-slider--disabled{cursor:auto}.mdc-slider--disabled .mdc-slider__track{background-color:#9a9a9a}.mdc-slider--disabled .mdc-slider__track-container{background-color:hsla(0,0%,60.4%,.26)}.mdc-slider--disabled .mdc-slider__track-marker-container:after,.mdc-slider--disabled .mdc-slider__track-marker:after{background-color:#9a9a9a}.mdc-slider--disabled .mdc-slider__thumb{fill:#9a9a9a;stroke:#9a9a9a;stroke:#fff;stroke:var(--mdc-slider-bg-color-behind-component,#fff)}.mdc-slider:focus{outline:none}.mdc-slider__track-container{position:absolute;top:50%;width:100%;height:2px;overflow:hidden}.mdc-slider__track{position:absolute;width:100%;height:100%;-webkit-transform-origin:left top;transform-origin:left top;will-change:transform}.mdc-slider[dir=rtl] .mdc-slider__track,[dir=rtl] .mdc-slider .mdc-slider__track{-webkit-transform-origin:right top;transform-origin:right top}.mdc-slider__track-marker-container{display:-webkit-box;display:-ms-flexbox;display:flex;margin-right:0;margin-left:-1px;visibility:hidden}.mdc-slider[dir=rtl] .mdc-slider__track-marker-container,[dir=rtl] .mdc-slider .mdc-slider__track-marker-container{margin-right:-1px;margin-left:0}.mdc-slider__track-marker-container:after{display:block;width:2px;height:2px;content:""}.mdc-slider__track-marker{-webkit-box-flex:1;-ms-flex:1;flex:1}.mdc-slider__track-marker:after{display:block;width:2px;height:2px;content:""}.mdc-slider__track-marker:first-child:after{width:3px}.mdc-slider__thumb-container{position:absolute;top:15px;left:0;width:21px;height:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;will-change:transform}.mdc-slider__thumb{position:absolute;top:0;left:0;-webkit-transform:scale(.571);transform:scale(.571);stroke-width:3.5;-webkit-transition:fill .1s ease-out,stroke .1s ease-out,-webkit-transform .1s ease-out;transition:fill .1s ease-out,stroke .1s ease-out,-webkit-transform .1s ease-out;transition:transform .1s ease-out,fill .1s ease-out,stroke .1s ease-out;transition:transform .1s ease-out,fill .1s ease-out,stroke .1s ease-out,-webkit-transform .1s ease-out}.mdc-slider__focus-ring{width:21px;height:21px;border-radius:50%;opacity:0;-webkit-transition:opacity .26667s ease-out,background-color .26667s ease-out,-webkit-transform .26667s ease-out;transition:opacity .26667s ease-out,background-color .26667s ease-out,-webkit-transform .26667s ease-out;transition:transform .26667s ease-out,opacity .26667s ease-out,background-color .26667s ease-out;transition:transform .26667s ease-out,opacity .26667s ease-out,background-color .26667s ease-out,-webkit-transform .26667s ease-out}.mdc-slider__pin{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;top:0;left:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:26px;height:26px;margin-top:-2px;margin-left:-2px;-webkit-transform:rotate(-45deg) scale(0) translate(0);transform:rotate(-45deg) scale(0) translate(0);border-radius:50% 50% 50% 0;z-index:1;-webkit-transition:-webkit-transform .1s ease-out;transition:-webkit-transform .1s ease-out;transition:transform .1s ease-out;transition:transform .1s ease-out,-webkit-transform .1s ease-out}.mdc-slider__pin-value-marker{font-family:Roboto,sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-size:.875rem;line-height:1.25rem;font-weight:400;letter-spacing:.01786em;text-decoration:inherit;text-transform:inherit;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.mdc-slider--active .mdc-slider__thumb{-webkit-transform:scaleX(1);transform:scaleX(1)}.mdc-slider--focus .mdc-slider__thumb{-webkit-animation:mdc-slider-emphasize .26667s linear;animation:mdc-slider-emphasize .26667s linear}.mdc-slider--focus .mdc-slider__focus-ring{-webkit-transform:scale3d(1.55,1.55,1.55);transform:scale3d(1.55,1.55,1.55);opacity:.25}.mdc-slider--in-transit .mdc-slider__thumb{-webkit-transition-delay:.14s;transition-delay:.14s}.mdc-slider--in-transit .mdc-slider__thumb-container,.mdc-slider--in-transit .mdc-slider__track,.mdc-slider:focus:not(.mdc-slider--active) .mdc-slider__thumb-container,.mdc-slider:focus:not(.mdc-slider--active) .mdc-slider__track{-webkit-transition:-webkit-transform 80ms ease;transition:-webkit-transform 80ms ease;transition:transform 80ms ease;transition:transform 80ms ease,-webkit-transform 80ms ease}.mdc-slider--discrete.mdc-slider--active .mdc-slider__thumb{-webkit-transform:scale(.57143);transform:scale(.57143)}.mdc-slider--discrete.mdc-slider--active .mdc-slider__pin{-webkit-transform:rotate(-45deg) scale(1) translate(19px,-20px);transform:rotate(-45deg) scale(1) translate(19px,-20px)}.mdc-slider--discrete.mdc-slider--focus .mdc-slider__thumb{-webkit-animation:none;animation:none}.mdc-slider--discrete.mdc-slider--display-markers .mdc-slider__track-marker-container{visibility:visible}