116 lines
1.8 KiB
Plaintext
116 lines
1.8 KiB
Plaintext
//
|
|
// Plugins / jQuery UI / Sliders
|
|
// --------------------------------------------------
|
|
|
|
.ui-slider {
|
|
background: #d7d7d7;
|
|
border-radius: 20px;
|
|
position: relative;
|
|
text-align: left;
|
|
}
|
|
|
|
.ui-slider-handle {
|
|
position: absolute;
|
|
z-index: 2;
|
|
width: 14px;
|
|
height: 14px;
|
|
cursor: default;
|
|
border-radius: 1000px;
|
|
border: 1px solid rgba(0, 0, 0, .4);
|
|
#gradient > .vertical(#fcfcfc, #eaeaea);
|
|
|
|
&:before {
|
|
content: "";
|
|
display: block;
|
|
position: absolute;
|
|
width: 4px;
|
|
height: 4px;
|
|
border-radius: 1000px;
|
|
background: red;
|
|
z-index: 3;
|
|
top: 4px;
|
|
left: 4px;
|
|
background: #bbb;
|
|
}
|
|
}
|
|
|
|
.ui-slider-range {
|
|
position: absolute;
|
|
z-index: 1;
|
|
display: block;
|
|
border: 0;
|
|
background-position: 0 0;
|
|
border-radius: 1000px;
|
|
}
|
|
|
|
/* For IE8 - See #6727 */
|
|
.ui-state-disabled .ui-slider-handle,
|
|
.ui-state-disabled .ui-slider-range {
|
|
filter: inherit;
|
|
}
|
|
|
|
.ui-slider-horizontal {
|
|
height: 6px;
|
|
}
|
|
|
|
.ui-slider-horizontal .ui-slider-handle {
|
|
top: -4px;
|
|
margin-left: -7px;
|
|
}
|
|
|
|
.ui-slider-horizontal .ui-slider-range {
|
|
top: 0;
|
|
height: 100%;
|
|
}
|
|
|
|
.ui-slider-horizontal .ui-slider-range-min {
|
|
left: 0;
|
|
}
|
|
|
|
.ui-slider-horizontal .ui-slider-range-max {
|
|
right: 0;
|
|
}
|
|
|
|
.ui-slider-vertical {
|
|
width: 6px;
|
|
height: 100px;
|
|
}
|
|
|
|
.ui-slider-vertical .ui-slider-handle {
|
|
left: -4px;
|
|
margin-left: 0;
|
|
margin-bottom: -7px;
|
|
}
|
|
|
|
.ui-slider-vertical .ui-slider-range {
|
|
left: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.ui-slider-vertical .ui-slider-range-min {
|
|
bottom: 0;
|
|
}
|
|
|
|
.ui-slider-vertical .ui-slider-range-max {
|
|
top: 0;
|
|
}
|
|
|
|
|
|
// Colors
|
|
|
|
.ui-slider.ui-slider-info {
|
|
.ui-slider-color(@info-color);
|
|
}
|
|
|
|
.ui-slider.ui-slider-success {
|
|
.ui-slider-color(@success-color);
|
|
}
|
|
|
|
.ui-slider.ui-slider-warning {
|
|
.ui-slider-color(@warning-color);
|
|
}
|
|
|
|
.ui-slider.ui-slider-danger {
|
|
.ui-slider-color(@danger-color);
|
|
}
|