37 lines
486 B
Text
37 lines
486 B
Text
|
x-range {
|
||
|
|
width: 144px;
|
||
|
|
height: 16px;
|
||
|
|
position: relative;
|
||
|
|
|
||
|
|
--thumb: 6px;
|
||
|
|
--track: 4px;
|
||
|
|
padding: 0 var(--thumb);
|
||
|
|
|
||
|
|
.-track, .-elapsed {
|
||
|
|
position: absolute;
|
||
|
|
top: calc(50% - var(--track)/2);
|
||
|
|
height: var(--track);
|
||
|
|
left: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.-track {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.-elapsed {
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.-thumb {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
|
||
|
|
border-radius: 50%;
|
||
|
|
width: calc(2*var(--thumb));
|
||
|
|
height: calc(2*var(--thumb));
|
||
|
|
background-color: #fff;
|
||
|
|
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
}
|
||
|
|
}
|