wishthis/semantic/dist/components/slider.min.css

9 lines
13 KiB
CSS
Raw Normal View History

2023-08-17 09:47:40 +00:00
/*!
2023-12-19 14:45:49 +00:00
* # Fomantic-UI 2.9.3 - Slider
2023-08-17 09:47:40 +00:00
* https://github.com/fomantic/Fomantic-UI/
*
*
* Released under the MIT license
* https://opensource.org/licenses/MIT
*
*/.ui.slider:not(.vertical):not(.checkbox){width:100%;padding:1em .5em}.ui.slider:not(.checkbox){position:relative}.ui.slider:not(.checkbox):focus{outline:0}.ui.slider .inner{position:relative;z-index:2}.ui.slider:not(.vertical) .inner{height:1.5em}.ui.slider .inner:hover{cursor:auto}.ui.slider .inner .track{position:absolute;border-radius:4px;background-color:rgba(0,0,0,.05)}.ui.slider:not(.vertical) .inner .track{width:100%;height:.4em;top:.55em;left:0}.ui.slider .inner .track-fill{position:absolute;border-radius:4px;background-color:#1b1c1d}.ui.slider:not(.vertical) .inner .track-fill{height:.4em;top:.55em;left:0}.ui.slider .inner .thumb{position:absolute;left:0;top:0;height:1.5em;width:1.5em;background:#fff linear-gradient(transparent,rgba(0,0,0,.05));border-radius:100%;box-shadow:0 1px 2px 0 rgba(34,36,38,.15),0 0 0 1px rgba(34,36,38,.15) inset;transition:background .3s ease}.ui.slider:not(.disabled) .inner .thumb:hover{cursor:pointer;background:#f2f2f2 linear-gradient(transparent,rgba(0,0,0,.05))}.ui.slider:not(.disabled):focus .inner .thumb{background:#f2f2f2 linear-gradient(transparent,rgba(0,0,0,.05))}.ui.disabled.slider:not(.checkbox){opacity:.5}.ui.disabled.slider .inner:hover{cursor:auto}.ui.disabled.slider .inner .track-fill{background:#ccc}.ui.reversed.slider .inner .track-fill{left:auto;right:0}.ui.reversed.slider:not(.vertical) .inner .thumb{left:auto;right:0}.ui.reversed.vertical.slider .inner .thumb{left:.03em}.ui.labeled.reversed.slider>.labels .label{transform:translate(-100%,-100%)}.ui.vertical.slider{height:100%;width:1.5em;padding:.5em 1em}.ui.vertical.slider .inner{height:100%}.ui.vertical.slider .inner .track{height:100%;width:.4em;left:.55em;top:0}.ui.vertical.slider .inner .track-fill{width:.4em;left:.55em;top:0}.ui.vertical.reversed.slider .inner .thumb{top:auto;bottom:0}.ui.vertical.reversed.slider .inner .track-fill{top:auto;bottom:0}.ui.labeled.slider>.labels{height:1.5em;width:auto;margin:0;padding:0;position:absolute;top:50%;left:0;right:0}.ui.labeled.slider:not(.vertical)>.labels{transform:translateY(-50%)}.ui.labeled.slider>.labels .label{display:inline-flex;padding:.2em 0;position:absolute;transform:translate(-50%,-100%);white-space:nowrap}.ui.bottom.aligned.labeled.slider>.labels .label{bottom:0;transform:translate(-50%,100%)}.ui.labeled.ticked.slider>.labels .label::after{content:" ";height:1.5em;width:1px;background:#ccc;position:absolute;top:100%;left:50%}.ui.bottom.aligned.labeled.ticked.slider>.labels .label::after{top:auto;bottom:100%}.ui.labeled.ticked.slider>.labels .halftick.label::after{height:.75em}.ui.labeled.vertical.slider>.labels{width:1.5em;height:auto;left:50%;top:0;bottom:0;transform:translateX(-50%)}.ui.labeled.vertical.slider>.labels .label{transform:translate(-100%,-50%)}.ui.labeled.vertical.slider>.labels .label::after{width:1.5em;height:1px;left:100%;top:50%}.ui.labeled.vertical.slider>.labels .halftick.label::after{width:.75em;height:1px}.ui.labeled.vertical.reversed.slider>.labels .label{transform:translate(-100%,50%)}.ui.hover.slider .inner .thumb{opacity:0;transition:opacity .2s linear}.ui.hover.slider:not(.disabled):focus .inner .thumb,.ui.hover.slider:not(.disabled):hover .inner .thumb{opacity:1}.ui.inverted.slider .inner .track-fill{background-color:#545454}.ui.inverted.slider .inner .track{background-color:rgba(255,255,255,.08)}.ui.primary.slider .inner .track-fill{background-color:#6435c9}.ui.primary.inverted.slider .inner .track-fill{background-color:#a291fb}.ui.primary.slider.basic .inner .thumb{background-color:#6435c9}.ui.primary.slider.basic .inner .thumb:hover,.ui.primary.slider.basic:focus .inner .thumb{background-color:#5829bb}.ui.primary.inverted.slider.basic .inner .thumb{background-color:#a291fb}.ui.primary.inverted.slider.basic .inner .thumb:hover,.ui.primary.inverted.slider.basic:focus .inner .thumb{background-color:#745aff}.ui.secondary.slider .inner .track-fill{background-color:#1b1c1d}.ui.secondary.inverted.slider .inner .track-fill{background-color:#545454}.ui.secondary.slider.basic .inner .thumb{background-color:#1b1c1d}.ui.secondary