new ui with AdminLTE
This commit is contained in:
lukas committed
1 parent
98e14b92ab
commit
6afaad0d33
1784 files changed
+582732
-6
No files matched your search
@@ -0,0 +1,6 @@
|
||||
root = true
|
||||
|
||||
[*.{js,css,less,html}]
|
||||
indent_style = space
|
||||
indent_size = 4
|
||||
charset = utf-8
|
||||
@@ -0,0 +1,675 @@
|
||||
/**
|
||||
Ion.RangeSlider, 2.3.0
|
||||
© Denis Ineshin, 2010 - 2018, IonDen.com
|
||||
Build date: 2018-12-11 23:23:51
|
||||
*/
|
||||
.irs {
|
||||
position: relative;
|
||||
display: block;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
font-size: 12px;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
.irs-line {
|
||||
position: relative;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
outline: none !important;
|
||||
}
|
||||
.irs-bar {
|
||||
position: absolute;
|
||||
display: block;
|
||||
left: 0;
|
||||
width: 0;
|
||||
}
|
||||
.irs-shadow {
|
||||
position: absolute;
|
||||
display: none;
|
||||
left: 0;
|
||||
width: 0;
|
||||
}
|
||||
.irs-handle {
|
||||
position: absolute;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
cursor: default;
|
||||
z-index: 1;
|
||||
}
|
||||
.irs-handle.type_last {
|
||||
z-index: 2;
|
||||
}
|
||||
.irs-min,
|
||||
.irs-max {
|
||||
position: absolute;
|
||||
display: block;
|
||||
cursor: default;
|
||||
}
|
||||
.irs-min {
|
||||
left: 0;
|
||||
}
|
||||
.irs-max {
|
||||
right: 0;
|
||||
}
|
||||
.irs-from,
|
||||
.irs-to,
|
||||
.irs-single {
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
left: 0;
|
||||
cursor: default;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.irs-grid {
|
||||
position: absolute;
|
||||
display: none;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
}
|
||||
.irs-with-grid .irs-grid {
|
||||
display: block;
|
||||
}
|
||||
.irs-grid-pol {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 1px;
|
||||
height: 8px;
|
||||
background: #000;
|
||||
}
|
||||
.irs-grid-pol.small {
|
||||
height: 4px;
|
||||
}
|
||||
.irs-grid-text {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
line-height: 9px;
|
||||
padding: 0 3px;
|
||||
color: #000;
|
||||
}
|
||||
.irs-disable-mask {
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
left: -1%;
|
||||
width: 102%;
|
||||
height: 100%;
|
||||
cursor: default;
|
||||
background: rgba(0, 0, 0, 0);
|
||||
z-index: 2;
|
||||
}
|
||||
.lt-ie9 .irs-disable-mask {
|
||||
background: #000;
|
||||
filter: alpha(opacity=0);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.irs-disabled {
|
||||
opacity: 0.4;
|
||||
}
|
||||
.irs-hidden-input {
|
||||
position: absolute !important;
|
||||
display: block !important;
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
font-size: 0 !important;
|
||||
line-height: 0 !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
overflow: hidden;
|
||||
outline: none !important;
|
||||
z-index: -9999 !important;
|
||||
background: none !important;
|
||||
border-style: solid !important;
|
||||
border-color: transparent !important;
|
||||
}
|
||||
.irs--flat {
|
||||
height: 40px;
|
||||
}
|
||||
.irs--flat.irs-with-grid {
|
||||
height: 60px;
|
||||
}
|
||||
.irs--flat .irs-line {
|
||||
top: 25px;
|
||||
height: 12px;
|
||||
background-color: #e1e4e9;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.irs--flat .irs-bar {
|
||||
top: 25px;
|
||||
height: 12px;
|
||||
background-color: #ed5565;
|
||||
}
|
||||
.irs--flat .irs-bar--single {
|
||||
border-radius: 4px 0 0 4px;
|
||||
}
|
||||
.irs--flat .irs-shadow {
|
||||
height: 1px;
|
||||
bottom: 16px;
|
||||
background-color: #e1e4e9;
|
||||
}
|
||||
.irs--flat .irs-handle {
|
||||
top: 22px;
|
||||
width: 16px;
|
||||
height: 18px;
|
||||
background-color: transparent;
|
||||
}
|
||||
.irs--flat .irs-handle > i:first-child {
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
margin-left: -1px;
|
||||
background-color: #da4453;
|
||||
}
|
||||
.irs--flat .irs-handle.state_hover > i:first-child,
|
||||
.irs--flat .irs-handle:hover > i:first-child {
|
||||
background-color: #a43540;
|
||||
}
|
||||
.irs--flat .irs-min,
|
||||
.irs--flat .irs-max {
|
||||
top: 0;
|
||||
padding: 1px 3px;
|
||||
color: #999;
|
||||
font-size: 10px;
|
||||
line-height: 1.333;
|
||||
text-shadow: none;
|
||||
background-color: #e1e4e9;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.irs--flat .irs-from,
|
||||
.irs--flat .irs-to,
|
||||
.irs--flat .irs-single {
|
||||
color: white;
|
||||
font-size: 10px;
|
||||
line-height: 1.333;
|
||||
text-shadow: none;
|
||||
padding: 1px 5px;
|
||||
background-color: #ed5565;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.irs--flat .irs-from:before,
|
||||
.irs--flat .irs-to:before,
|
||||
.irs--flat .irs-single:before {
|
||||
position: absolute;
|
||||
display: block;
|
||||
content: "";
|
||||
bottom: -6px;
|
||||
left: 50%;
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin-left: -3px;
|
||||
overflow: hidden;
|
||||
border: 3px solid transparent;
|
||||
border-top-color: #ed5565;
|
||||
}
|
||||
.irs--flat .irs-grid-pol {
|
||||
background-color: #e1e4e9;
|
||||
}
|
||||
.irs--flat .irs-grid-text {
|
||||
color: #999;
|
||||
}
|
||||
.irs--big {
|
||||
height: 55px;
|
||||
}
|
||||
.irs--big.irs-with-grid {
|
||||
height: 70px;
|
||||
}
|
||||
.irs--big .irs-line {
|
||||
top: 33px;
|
||||
height: 12px;
|
||||
background-color: white;
|
||||
background: linear-gradient(to bottom, #ddd -50%, white 150%);
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 12px;
|
||||
}
|
||||
.irs--big .irs-bar {
|
||||
top: 33px;
|
||||
height: 12px;
|
||||
background-color: #92bce0;
|
||||
border: 1px solid #428bca;
|
||||
background: linear-gradient(to bottom, #ffffff 0%, #428bca 30%, #b9d4ec 100%);
|
||||
box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
.irs--big .irs-bar--single {
|
||||
border-radius: 12px 0 0 12px;
|
||||
}
|
||||
.irs--big .irs-shadow {
|
||||
height: 1px;
|
||||
bottom: 16px;
|
||||
background-color: rgba(66, 139, 202, 0.5);
|
||||
}
|
||||
.irs--big .irs-handle {
|
||||
top: 25px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border: 1px solid rgba(0, 0, 0, 0.3);
|
||||
background-color: #cbcfd5;
|
||||
background: linear-gradient(to bottom, white 0%, #B4B9BE 30%, white 100%);
|
||||
box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2), inset 0 0 3px 1px white;
|
||||
border-radius: 30px;
|
||||
}
|
||||
.irs--big .irs-handle.state_hover,
|
||||
.irs--big .irs-handle:hover {
|
||||
border-color: rgba(0, 0, 0, 0.45);
|
||||
background-color: #939ba7;
|
||||
background: linear-gradient(to bottom, white 0%, #919BA5 30%, white 100%);
|
||||
}
|
||||
.irs--big .irs-min,
|
||||
.irs--big .irs-max {
|
||||
top: 0;
|
||||
padding: 1px 5px;
|
||||
color: white;
|
||||
text-shadow: none;
|
||||
background-color: #9f9f9f;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.irs--big .irs-from,
|
||||
.irs--big .irs-to,
|
||||
.irs--big .irs-single {
|
||||
color: white;
|
||||
text-shadow: none;
|
||||
padding: 1px 5px;
|
||||
background-color: #428bca;
|
||||
background: linear-gradient(to bottom, #428bca 0%, #3071a9 100%);
|
||||
border-radius: 3px;
|
||||
}
|
||||
.irs--big .irs-grid-pol {
|
||||
background-color: #428bca;
|
||||
}
|
||||
.irs--big .irs-grid-text {
|
||||
color: #428bca;
|
||||
}
|
||||
.irs--modern {
|
||||
height: 55px;
|
||||
}
|
||||
.irs--modern.irs-with-grid {
|
||||
height: 55px;
|
||||
}
|
||||
.irs--modern .irs-line {
|
||||
top: 25px;
|
||||
height: 5px;
|
||||
background-color: #d1d6e0;
|
||||
background: linear-gradient(to bottom, #e0e4ea 0%, #d1d6e0 100%);
|
||||
border: 1px solid #a3adc1;
|
||||
border-bottom-width: 0;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.irs--modern .irs-bar {
|
||||
top: 25px;
|
||||
height: 5px;
|
||||
background: #20b426;
|
||||
background: linear-gradient(to bottom, #20b426 0%, #18891d 100%);
|
||||
}
|
||||
.irs--modern .irs-bar--single {
|
||||
border-radius: 5px 0 0 5px;
|
||||
}
|
||||
.irs--modern .irs-shadow {
|
||||
height: 1px;
|
||||
bottom: 21px;
|
||||
background-color: rgba(209, 214, 224, 0.5);
|
||||
}
|
||||
.irs--modern .irs-handle {
|
||||
top: 37px;
|
||||
width: 12px;
|
||||
height: 13px;
|
||||
border: 1px solid #a3adc1;
|
||||
border-top-width: 0;
|
||||
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
|
||||
border-radius: 0 0 3px 3px;
|
||||
}
|
||||
.irs--modern .irs-handle > i:nth-child(1) {
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: -4px;
|
||||
left: 1px;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 1px solid #a3adc1;
|
||||
background: white;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.irs--modern .irs-handle > i:nth-child(2) {
|
||||
position: absolute;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 10px;
|
||||
height: 12px;
|
||||
background: #e9e6e6;
|
||||
background: linear-gradient(to bottom, white 0%, #e9e6e6 100%);
|
||||
border-radius: 0 0 3px 3px;
|
||||
}
|
||||
.irs--modern .irs-handle > i:nth-child(3) {
|
||||
position: absolute;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
top: 3px;
|
||||
left: 3px;
|
||||
width: 4px;
|
||||
height: 5px;
|
||||
border-left: 1px solid #a3adc1;
|
||||
border-right: 1px solid #a3adc1;
|
||||
}
|
||||
.irs--modern .irs-handle.state_hover,
|
||||
.irs--modern .irs-handle:hover {
|
||||
border-color: #7685a2;
|
||||
background: #c3c7cd;
|
||||
background: linear-gradient(to bottom, #ffffff 0%, #919ba5 30%, #ffffff 100%);
|
||||
}
|
||||
.irs--modern .irs-handle.state_hover > i:nth-child(1),
|
||||
.irs--modern .irs-handle:hover > i:nth-child(1) {
|
||||
border-color: #7685a2;
|
||||
}
|
||||
.irs--modern .irs-handle.state_hover > i:nth-child(3),
|
||||
.irs--modern .irs-handle:hover > i:nth-child(3) {
|
||||
border-color: #48536a;
|
||||
}
|
||||
.irs--modern .irs-min,
|
||||
.irs--modern .irs-max {
|
||||
top: 0;
|
||||
font-size: 10px;
|
||||
line-height: 1.333;
|
||||
text-shadow: none;
|
||||
padding: 1px 5px;
|
||||
color: white;
|
||||
background-color: #d1d6e0;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.irs--modern .irs-from,
|
||||
.irs--modern .irs-to,
|
||||
.irs--modern .irs-single {
|
||||
font-size: 10px;
|
||||
line-height: 1.333;
|
||||
text-shadow: none;
|
||||
padding: 1px 5px;
|
||||
background-color: #20b426;
|
||||
color: white;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.irs--modern .irs-from:before,
|
||||
.irs--modern .irs-to:before,
|
||||
.irs--modern .irs-single:before {
|
||||
position: absolute;
|
||||
display: block;
|
||||
content: "";
|
||||
bottom: -6px;
|
||||
left: 50%;
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin-left: -3px;
|
||||
overflow: hidden;
|
||||
border: 3px solid transparent;
|
||||
border-top-color: #20b426;
|
||||
}
|
||||
.irs--modern .irs-grid {
|
||||
height: 25px;
|
||||
}
|
||||
.irs--modern .irs-grid-pol {
|
||||
background-color: #dedede;
|
||||
}
|
||||
.irs--modern .irs-grid-text {
|
||||
color: silver;
|
||||
font-size: 13px;
|
||||
}
|
||||
.irs--sharp {
|
||||
height: 50px;
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
}
|
||||
.irs--sharp.irs-with-grid {
|
||||
height: 57px;
|
||||
}
|
||||
.irs--sharp .irs-line {
|
||||
top: 30px;
|
||||
height: 2px;
|
||||
background-color: black;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.irs--sharp .irs-bar {
|
||||
top: 30px;
|
||||
height: 2px;
|
||||
background-color: #ee22fa;
|
||||
}
|
||||
.irs--sharp .irs-bar--single {
|
||||
border-radius: 2px 0 0 2px;
|
||||
}
|
||||
.irs--sharp .irs-shadow {
|
||||
height: 1px;
|
||||
bottom: 21px;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
.irs--sharp .irs-handle {
|
||||
top: 25px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background-color: #a804b2;
|
||||
}
|
||||
.irs--sharp .irs-handle > i:first-child {
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border: 5px solid transparent;
|
||||
border-top-color: #a804b2;
|
||||
}
|
||||
.irs--sharp .irs-handle.state_hover,
|
||||
.irs--sharp .irs-handle:hover {
|
||||
background-color: black;
|
||||
}
|
||||
.irs--sharp .irs-handle.state_hover > i:first-child,
|
||||
.irs--sharp .irs-handle:hover > i:first-child {
|
||||
border-top-color: black;
|
||||
}
|
||||
.irs--sharp .irs-min,
|
||||
.irs--sharp .irs-max {
|
||||
color: white;
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
top: 0;
|
||||
padding: 3px 4px;
|
||||
opacity: 0.4;
|
||||
background-color: #a804b2;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.irs--sharp .irs-from,
|
||||
.irs--sharp .irs-to,
|
||||
.irs--sharp .irs-single {
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
text-shadow: none;
|
||||
padding: 3px 4px;
|
||||
background-color: #a804b2;
|
||||
color: white;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.irs--sharp .irs-from:before,
|
||||
.irs--sharp .irs-to:before,
|
||||
.irs--sharp .irs-single:before {
|
||||
position: absolute;
|
||||
display: block;
|
||||
content: "";
|
||||
bottom: -6px;
|
||||
left: 50%;
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin-left: -3px;
|
||||
overflow: hidden;
|
||||
border: 3px solid transparent;
|
||||
border-top-color: #a804b2;
|
||||
}
|
||||
.irs--sharp .irs-grid {
|
||||
height: 25px;
|
||||
}
|
||||
.irs--sharp .irs-grid-pol {
|
||||
background-color: #dedede;
|
||||
}
|
||||
.irs--sharp .irs-grid-text {
|
||||
color: silver;
|
||||
font-size: 13px;
|
||||
}
|
||||
.irs--round {
|
||||
height: 50px;
|
||||
}
|
||||
.irs--round.irs-with-grid {
|
||||
height: 65px;
|
||||
}
|
||||
.irs--round .irs-line {
|
||||
top: 36px;
|
||||
height: 4px;
|
||||
background-color: #dee4ec;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.irs--round .irs-bar {
|
||||
top: 36px;
|
||||
height: 4px;
|
||||
background-color: #006cfa;
|
||||
}
|
||||
.irs--round .irs-bar--single {
|
||||
border-radius: 4px 0 0 4px;
|
||||
}
|
||||
.irs--round .irs-shadow {
|
||||
height: 4px;
|
||||
bottom: 21px;
|
||||
background-color: rgba(222, 228, 236, 0.5);
|
||||
}
|
||||
.irs--round .irs-handle {
|
||||
top: 26px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border: 4px solid #006cfa;
|
||||
background-color: white;
|
||||
border-radius: 24px;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 255, 0.3);
|
||||
}
|
||||
.irs--round .irs-handle.state_hover,
|
||||
.irs--round .irs-handle:hover {
|
||||
background-color: #f0f6ff;
|
||||
}
|
||||
.irs--round .irs-min,
|
||||
.irs--round .irs-max {
|
||||
color: #333;
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
top: 0;
|
||||
padding: 3px 5px;
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
.irs--round .irs-from,
|
||||
.irs--round .irs-to,
|
||||
.irs--round .irs-single {
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
text-shadow: none;
|
||||
padding: 3px 5px;
|
||||
background-color: #006cfa;
|
||||
color: white;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.irs--round .irs-from:before,
|
||||
.irs--round .irs-to:before,
|
||||
.irs--round .irs-single:before {
|
||||
position: absolute;
|
||||
display: block;
|
||||
content: "";
|
||||
bottom: -6px;
|
||||
left: 50%;
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin-left: -3px;
|
||||
overflow: hidden;
|
||||
border: 3px solid transparent;
|
||||
border-top-color: #006cfa;
|
||||
}
|
||||
.irs--round .irs-grid {
|
||||
height: 25px;
|
||||
}
|
||||
.irs--round .irs-grid-pol {
|
||||
background-color: #dedede;
|
||||
}
|
||||
.irs--round .irs-grid-text {
|
||||
color: silver;
|
||||
font-size: 13px;
|
||||
}
|
||||
.irs--square {
|
||||
height: 50px;
|
||||
}
|
||||
.irs--square.irs-with-grid {
|
||||
height: 60px;
|
||||
}
|
||||
.irs--square .irs-line {
|
||||
top: 31px;
|
||||
height: 4px;
|
||||
background-color: #dedede;
|
||||
}
|
||||
.irs--square .irs-bar {
|
||||
top: 31px;
|
||||
height: 4px;
|
||||
background-color: black;
|
||||
}
|
||||
.irs--square .irs-shadow {
|
||||
height: 2px;
|
||||
bottom: 21px;
|
||||
background-color: #dedede;
|
||||
}
|
||||
.irs--square .irs-handle {
|
||||
top: 25px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border: 3px solid black;
|
||||
background-color: white;
|
||||
-webkit-transform: rotate(45deg);
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.irs--square .irs-handle.state_hover,
|
||||
.irs--square .irs-handle:hover {
|
||||
background-color: #f0f6ff;
|
||||
}
|
||||
.irs--square .irs-min,
|
||||
.irs--square .irs-max {
|
||||
color: #333;
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
top: 0;
|
||||
padding: 3px 5px;
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.irs--square .irs-from,
|
||||
.irs--square .irs-to,
|
||||
.irs--square .irs-single {
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
text-shadow: none;
|
||||
padding: 3px 5px;
|
||||
background-color: black;
|
||||
color: white;
|
||||
}
|
||||
.irs--square .irs-grid {
|
||||
height: 25px;
|
||||
}
|
||||
.irs--square .irs-grid-pol {
|
||||
background-color: #dedede;
|
||||
}
|
||||
.irs--square .irs-grid-text {
|
||||
color: silver;
|
||||
font-size: 11px;
|
||||
}
|
||||
+1
@@ -0,0 +1 @@
|
||||
/*!Ion.RangeSlider, 2.3.0, © Denis Ineshin, 2010 - 2018, IonDen.com, Build date: 2018-12-11 23:23:51*/.irs{position:relative;display:block;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-size:12px;font-family:Arial,sans-serif}.irs-line{position:relative;display:block;overflow:hidden;outline:none !important}.irs-bar{position:absolute;display:block;left:0;width:0}.irs-shadow{position:absolute;display:none;left:0;width:0}.irs-handle{position:absolute;display:block;box-sizing:border-box;cursor:default;z-index:1}.irs-handle.type_last{z-index:2}.irs-min,.irs-max{position:absolute;display:block;cursor:default}.irs-min{left:0}.irs-max{right:0}.irs-from,.irs-to,.irs-single{position:absolute;display:block;top:0;left:0;cursor:default;white-space:nowrap}.irs-grid{position:absolute;display:none;bottom:0;left:0;width:100%;height:20px}.irs-with-grid .irs-grid{display:block}.irs-grid-pol{position:absolute;top:0;left:0;width:1px;height:8px;background:#000}.irs-grid-pol.small{height:4px}.irs-grid-text{position:absolute;bottom:0;left:0;white-space:nowrap;text-align:center;font-size:9px;line-height:9px;padding:0 3px;color:#000}.irs-disable-mask{position:absolute;display:block;top:0;left:-1%;width:102%;height:100%;cursor:default;background:rgba(0,0,0,0);z-index:2}.lt-ie9 .irs-disable-mask{background:#000;filter:alpha(opacity=0);cursor:not-allowed}.irs-disabled{opacity:.4}.irs-hidden-input{position:absolute !important;display:block !important;top:0 !important;left:0 !important;width:0 !important;height:0 !important;font-size:0 !important;line-height:0 !important;padding:0 !important;margin:0 !important;overflow:hidden;outline:none !important;z-index:-9999 !important;background:none !important;border-style:solid !important;border-color:transparent !important}.irs--flat{height:40px}.irs--flat.irs-with-grid{height:60px}.irs--flat .irs-line{top:25px;height:12px;background-color:#e1e4e9;border-radius:4px}.irs--flat .irs-bar{top:25px;height:12px;background-color:#ed5565}.irs--flat .irs-bar--single{border-radius:4px 0 0 4px}.irs--flat .irs-shadow{height:1px;bottom:16px;background-color:#e1e4e9}.irs--flat .irs-handle{top:22px;width:16px;height:18px;background-color:transparent}.irs--flat .irs-handle>i:first-child{position:absolute;display:block;top:0;left:50%;width:2px;height:100%;margin-left:-1px;background-color:#da4453}.irs--flat .irs-handle.state_hover>i:first-child,.irs--flat .irs-handle:hover>i:first-child{background-color:#a43540}.irs--flat .irs-min,.irs--flat .irs-max{top:0;padding:1px 3px;color:#999;font-size:10px;line-height:1.333;text-shadow:none;background-color:#e1e4e9;border-radius:4px}.irs--flat .irs-from,.irs--flat .irs-to,.irs--flat .irs-single{color:white;font-size:10px;line-height:1.333;text-shadow:none;padding:1px 5px;background-color:#ed5565;border-radius:4px}.irs--flat .irs-from:before,.irs--flat .irs-to:before,.irs--flat .irs-single:before{position:absolute;display:block;content:"";bottom:-6px;left:50%;width:0;height:0;margin-left:-3px;overflow:hidden;border:3px solid transparent;border-top-color:#ed5565}.irs--flat .irs-grid-pol{background-color:#e1e4e9}.irs--flat .irs-grid-text{color:#999}.irs--big{height:55px}.irs--big.irs-with-grid{height:70px}.irs--big .irs-line{top:33px;height:12px;background-color:white;background:linear-gradient(to bottom, #ddd -50%, white 150%);border:1px solid #ccc;border-radius:12px}.irs--big .irs-bar{top:33px;height:12px;background-color:#92bce0;border:1px solid #428bca;background:linear-gradient(to bottom, #ffffff 0%, #428bca 30%, #b9d4ec 100%);box-shadow:inset 0 0 1px 1px rgba(255,255,255,0.5)}.irs--big .irs-bar--single{border-radius:12px 0 0 12px}.irs--big .irs-shadow{height:1px;bottom:16px;background-color:rgba(66,139,202,0.5)}.irs--big .irs-handle{top:25px;width:30px;height:30px;border:1px solid rgba(0,0,0,0.3);background-color:#cbcfd5;background:linear-gradient(to bottom, white 0%, #B4B9BE 30%, white 100%);box-shadow:1px 1px 2px rgba(0,0,0,0.2),inset 0 0 3px 1px white;border-radius:30px}.irs--big .irs-handle.state_hover,.irs--big .irs-handle:hover{border-color:rgba(0,0,0,0.45);background-color:#939ba7;background:linear-gradient(to bottom, white 0%, #919BA5 30%, white 100%)}.irs--big .irs-min,.irs--big .irs-max{top:0;padding:1px 5px;color:white;text-shadow:none;background-color:#9f9f9f;border-radius:3px}.irs--big .irs-from,.irs--big .irs-to,.irs--big .irs-single{color:white;text-shadow:none;padding:1px 5px;background-color:#428bca;background:linear-gradient(to bottom, #428bca 0%, #3071a9 100%);border-radius:3px}.irs--big .irs-grid-pol{background-color:#428bca}.irs--big .irs-grid-text{color:#428bca}.irs--modern{height:55px}.irs--modern.irs-with-grid{height:55px}.irs--modern .irs-line{top:25px;height:5px;background-color:#d1d6e0;background:linear-gradient(to bottom, #e0e4ea 0%, #d1d6e0 100%);border:1px solid #a3adc1;border-bottom-width:0;border-radius:5px}.irs--modern .irs-bar{top:25px;heigLine truncated
|
||||
File diff suppressed because it is too large.
Load diff
+2
@@ -0,0 +1,2 @@
|
||||
// Ion.RangeSlider, 2.3.0, © Denis Ineshin, 2010 - 2018, IonDen.com, Build date: 2018-12-11 23:11:14
|
||||
!function(i){!jQuery&&"function"==typeof define&&define.amd?define(["jquery"],function(t){return i(t,document,window,navigator)}):jQuery||"object"!=typeof exports?i(jQuery,document,window,navigator):i(require("jquery"),document,window,navigator)}(function(a,c,l,t,_){"use strict";var i,s,o=0,e=(i=t.userAgent,s=/msie\s\d+/i,0<i.search(s)&&s.exec(i).toString().split(" ")[1]<9&&(a("html").addClass("lt-ie9"),!0));Function.prototype.bind||(Function.prototype.bind=function(o){var e=this,h=[].slice;if("function"!=typeof e)throw new TypeError;var r=h.call(arguments,1),n=function(){if(this instanceof n){var t=function(){};t.prototype=e.prototype;var i=new t,s=e.apply(i,r.concat(h.call(arguments)));return Object(s)===s?s:i}return e.apply(o,r.concat(h.call(arguments)))};return n}),Array.prototype.indexOf||(Array.prototype.indexOf=function(t,i){var s;if(null==this)throw new TypeError('"this" is null or not defined');var o=Object(this),e=o.length>>>0;if(0===e)return-1;var h=+i||0;if(Math.abs(h)===1/0&&(h=0),e<=h)return-1;for(s=Math.max(0<=h?h:e-Math.abs(h),0);s<e;){if(s in o&&o[s]===t)return s;s++}return-1});var h=function(t,i,s){this.VERSION="2.3.0",this.input=t,this.plugin_count=s,this.current_plugin=0,this.calc_count=0,this.update_tm=0,this.old_from=0,this.old_to=0,this.old_min_interval=null,this.raf_id=null,this.dragging=!1,this.force_redraw=!1,this.no_diapason=!1,this.has_tab_index=!0,this.is_key=!1,this.is_update=!1,this.is_start=!0,this.is_finish=!1,this.is_active=!1,this.is_resize=!1,this.is_click=!1,i=i||{},this.$cache={win:a(l),body:a(c.body),input:a(t),cont:null,rs:null,min:null,max:null,from:null,to:null,single:null,bar:null,line:null,s_single:null,s_from:null,s_to:null,shad_single:null,shad_from:null,shad_to:null,edge:null,grid:null,grid_labels:[]},this.coords={x_gap:0,x_pointer:0,w_rs:0,w_rs_old:0,w_handle:0,p_gap:0,p_gap_left:0,p_gap_right:0,p_step:0,p_pointer:0,p_handle:0,p_single_fake:0,p_single_real:0,p_from_fake:0,p_from_real:0,p_to_fake:0,p_to_real:0,p_bar_x:0,p_bar_w:0,grid_gap:0,big_num:0,big:[],big_w:[],big_p:[],big_x:[]},this.labels={w_min:0,w_max:0,w_from:0,w_to:0,w_single:0,p_min:0,p_max:0,p_from_fake:0,p_from_left:0,p_to_fake:0,p_to_left:0,p_single_fake:0,p_single_left:0};var o,e,h,r=this.$cache.input,n=r.prop("value");for(h in o={skin:"flat",type:"single",min:10,max:100,from:null,to:null,step:1,min_interval:0,max_interval:0,drag_interval:!1,values:[],p_values:[],from_fixed:!1,from_min:null,from_max:null,from_shadow:!1,to_fixed:!1,to_min:null,to_max:null,to_shadow:!1,prettify_enabled:!0,prettify_separator:" ",prettify:null,force_edges:!1,keyboard:!0,grid:!1,grid_margin:!0,grid_num:4,grid_snap:!1,hide_min_max:!1,hide_from_to:!1,prefix:"",postfix:"",max_postfix:"",decorate_both:!0,values_separator:" — ",input_values_separator:";",disable:!1,block:!1,extra_classes:"",scope:null,onStart:null,onChange:null,onFinish:null,onUpdate:null},"INPUT"!==r[0].nodeName&&console&&console.warn&&console.warn("Base element should be <input>!",r[0]),(e={skin:r.data("skin"),type:r.data("type"),min:r.data("min"),max:r.data("max"),from:r.data("from"),to:r.data("to"),step:r.data("step"),min_interval:r.data("minInterval"),max_interval:r.data("maxInterval"),drag_interval:r.data("dragInterval"),values:r.data("values"),from_fixed:r.data("fromFixed"),from_min:r.data("fromMin"),from_max:r.data("fromMax"),from_shadow:r.data("fromShadow"),to_fixed:r.data("toFixed"),to_min:r.data("toMin"),to_max:r.data("toMax"),to_shadow:r.data("toShadow"),prettify_enabled:r.data("prettifyEnabled"),prettify_separator:r.data("prettifySeparator"),force_edges:r.data("forceEdges"),keyboard:r.data("keyboard"),grid:r.data("grid"),grid_margin:r.data("gridMargin"),grid_num:r.data("gridNum"),grid_snap:r.data("gridSnap"),hide_min_max:r.data("hideMinMax"),hide_from_to:r.data("hideFromTo"),prefix:r.data("prefix"),postfix:r.data("postfix"),max_postfix:r.data("maxPostfix"),decorate_both:r.data("decorateBoth"),values_separator:r.data("valuesSeparator"),input_values_separator:r.data("inputValuesSeparator"),disable:r.data("disable"),block:r.data("block"),extra_classes:r.data("extraClasses")}).values=e.values&&e.values.split(","),e)e.hasOwnProperty(h)&&(e[h]!==_&&""!==e[h]||delete e[h]);n!==_&&""!==n&&((n=n.split(e.input_values_separator||i.input_values_separator||";"))[0]&&n[0]==+n[0]&&(n[0]=+n[0]),n[1]&&n[1]==+n[1]&&(n[1]=+n[1]),i&&i.values&&i.values.length?(o.from=n[0]&&i.values.indexOf(n[0]),o.to=n[1]&&i.values.indexOf(n[1])):(o.from=n[0]&&+n[0],o.to=n[1]&&+n[1])),a.extend(o,i),a.extend(o,e),this.options=o,this.update_check={},this.validate(),this.result={input:this.$cache.input,slider:null,min:this.options.min,max:this.options.max,from:this.options.from,from_percent:0,from_value:null,to:this.options.to,to_percent:0,to_value:null},this.init()};h.prototype={init:function(t){this.no_diapason=!1,this.coords.p_step=this.convertToPercent(this.options.step,!0),this.target="base",this.toggleInput(),this.append(),this.setMinMax(),t?(this.force_redraw=!0,this.calcLine truncated
|
||||
@@ -0,0 +1,145 @@
|
||||
@import (reference) "_mixins";
|
||||
|
||||
.irs {
|
||||
.pos-r();
|
||||
-webkit-touch-callout: none;
|
||||
.no-click();
|
||||
font-size: 12px;
|
||||
font-family: Arial, sans-serif;
|
||||
|
||||
&-line {
|
||||
.pos-r();
|
||||
overflow: hidden;
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
&-bar {
|
||||
.pos-a();
|
||||
left: 0;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
&-shadow {
|
||||
position: absolute;
|
||||
display: none;
|
||||
left: 0;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
&-handle {
|
||||
.pos-a();
|
||||
box-sizing: border-box;
|
||||
cursor: default;
|
||||
z-index: 1;
|
||||
|
||||
&.single,
|
||||
&.from,
|
||||
&.to {}
|
||||
|
||||
&.type_last {
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
|
||||
&-min,
|
||||
&-max {
|
||||
.pos-a();
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
&-min {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
&-max {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
&-from,
|
||||
&-to,
|
||||
&-single {
|
||||
.pos-a();
|
||||
top: 0;
|
||||
left: 0;
|
||||
cursor: default;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&-grid {
|
||||
position: absolute;
|
||||
display: none;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
|
||||
.irs-with-grid & {
|
||||
display: block;
|
||||
}
|
||||
|
||||
&-pol {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 1px;
|
||||
height: 8px;
|
||||
background: #000;
|
||||
|
||||
&.small {
|
||||
height: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
&-text {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
line-height: 9px;
|
||||
padding: 0 3px;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
&-disable-mask {
|
||||
.pos-a();
|
||||
top: 0;
|
||||
left: -1%;
|
||||
width: 102%;
|
||||
height: 100%;
|
||||
cursor: default;
|
||||
background: rgba(0,0,0,0.0);
|
||||
z-index: 2;
|
||||
|
||||
.lt-ie9 & {
|
||||
background: #000;
|
||||
filter: alpha(opacity=0);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
||||
&-disabled {
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
&-hidden-input {
|
||||
position: absolute !important;
|
||||
display: block !important;
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
font-size: 0 !important;
|
||||
line-height: 0 !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
overflow: hidden;
|
||||
outline: none !important;
|
||||
z-index: -9999 !important;
|
||||
background: none !important;
|
||||
border-style: solid !important;
|
||||
border-color: transparent !important;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
.no-click () {
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.pos-r () {
|
||||
position: relative;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.pos-a () {
|
||||
position: absolute;
|
||||
display: block;
|
||||
}
|
||||
@@ -0,0 +1,10 @@
|
||||
// Base styles
|
||||
@import "_base";
|
||||
|
||||
// Skins styles
|
||||
@import "skins/flat";
|
||||
@import "skins/big";
|
||||
@import "skins/modern";
|
||||
@import "skins/sharp";
|
||||
@import "skins/round";
|
||||
@import "skins/square";
|
||||
@@ -0,0 +1,109 @@
|
||||
.irs--big {
|
||||
@name: irs;
|
||||
|
||||
@top: 33px;
|
||||
@bottom: 16px;
|
||||
@line_height: 12px;
|
||||
@handle_width: 30px;
|
||||
@handle_height: 30px;
|
||||
@custom_radius: 3px;
|
||||
|
||||
@line_color_1: white;
|
||||
@line_color_2: #ccc;
|
||||
@line_color_3: #ddd;
|
||||
@bar_color: #428bca;
|
||||
@handle_color_1: #cbcfd5;
|
||||
@handle_color_2: #B4B9BE;
|
||||
@handle_color_3: white;
|
||||
@handle_color_4: #919BA5;
|
||||
@minmax_text_color: white;
|
||||
@minmax_bg_color: #9f9f9f;
|
||||
@label_color_1: #428bca;
|
||||
@label_color_2: white;
|
||||
@grid_color_1: #428bca;
|
||||
|
||||
|
||||
|
||||
height: 55px;
|
||||
|
||||
&.irs-with-grid {
|
||||
height: 70px;
|
||||
}
|
||||
|
||||
.@{name}-line {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background-color: @line_color_1;
|
||||
background: linear-gradient(to bottom, @line_color_3 -50%, @line_color_1 150%);
|
||||
border: 1px solid @line_color_2;
|
||||
border-radius: @line_height;
|
||||
}
|
||||
|
||||
.@{name}-bar {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background-color: lighten(@bar_color, 20%);
|
||||
border: 1px solid @bar_color;
|
||||
background: linear-gradient(to bottom, lighten(@bar_color, 70%) 0%, @bar_color 30%, lighten(@bar_color, 30%) 100%);
|
||||
box-shadow: inset 0 0 1px 1px rgba(255,255,255,0.5);
|
||||
|
||||
&--single {
|
||||
border-radius: @line_height 0 0 @line_height;
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-shadow {
|
||||
height: 1px;
|
||||
bottom: @bottom;
|
||||
background-color: fade(@bar_color, 50%);
|
||||
}
|
||||
|
||||
.@{name}-handle {
|
||||
top: 25px;
|
||||
width: @handle_width;
|
||||
height: @handle_height;
|
||||
border: 1px solid rgba(0,0,0,0.3);
|
||||
background-color: @handle_color_1;
|
||||
background: linear-gradient(to bottom, @handle_color_3 0%, @handle_color_2 30%, @handle_color_3 100%);
|
||||
box-shadow: 1px 1px 2px rgba(0,0,0,0.2), inset 0 0 3px 1px @handle_color_3;
|
||||
border-radius: @handle_width;
|
||||
|
||||
&.state_hover,
|
||||
&:hover {
|
||||
border-color: rgba(0,0,0,0.45);
|
||||
background-color: darken(@handle_color_1, 20%);
|
||||
background: linear-gradient(to bottom, @handle_color_3 0%, @handle_color_4 30%, @handle_color_3 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-min,
|
||||
.@{name}-max {
|
||||
top: 0;
|
||||
padding: 1px 5px;
|
||||
color: @minmax_text_color;
|
||||
text-shadow: none;
|
||||
background-color: @minmax_bg_color;
|
||||
border-radius: @custom_radius;
|
||||
}
|
||||
|
||||
.@{name}-from,
|
||||
.@{name}-to,
|
||||
.@{name}-single {
|
||||
color: @label_color_2;
|
||||
text-shadow: none;
|
||||
padding: 1px 5px;
|
||||
background-color: @label_color_1;
|
||||
background: linear-gradient(to bottom, @label_color_1 0%, darken(@label_color_1, 10%) 100%);
|
||||
border-radius: @custom_radius;
|
||||
}
|
||||
|
||||
.@{name}-grid {
|
||||
&-pol {
|
||||
background-color: @grid_color_1;
|
||||
}
|
||||
|
||||
&-text {
|
||||
color: @grid_color_1;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,125 @@
|
||||
.irs--flat {
|
||||
@name: irs;
|
||||
|
||||
@top: 25px;
|
||||
@bottom: 16px;
|
||||
@line_height: 12px;
|
||||
@handle_width: 16px;
|
||||
@handle_height: 18px;
|
||||
@custom_radius: 4px;
|
||||
|
||||
@line_color: #e1e4e9;
|
||||
@bar_color: #ed5565;
|
||||
@handle_color_1: #da4453;
|
||||
@handle_color_2: #a43540;
|
||||
@minmax_text_color: #999;
|
||||
@minmax_bg_color: #e1e4e9;
|
||||
@label_color_1: #ed5565;
|
||||
@label_color_2: white;
|
||||
@grid_color_1: #e1e4e9;
|
||||
@grid_color_2: #999;
|
||||
|
||||
|
||||
|
||||
height: 40px;
|
||||
|
||||
&.irs-with-grid {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.@{name}-line {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background-color: @line_color;
|
||||
border-radius: @custom_radius;
|
||||
}
|
||||
|
||||
.@{name}-bar {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background-color: @bar_color;
|
||||
|
||||
&--single {
|
||||
border-radius: @custom_radius 0 0 @custom_radius;
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-shadow {
|
||||
height: 1px;
|
||||
bottom: @bottom;
|
||||
background-color: @line_color;
|
||||
}
|
||||
|
||||
.@{name}-handle {
|
||||
top: 22px;
|
||||
width: @handle_width;
|
||||
height: @handle_height;
|
||||
background-color: transparent;
|
||||
|
||||
& > i:first-child {
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
margin-left: -1px;
|
||||
background-color: @handle_color_1;
|
||||
}
|
||||
|
||||
&.state_hover,
|
||||
&:hover {
|
||||
& > i:first-child {
|
||||
background-color: @handle_color_2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-min,
|
||||
.@{name}-max {
|
||||
top: 0;
|
||||
padding: 1px 3px;
|
||||
color: @minmax_text_color;
|
||||
font-size: 10px;
|
||||
line-height: 1.333;
|
||||
text-shadow: none;
|
||||
background-color: @minmax_bg_color;
|
||||
border-radius: @custom_radius;
|
||||
}
|
||||
|
||||
.@{name}-from,
|
||||
.@{name}-to,
|
||||
.@{name}-single {
|
||||
color: @label_color_2;
|
||||
font-size: 10px;
|
||||
line-height: 1.333;
|
||||
text-shadow: none;
|
||||
padding: 1px 5px;
|
||||
background-color: @label_color_1;
|
||||
border-radius: @custom_radius;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
display: block;
|
||||
content: "";
|
||||
bottom: -6px;
|
||||
left: 50%;
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin-left: -3px;
|
||||
overflow: hidden;
|
||||
border: 3px solid transparent;
|
||||
border-top-color: @label_color_1;
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-grid {
|
||||
&-pol {
|
||||
background-color: @grid_color_1;
|
||||
}
|
||||
|
||||
&-text {
|
||||
color: @grid_color_2;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,165 @@
|
||||
.irs--modern {
|
||||
@name: irs;
|
||||
|
||||
@top: 25px;
|
||||
@bottom: 21px;
|
||||
@line_height: 5px;
|
||||
@handle_width: 12px;
|
||||
@handle_height: 13px;
|
||||
|
||||
@line_color: #d1d6e0;
|
||||
@bar_color: #20b426;
|
||||
@handle_color_1: #e9e6e6;
|
||||
@handle_color_2: white;
|
||||
@handle_color_3: black;
|
||||
@minmax_text_color: white;
|
||||
@minmax_bg_color: #d1d6e0;
|
||||
@label_color_1: #20b426;
|
||||
@label_color_2: white;
|
||||
@grid_color_1: #dedede;
|
||||
@grid_color_2: silver;
|
||||
|
||||
|
||||
|
||||
height: 55px;
|
||||
|
||||
&.irs-with-grid {
|
||||
height: 55px;
|
||||
}
|
||||
|
||||
.@{name}-line {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background-color: @line_color;
|
||||
background: linear-gradient(to bottom, lighten(@line_color, 5%) 0%, @line_color 100%);
|
||||
border: 1px solid darken(@line_color, 15%);
|
||||
border-bottom-width: 0;
|
||||
border-radius: @line_height;
|
||||
}
|
||||
|
||||
.@{name}-bar {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background: @bar_color;
|
||||
background: linear-gradient(to bottom, @bar_color 0%, darken(@bar_color, 10%) 100%);
|
||||
|
||||
&--single {
|
||||
border-radius: @line_height 0 0 @line_height;
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-shadow {
|
||||
height: 1px;
|
||||
bottom: @bottom;
|
||||
background-color: fade(@line_color, 50%);
|
||||
}
|
||||
|
||||
.@{name}-handle {
|
||||
top: 37px;
|
||||
width: @handle_width;
|
||||
height: @handle_height;
|
||||
border: 1px solid darken(@line_color, 15%);
|
||||
border-top-width: 0;
|
||||
box-shadow: 1px 1px 1px rgba(0,0,0,0.1);
|
||||
border-radius: 0 0 3px 3px;
|
||||
|
||||
& > i:nth-child(1) {
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: -4px; left: 1px;
|
||||
width: (@handle_width - 6px);
|
||||
height: (@handle_width - 6px);
|
||||
border: 1px solid darken(@line_color, 15%);
|
||||
background: @handle_color_2;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
& > i:nth-child(2) {
|
||||
position: absolute;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
top: 0; left: 0;
|
||||
width: (@handle_width - 2);
|
||||
height: (@handle_height - 1);
|
||||
background: @handle_color_1;
|
||||
background: linear-gradient(to bottom, @handle_color_2 0%, @handle_color_1 100%);
|
||||
border-radius: 0 0 3px 3px;
|
||||
}
|
||||
|
||||
& > i:nth-child(3) {
|
||||
position: absolute;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
top: 3px; left: 3px;
|
||||
width: 4px; height: 5px;
|
||||
border-left: 1px solid darken(@line_color, 15%);
|
||||
border-right: 1px solid darken(@line_color, 15%);
|
||||
}
|
||||
|
||||
&.state_hover,
|
||||
&:hover {
|
||||
border-color: darken(@line_color, 30%);
|
||||
background: #c3c7cd;
|
||||
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(145,155,165,1) 30%,rgba(255,255,255,1) 100%);
|
||||
|
||||
& > i:nth-child(1) {
|
||||
border-color: darken(@line_color, 30%);
|
||||
}
|
||||
|
||||
& > i:nth-child(3) {
|
||||
border-color: darken(@line_color, 50%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-min,
|
||||
.@{name}-max {
|
||||
top: 0;
|
||||
font-size: 10px;
|
||||
line-height: 1.333;
|
||||
text-shadow: none;
|
||||
padding: 1px 5px;
|
||||
color: @minmax_text_color;
|
||||
background-color: @minmax_bg_color;
|
||||
border-radius: @line_height;
|
||||
}
|
||||
|
||||
.@{name}-from,
|
||||
.@{name}-to,
|
||||
.@{name}-single {
|
||||
font-size: 10px;
|
||||
line-height: 1.333;
|
||||
text-shadow: none;
|
||||
padding: 1px 5px;
|
||||
background-color: @label_color_1;
|
||||
color: @label_color_2;
|
||||
border-radius: @line_height;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
display: block;
|
||||
content: "";
|
||||
bottom: -6px;
|
||||
left: 50%;
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin-left: -3px;
|
||||
overflow: hidden;
|
||||
border: 3px solid transparent;
|
||||
border-top-color: @label_color_1;
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-grid {
|
||||
height: 25px;
|
||||
|
||||
&-pol {
|
||||
background-color: @grid_color_1;
|
||||
}
|
||||
|
||||
&-text {
|
||||
color: @grid_color_2;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,120 @@
|
||||
// Skin design by Veaceslav Grimalschi
|
||||
// https://github.com/grimalschi
|
||||
|
||||
.irs--round {
|
||||
@name: irs;
|
||||
|
||||
@top: 36px;
|
||||
@bottom: 21px;
|
||||
@line_height: 4px;
|
||||
@handle_width: 24px;
|
||||
@handle_height: 24px;
|
||||
|
||||
@line_color: #dee4ec;
|
||||
@bar_color: #006cfa;
|
||||
@handle_color_1: #006cfa;
|
||||
@handle_color_2: white;
|
||||
@handle_color_3: #f0f6ff;
|
||||
@minmax_text_color: #333;
|
||||
@minmax_bg_color: rgba(0,0,0,0.1);
|
||||
@label_color_1: #006cfa;
|
||||
@label_color_2: white;
|
||||
@grid_color_1: #dedede;
|
||||
@grid_color_2: silver;
|
||||
|
||||
|
||||
|
||||
height: 50px;
|
||||
|
||||
&.irs-with-grid {
|
||||
height: 65px;
|
||||
}
|
||||
|
||||
.@{name}-line {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background-color: @line_color;
|
||||
border-radius: @line_height;
|
||||
}
|
||||
|
||||
.@{name}-bar {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background-color: @bar_color;
|
||||
|
||||
&--single {
|
||||
border-radius: @line_height 0 0 @line_height;
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-shadow {
|
||||
height: 4px;
|
||||
bottom: @bottom;
|
||||
background-color: fade(@line_color, 50%);
|
||||
}
|
||||
|
||||
.@{name}-handle {
|
||||
top: 26px;
|
||||
width: @handle_width;
|
||||
height: @handle_height;
|
||||
border: 4px solid @handle_color_1;
|
||||
background-color: @handle_color_2;
|
||||
border-radius: @handle_width;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 255, 0.3);
|
||||
|
||||
&.state_hover,
|
||||
&:hover {
|
||||
background-color: @handle_color_3;
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-min,
|
||||
.@{name}-max {
|
||||
color: @minmax_text_color;
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
top: 0;
|
||||
padding: 3px 5px;
|
||||
background-color: @minmax_bg_color;
|
||||
border-radius: @line_height;
|
||||
}
|
||||
|
||||
.@{name}-from,
|
||||
.@{name}-to,
|
||||
.@{name}-single {
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
text-shadow: none;
|
||||
padding: 3px 5px;
|
||||
background-color: @label_color_1;
|
||||
color: @label_color_2;
|
||||
border-radius: @line_height;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
display: block;
|
||||
content: "";
|
||||
bottom: -6px;
|
||||
left: 50%;
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin-left: -3px;
|
||||
overflow: hidden;
|
||||
border: 3px solid transparent;
|
||||
border-top-color: @label_color_1;
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-grid {
|
||||
height: 25px;
|
||||
|
||||
&-pol {
|
||||
background-color: @grid_color_1;
|
||||
}
|
||||
|
||||
&-text {
|
||||
color: @grid_color_2;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,132 @@
|
||||
.irs--sharp {
|
||||
@name: irs;
|
||||
|
||||
@top: 30px;
|
||||
@bottom: 21px;
|
||||
@line_height: 2px;
|
||||
@handle_width: 10px;
|
||||
@handle_height: 10px;
|
||||
|
||||
@line_color: black;
|
||||
@bar_color: #ee22fa;
|
||||
@handle_color_1: darken(#ee22fa, 20%);
|
||||
@handle_color_2: white;
|
||||
@handle_color_3: black;
|
||||
@minmax_text_color: white;
|
||||
@minmax_bg_color: darken(#ee22fa, 20%);
|
||||
@label_color_1: darken(#ee22fa, 20%);
|
||||
@label_color_2: white;
|
||||
@grid_color_1: #dedede;
|
||||
@grid_color_2: silver;
|
||||
|
||||
|
||||
|
||||
height: 50px;
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
|
||||
&.irs-with-grid {
|
||||
height: 57px;
|
||||
}
|
||||
|
||||
.@{name}-line {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background-color: @line_color;
|
||||
border-radius: @line_height;
|
||||
}
|
||||
|
||||
.@{name}-bar {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background-color: @bar_color;
|
||||
|
||||
&--single {
|
||||
border-radius: @line_height 0 0 @line_height;
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-shadow {
|
||||
height: 1px;
|
||||
bottom: @bottom;
|
||||
background-color: fade(@line_color, 50%);
|
||||
}
|
||||
|
||||
.@{name}-handle {
|
||||
top: (@top - 5px);
|
||||
width: @handle_width;
|
||||
height: @handle_height;
|
||||
background-color: @handle_color_1;
|
||||
|
||||
& > i:first-child {
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border: 5px solid transparent;
|
||||
border-top-color: @handle_color_1;
|
||||
}
|
||||
|
||||
&.state_hover,
|
||||
&:hover {
|
||||
background-color: @handle_color_3;
|
||||
|
||||
& > i:first-child {
|
||||
border-top-color: @handle_color_3;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-min,
|
||||
.@{name}-max {
|
||||
color: @minmax_text_color;
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
top: 0;
|
||||
padding: 3px 4px;
|
||||
opacity: 0.4;
|
||||
background-color: @minmax_bg_color;
|
||||
border-radius: @line_height;
|
||||
}
|
||||
|
||||
.@{name}-from,
|
||||
.@{name}-to,
|
||||
.@{name}-single {
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
text-shadow: none;
|
||||
padding: 3px 4px;
|
||||
background-color: @label_color_1;
|
||||
color: @label_color_2;
|
||||
border-radius: @line_height;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
display: block;
|
||||
content: "";
|
||||
bottom: -6px;
|
||||
left: 50%;
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin-left: -3px;
|
||||
overflow: hidden;
|
||||
border: 3px solid transparent;
|
||||
border-top-color: @label_color_1;
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-grid {
|
||||
height: 25px;
|
||||
|
||||
&-pol {
|
||||
background-color: @grid_color_1;
|
||||
}
|
||||
|
||||
&-text {
|
||||
color: @grid_color_2;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,100 @@
|
||||
// Skin design by Veaceslav Grimalschi
|
||||
// https://github.com/grimalschi
|
||||
|
||||
.irs--square {
|
||||
@name: irs;
|
||||
|
||||
@top: 31px;
|
||||
@bottom: 21px;
|
||||
@line_height: 4px;
|
||||
@handle_width: 16px;
|
||||
@handle_height: 16px;
|
||||
|
||||
@line_color: #dedede;
|
||||
@bar_color: black;
|
||||
@handle_color_1: black;
|
||||
@handle_color_2: white;
|
||||
@handle_color_3: #f0f6ff;
|
||||
@minmax_text_color: #333;
|
||||
@minmax_bg_color: rgba(0,0,0,0.1);
|
||||
@label_color_1: black;
|
||||
@label_color_2: white;
|
||||
@grid_color_1: #dedede;
|
||||
@grid_color_2: silver;
|
||||
|
||||
|
||||
|
||||
height: 50px;
|
||||
|
||||
&.irs-with-grid {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.@{name}-line {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background-color: @line_color;
|
||||
}
|
||||
|
||||
.@{name}-bar {
|
||||
top: @top;
|
||||
height: @line_height;
|
||||
background-color: @bar_color;
|
||||
}
|
||||
|
||||
.@{name}-shadow {
|
||||
height: 2px;
|
||||
bottom: @bottom;
|
||||
background-color: @line_color;
|
||||
}
|
||||
|
||||
.@{name}-handle {
|
||||
top: (@top - 6px);
|
||||
width: @handle_width;
|
||||
height: @handle_height;
|
||||
border: 3px solid @handle_color_1;
|
||||
background-color: @handle_color_2;
|
||||
-webkit-transform: rotate(45deg);
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
|
||||
&.state_hover,
|
||||
&:hover {
|
||||
background-color: @handle_color_3;
|
||||
}
|
||||
}
|
||||
|
||||
.@{name}-min,
|
||||
.@{name}-max {
|
||||
color: @minmax_text_color;
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
top: 0;
|
||||
padding: 3px 5px;
|
||||
background-color: @minmax_bg_color;
|
||||
}
|
||||
|
||||
.@{name}-from,
|
||||
.@{name}-to,
|
||||
.@{name}-single {
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
text-shadow: none;
|
||||
padding: 3px 5px;
|
||||
background-color: @label_color_1;
|
||||
color: @label_color_2;
|
||||
}
|
||||
|
||||
.@{name}-grid {
|
||||
height: 25px;
|
||||
|
||||
&-pol {
|
||||
background-color: @grid_color_1;
|
||||
}
|
||||
|
||||
&-text {
|
||||
color: @grid_color_2;
|
||||
font-size: 11px;
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user