stremio-web/src/common/Slider/styles.less
NikolaBorislavovHristov d2e27801d9 Slider styles refactored
2019-04-19 14:50:38 +03:00

71 lines
No EOL
1.5 KiB
Text

.slider-container {
display: inline-block;
position: relative;
z-index: 0;
cursor: pointer;
&.horizontal {
.track {
top: calc(50% - var(--track-size) * 0.5);
right: 0;
left: 0;
height: var(--track-size);
}
.track-before {
top: calc(50% - var(--track-size) * 0.5);
left: 0;
height: var(--track-size);
}
.thumb {
top: calc(50% - var(--thumb-size) * 0.5);
transform: translateX(-50%);
}
}
&.vertical {
.track {
top: 0;
bottom: 0;
left: calc(50% - var(--track-size) * 0.1);
width: var(--track-size);
}
.track-before {
bottom: 0;
left: calc(50% - var(--track-size) * 0.1);
width: var(--track-size);
}
.thumb {
left: calc(50% - var(--thumb-size) * 0.5);
transform: translateY(50%);
}
}
&:global(.disabled) {
pointer-events: none;
}
.track {
position: absolute;
z-index: 1;
background-color: var(--track-color);
}
.track-before {
position: absolute;
z-index: 2;
background-color: var(--track-before-color);
}
.thumb {
position: absolute;
z-index: 3;
width: var(--thumb-size);
height: var(--thumb-size);
border-radius: 50%;
background-color: var(--thumb-color);
}
}