<div class="c-rangeslider ">
<div class="c-rangeslider__exp-values">
<span class="label">Partenza: </span>
<span class="number" id="leftvalue"></span>
<span class="number" id="rightvalue"></span>
</div>
<div class="c-rangeslider__item">
<div id="slider"></div>
</div>
</div>
<div class="c-rangeslider {{ modifier }}">
<div class="c-rangeslider__exp-values">
{{#if value}}
<span class="label">{{ value.label }}: </span>
<span class="number" id="{{ value.left-nr-id }}"></span>
<span class="number" id="{{ value.right-nr-id }}"></span>
{{/if}}
</div>
<div class="c-rangeslider__item">
<div id="{{ id }}"></div>
</div>
</div>
{
"id": "slider",
"value": {
"label": "Partenza",
"left-nr-id": "leftvalue",
"right-nr-id": "rightvalue"
}
}
.c-rangeslider + .c-rangeslider {
margin-top: remify(32px);
}
.c-rangeslider__item {
margin-block: remify(16px);
}
.c-rangeslider__exp-values {
@include font-scale(level-2);
}
.c-rangeslider__exp-values .label {
font-weight: fw(semibold);
color: secondary(text, 100);
}
.c-rangeslider__exp-values .number {
color: primary(sky, 120);
}
.c-rangeslider__exp-values .number:last-child {
&::before {
content: " - ";
color: secondary(text, 100);
}
}
No notes defined.