UX Improvements

This commit is contained in:
Brennan Wilkes (Text Groove) 2026-02-02 19:57:28 -08:00
parent 572d5a61b9
commit fec81c7523

View file

@ -286,36 +286,35 @@ export async function renderStats($app) {
$app.innerHTML = ` $app.innerHTML = `
<div class="container"> <div class="container">
<div class="header"> <div class="header">
<div class="headerRow1"> <div class="headerRow1">
<div class="headerLeft"> <div class="headerLeft">
<h1 class="h1">Store Price Index</h1> <div class="headerButtons" style="margin-top:10px;">
<div class="small" id="statsStatus">Loading</div> <button id="back" class="btn"> Back</button>
</div>
<div class="headerButtons" style="margin-top:10px;"> <h1 class="h1">Store Price Index</h1>
<button id="back" class="btn"> Back</button> <div class="small" id="statsStatus">Loading</div>
</div>
</div> </div>
<div class="headerRight"> <div class="headerRight">
<div style="display:flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:flex-end;"> <div style="display:flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:flex-end;">
<label class="small" style="display:flex; gap:8px; align-items:center;"> <label class="small" style="display:flex; gap:8px; align-items:center;">
Stores Stores
<select id="statsGroup" class="selectSmall" aria-label="Store group"> <select id="statsGroup" class="selectSmall" aria-label="Store group">
<option value="all">All Stores</option> <option value="all">All Stores</option>
<option value="bc">BC Only</option> <option value="bc">BC Only</option>
<option value="ab">Alberta Only</option> <option value="ab">Alberta Only</option>
</select> </select>
</label> </label>
<label class="small" style="display:flex; gap:8px; align-items:center;"> <label class="small" style="display:flex; gap:8px; align-items:center;">
Index Size Index Size
<select id="statsSize" class="selectSmall" aria-label="Index size"> <select id="statsSize" class="selectSmall" aria-label="Index size">
<option value="50">50</option> <option value="50">50</option>
<option value="250">250</option> <option value="250">250</option>
<option value="1000">1000</option> <option value="1000">1000</option>
</select> </select>
</label> </label>
</div> </div>
</div> </div>
</div> </div>
</div> </div>