new ui changes

web/index.html

@@ -53,11 +53,22 @@
         <button class="sort-btn active" data-sort="status">Status</button>
         <button class="sort-btn" data-sort="ratio">Ratio</button>
         <button class="sort-btn" data-sort="size">Size</button>
+        <button class="sort-btn" data-sort="speed">Speed</button>
         <button class="sort-btn" data-sort="peer100">100% Peers</button>
       </div>
-      <div class="refresh-indicator" id="refresh-indicator" title="Auto-refreshes every 3s">
-        <span class="dot"></span>
-        <span class="refresh-text">live</span>
+      <div class="toolbar-actions">
+        <label class="interval-control" for="refresh-interval">
+          <span class="sr-only">Refresh interval</span>
+          <select id="refresh-interval" class="refresh-select" aria-label="Refresh interval">
+            <option value="1000">1s</option>
+            <option value="3000" selected>3s</option>
+            <option value="5000">5s</option>
+            <option value="10000">10s</option>
+          </select>
+        </label>
+        <div class="refresh-indicator" id="refresh-indicator" title="Auto-refreshes every 3s" role="status" aria-label="Auto-refresh active">
+          <span class="dot" aria-hidden="true"></span>
+        </div>
       </div>
     </div>
 
@@ -76,7 +87,7 @@
     <div id="error-state" class="error-state hidden">
       <p class="error-title">Connection error</p>
       <p class="error-sub" id="error-msg">Could not reach the Transmission daemon.</p>
-      <p class="error-hint">Retrying in 3s…</p>
+      <p class="error-hint" id="error-hint">Retrying in 3s…</p>
     </div>
   </main>