Custom Slider Components
Range Sliders
<![CDATA[
<div class="slider-container">
<label class="slider-label">
Normal Slider
<span class="slider-value">50</span>
</label>
<input type="range" min="0" max="100" value="50" class="slider" id="normal-slider">
</div>
]]>
Count Range Sliders
<![CDATA[
<div class="slider-container mt-4">
<label class="slider-label">
Range Slider
<span class="slider-value">50</span>
</label>
<input type="range" min="10" max="100" value="50" class="slider" id="range-slider">
<div class="slider-minmax">
<span>10</span>
<span>100</span>
</div>
</div>
]]>
Disabled Range Sliders
<![CDATA[
<div class="slider-container mt-4 disabled">
<label class="slider-label">
Disabled Slider
<span class="slider-value">30</span>
</label>
<input type="range" min="0" max="100" value="30" class="slider" disabled>
</div>
]]>