111 lines
1.5 KiB
CSS
111 lines
1.5 KiB
CSS
/**
|
|
*
|
|
* Main stylesheet for Powerange.
|
|
* http://abpetkov.github.io/powerange/
|
|
*
|
|
*/
|
|
|
|
/**
|
|
* Horizontal slider style (default).
|
|
*/
|
|
|
|
.range-bar {
|
|
background-color: #a9acb1;
|
|
border-radius: 15px;
|
|
display: block;
|
|
height: 4px;
|
|
position: relative;
|
|
width: 100%;
|
|
}
|
|
|
|
.range-quantity {
|
|
background-color: #017afd;
|
|
border-radius: 15px;
|
|
display: block;
|
|
height: 100%;
|
|
width: 0;
|
|
}
|
|
|
|
.range-handle {
|
|
background-color: #fff;
|
|
border-radius: 100%;
|
|
cursor: move;
|
|
height: 30px;
|
|
left: 0;
|
|
top: -13px;
|
|
position: absolute;
|
|
width: 30px;
|
|
|
|
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
|
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
|
|
}
|
|
|
|
.range-min,
|
|
.range-max {
|
|
color: #181819;
|
|
font-size: 12px;
|
|
height: 20px;
|
|
padding-top: 4px;
|
|
position: absolute;
|
|
text-align: center;
|
|
top: -9px;
|
|
width: 24px;
|
|
}
|
|
|
|
.range-min {
|
|
left: -30px;
|
|
}
|
|
|
|
.range-max {
|
|
right: -30px;
|
|
}
|
|
|
|
/**
|
|
* Vertical slider style.
|
|
*/
|
|
|
|
.vertical {
|
|
height: 100%;
|
|
width: 4px;
|
|
}
|
|
|
|
.vertical .range-quantity {
|
|
bottom: 0;
|
|
height: 0;
|
|
position: absolute;
|
|
width: 100%;
|
|
}
|
|
|
|
.vertical .range-handle {
|
|
bottom: 0;
|
|
left: -13px;
|
|
top: auto;
|
|
}
|
|
|
|
.vertical .range-min,
|
|
.vertical .range-max {
|
|
left: -10px;
|
|
right: auto;
|
|
top: auto;
|
|
}
|
|
|
|
.vertical .range-min {
|
|
bottom: -30px;
|
|
}
|
|
|
|
.vertical .range-max {
|
|
top: -30px;
|
|
}
|
|
|
|
/**
|
|
* Style for disabling text selection on handle move.
|
|
*/
|
|
|
|
.unselectable {
|
|
-webkit-touch-callout: none;
|
|
-webkit-user-select: none;
|
|
-khtml-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
} |