UI: main/draft menu separation, ghost node indicator

This commit is contained in:
Evan Scamehorn
2025-12-04 14:28:53 -06:00
parent f3cb583836
commit 04167c656a
5 changed files with 174 additions and 102 deletions

View File

@@ -50,24 +50,35 @@
</select>
</div>
<div class="section">
<h3>Current Draft</h3>
<div class="stat-row"><span>Length:</span> <span id="current-length">0 m</span></div>
<div class="stat-row"><span>Cost:</span> <span id="current-cost" style="color:#ef4444">$0</span></div>
<div class="stat-row"><span>Est. Riders:</span> <span id="current-riders" style="color:#10B981">0 / day</span>
</div>
<div class="button-row">
<button id="btn-save" class="primary">Build Route</button>
<button id="btn-discard" class="danger">Discard</button>
<div id="ui-main-menu">
<div class="section">
<button id="btn-create-route" class="primary"
style="width:100%; padding: 12px; margin-bottom: 15px; font-weight:bold;">
+ Create New Route
</button>
<h3>Active Routes</h3>
<ul id="route-list"></ul>
</div>
</div>
<div class="section">
<h3>Active Routes</h3>
<ul id="route-list"></ul>
<!-- DRAFTING STATE (Hidden by default) -->
<div id="ui-draft-menu" style="display:none;">
<div class="section" style="border: 2px solid #2563EB; padding: 10px; border-radius: 6px; background: #eff6ff;">
<h3 style="margin-top:0; color:#2563EB;">Route Planner</h3>
<p style="font-size:12px; color:#666; margin-bottom:5px;">Left Click: Add Point | Drag: Move</p>
<div class="stat-row"><span>Length:</span> <span id="current-length">0 m</span></div>
<div class="stat-row"><span>Cost:</span> <span id="current-cost" style="color:#ef4444">$0</span></div>
<div class="stat-row"><span>Est. Riders:</span> <span id="current-riders" style="color:#10B981">0 / day</span>
</div>
<div class="button-row">
<button id="btn-save" class="primary">Build Route</button>
<button id="btn-discard" class="danger">Discard / Cancel</button>
</div>
</div>
</div>
</div>
<script type="module" src="/src/main.js"></script>