Add gate icon and remove gate type

src/static/app.js

@@ -118,7 +118,6 @@ async function updateMap(gates) {
     const popup = L.popup().setContent(
       `<div style="min-width:140px">
         <strong>${gate.name}</strong><br>
-        <em style="font-size:.85em;color:#666">${gate.gate_type === "car" ? "Car gate" : "Pedestrian gate"}</em><br>
         <a href="https://www.google.com/maps/dir/?api=1&destination=${gate.lat},${gate.lon}"
            target="_blank" rel="noopener"
            style="display:inline-block;margin-top:.5em;font-size:.85em;text-decoration:underline">
@@ -126,7 +125,7 @@ async function updateMap(gates) {
         </a>
       </div>`
     );
-    const marker = L.marker([gate.lat, gate.lon], { icon: _gateIcon(gate.gate_type) })
+    const marker = L.marker([gate.lat, gate.lon], { icon: _gateIcon() })
       .bindPopup(popup)
       .addTo(_map);
     _mapMarkers.push(marker);
@@ -189,9 +188,9 @@ function renderGates(gates) {
     groupGrid.className = "gate-group-grid";
 
     for (const gate of groups.get(key)) {
-      const icon = gate.gate_type === "car" ? "🚘" : "🚶";
+      const icon = gate.gate_icon || '🚪';
       const btn = document.createElement("button");
-      btn.className = `gate-btn ${gate.gate_type}`;
+      btn.className = "gate-btn";
       btn.dataset.gateId = gate.id;
       btn.innerHTML = `<span class="icon">${icon}</span><span>${gate.name}</span>`;
       btn.addEventListener("click", () => handleOpenGate(btn, gate));