mirror/rio
1
0
Fork 0
mirror of https://github.com/rio-labs/rio.git synced 2026-05-04 18:09:26 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix slider values positioning

Browse Source
This commit is contained in:
Aran-Fey
2024-06-15 16:43:32 +02:00
committed by Jakob Pinterits
parent 8ea4920cad
commit 82efda0b6a
2 changed files with 8 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/code/components/slider.ts
+7 -5
View File
@@ -25,11 +25,13 @@ export class SliderComponent extends ComponentBase {
let element = document.createElement('div');
element.classList.add('rio-slider');
element.innerHTML = `
<div class="rio-slider-inner">
<div class="rio-slider-track"></div>
<div class="rio-slider-fill"></div>
<div class="rio-slider-glow"></div>
<div class="rio-slider-knob"></div>
<div class="rio-slider-column">
<div class="rio-slider-inner">
<div class="rio-slider-track"></div>
<div class="rio-slider-fill"></div>
<div class="rio-slider-glow"></div>
<div class="rio-slider-knob"></div>
</div>
<div class="rio-slider-values">
<div class="rio-slider-min-value"></div>
<div class="rio-slider-max-value"></div>
frontend/css/style.scss
+1 -23
View File
@@ -1186,36 +1186,14 @@ $rio-input-box-text-distance-from-bottom: 0.4rem; // To be aligned with the <inp
}
.rio-slider-values {
<<<<<<< HEAD
display: flex;
justify-content: space-between;
margin-top: 0.1rem;
font-size: 0.8rem;
=======
width: 100%;
display: flex;
justify-content: space-between;
margin-top: 0.8rem;
}
.rio-slider-min-value,
.rio-slider-max-value {
font-size: 0.8rem;
}
.rio-slider-current-value {
position: absolute;
bottom: 100%;
left: 50%;
transform: translate(-50%, -150%);
font-size: 1 rem;
font-weight: bold;
color: var(
--rio-local-level-2-bg
); /* Use the same color variable as the knob */
>>>>>>> 079429c (Added show_values to the slider component)
}
// Slideshow