cleanup and filter support

web/templates/stops.html

@@ -0,0 +1,41 @@
+<h1>Stops</h1>
+<p>Click on a route to see details and a schedule. Schedules in prevailing local time.</p>
+<fieldset>
+    <legend>
+        <h2>Transit Centers</h2>
+    </legend>
+    <p style="margin-top: 10px; margin-bottom: 10px;">Hubs to connect between different modes of transit</p>
+    {% for stop in tc_stops %}
+        <a href="/stop/{{ stop.id }}"
+           style="display: flex;
+                  justify-content: space-between">
+            <p class="line-link">[ {{ stop.name }}</p>
+            <p>]</p>
+        </a>
+    {% endfor %}
+</fieldset>
+<fieldset>
+    <legend>
+        <h2>Other Stops</h2>
+    </legend>
+    <p style="margin-top: 10px; margin-bottom: 10px;">SEPTA has 13,000+ stops, search for yours here</p>
+    <input style="width: 100%;" type="search"
+           name="search" placeholder="Begin Typing To Search Stops..."
+           hx-post="/stops/search"
+           hx-trigger="input changed delay:500ms, keyup[key=='Enter'], load"
+           hx-target="#stop-list">
+    <div id="stop-list">
+    </div>
+</fieldset>
+<style>
+    .line-link, .lines-label {
+        margin-top: 3px;
+        margin-bottom: 3px;
+    }
+
+    .lines-label {
+        color: #ffffff;
+        background-color: #000000;
+        width: max-content;
+    }
+</style>