dandri/meshcore-analyzer
1
0
Fork 0
mirror of https://github.com/Kpa-clawbot/meshcore-analyzer.git synced 2026-05-15 04:55:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

mobile VCR: proper two-row layout — controls+scope+LCD row, full-width timeline row, no horizontal scroll

Browse Source
This commit is contained in:
you
2026-03-19 23:49:06 +00:00
parent a13608fcef
commit 52dde28a70
2 changed files with 20 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/index.html
+1 -1
View File
@@ -22,7 +22,7 @@
<meta name="twitter:image" content="https://raw.githubusercontent.com/Kpa-clawbot/meshcore-analyzer/master/public/og-image.png">
<link rel="stylesheet" href="style.css?v=1773963867">
<link rel="stylesheet" href="home.css">
<link rel="stylesheet" href="live.css?v=1773964063">
<link rel="stylesheet" href="live.css?v=1773964146">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
crossorigin="anonymous">
public/live.css
+19 -8
View File
@@ -619,14 +619,25 @@
/* Mobile VCR */
@media (max-width: 640px) {
.vcr-bar { padding: 4px 6px; overflow-x: auto; overflow-y: hidden; flex-wrap: nowrap; }
.vcr-btn { padding: 6px 8px; font-size: 0.8rem; min-height: 44px; min-width: 44px; }
.vcr-scope-btns { gap: 1px; }
.vcr-scope-btn { font-size: 0.65rem; padding: 4px 6px; min-height: 36px; }
.vcr-lcd { display: flex; }
.vcr-mode { font-size: 0.65rem; padding: 2px 6px; }
.vcr-timeline-container { min-width: 60px; }
.vcr-prompt { font-size: 0.7rem; }
/* Mobile VCR: two-row stacked layout */
.vcr-bar {
padding: 4px 8px;
flex-wrap: wrap;
gap: 4px;
overflow: visible;
}
/* Row 1: controls + scope + LCD, all in one line */
.vcr-controls { order: 1; flex-shrink: 0; gap: 4px; }
.vcr-scope-btns { order: 2; flex-shrink: 0; gap: 1px; }
.vcr-lcd { order: 3; display: flex; margin-left: auto; min-width: 90px; padding: 2px 6px; }
.vcr-lcd-canvas { width: 100px; height: 22px; }
.vcr-mode { display: none; }
/* Row 2: timeline takes full width */
.vcr-timeline-container { order: 4; width: 100%; flex: none; height: 20px; }
/* Smaller buttons */
.vcr-btn { padding: 4px 8px; font-size: 0.75rem; min-height: 32px; min-width: 32px; }
.vcr-scope-btn { font-size: 0.6rem; padding: 2px 6px; min-height: 28px; }
.vcr-prompt { order: 5; width: 100%; font-size: 0.7rem; }
}
/* Timeline time tooltip */