diff --git a/html/map.ejs b/html/map.ejs
index a5b4992e..5cae6d29 100644
--- a/html/map.ejs
+++ b/html/map.ejs
@@ -774,37 +774,45 @@
function tickCoords(){ updateCoordsFast(); setTimeout(tickCoords,120) } // fast enough, less CPU
tickCoords();
-// Add a close (X) button inside the search bar
-const searchBox = document.querySelector(".search");
-if (searchBox) {
- const closeBtn = document.createElement("button");
- closeBtn.textContent = "✕";
- closeBtn.className = "closebtn";
- closeBtn.title = "Close search";
- searchBox.appendChild(closeBtn);
+// Create floating X button above the search bar
+const bar = document.querySelector(".bar");
+if (bar) {
+ const closeSearch = document.createElement("button");
+ closeSearch.textContent = "✕";
+ closeSearch.title = "Close search";
+ closeSearch.style.position = "absolute";
+ closeSearch.style.top = "-10px";
+ closeSearch.style.right = "-10px";
+ closeSearch.style.background = "#222";
+ closeSearch.style.color = "#fff";
+ closeSearch.style.border = "1px solid #444";
+ closeSearch.style.borderRadius = "50%";
+ closeSearch.style.width = "28px";
+ closeSearch.style.height = "28px";
+ closeSearch.style.cursor = "pointer";
+ closeSearch.style.zIndex = "999";
- closeBtn.addEventListener("click", () => {
- const form = document.querySelector("#form");
- const input = document.querySelector("#q");
- const sugg = document.querySelector("#suggestions");
+ // attach to search container
+ const searchDiv = document.querySelector(".search");
+ searchDiv.style.position = "relative";
+ searchDiv.appendChild(closeSearch);
- input.value = "";
- sugg.style.display = "none";
- form.style.display = "none"; // hides the search bar
+ closeSearch.addEventListener("click", () => {
+
+ document.querySelector("#suggestions").style.display = "none";
+ });
+
+ // shortcut to re-open with `/`
+ document.addEventListener("keydown", e => {
+ if (e.key === "/") {
+ if (searchDiv.style.display === "none") {
+ searchDiv.style.display = "flex";
+ document.querySelector("#q").focus();
+ e.preventDefault();
+ }
+ }
});
}
-
-// Allow reopening search bar with `/` key
-document.addEventListener("keydown", e => {
- if (e.key === "/") {
- const form = document.querySelector("#form");
- if (form && form.style.display === "none") {
- form.style.display = "block";
- document.querySelector("#q").focus();
- e.preventDefault();
- }
- }
-});
})();