quoije/yaris-obd
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: timeline max-speed tick as up-arrow + 'Max speed' label

Browse Source 
Replace the circle dot on the scrubber with a small up-pointing arrow just
below the line and a 'Max speed' text label.
This commit is contained in:
Mathieu Moran
2026-08-15 18:05:38 -04:00
parent 7d6dd28680
commit 0072322bc2
3 changed files with 32 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
server/templates/history.html
+5 -2
View File
@@ -67,14 +67,17 @@
data-tile-attrib="&copy; <a href='https://www.openstreetmap.org/copyright'>OpenStreetMap</a> contributors &copy; <a href='https://carto.com/attributions'>CARTO</a>"
data-min-zoom="3" data-max-zoom="19"></div>
<div id="trip-timeline" class="border-top p-3" hidden>
<div class="d-flex align-items-center gap-3">
<div class="d-flex align-items-center gap-3 mb-2">
<button id="trip-play" class="btn btn-primary btn-sm" type="button" aria-label="Play">
<i class="fas fa-play" aria-hidden="true"></i>
</button>
<div class="position-relative flex-grow-1">
<input id="trip-scrubber" class="form-range w-100" type="range"
min="0" max="0" value="0" aria-label="Trip replay timeline">
<div id="trip-max-tick" class="trip-max-tick" title="Max speed" hidden></div>
<div id="trip-max-tick" class="trip-max-tick" title="Max speed" hidden>
<span class="trip-max-tick-arrow" aria-hidden="true"></span>
<span class="trip-max-tick-label">Max speed</span>
</div>
</div>
</div>
<div class="d-flex flex-wrap justify-content-between gap-2 small mt-2">