diff --git a/packages/explorer-site/src/main.ts b/packages/explorer-site/src/main.ts index bc6d7e2..d401ec0 100644 --- a/packages/explorer-site/src/main.ts +++ b/packages/explorer-site/src/main.ts @@ -17,33 +17,22 @@ document.addEventListener("DOMContentLoaded", function () { const resultsDiv = document.getElementById("results") as HTMLDivElement; if (searchInput && resultsDiv) { - searchInput.addEventListener("input", (ev) => { + searchInput.addEventListener("input", function () { const searchResults = fuse.search(searchInput.value); if (searchResults.length) { const ul = document.createElement("ul"); - ul.className = "search-results"; - - ul.style.listStyleType = "none"; - ul.style.padding = "0"; - ul.style.margin = "0"; - for (const result of searchResults) { const li = document.createElement("li"); - li.classList.add("result-item"); - const a = document.createElement("a"); a.href = result.item.id; a.dataset.href = "/" + result.item.name.replace(/:/g, "/"); a.textContent = result.item.name; - li.append(a); - ul.appendChild(li); }; - // Display the results dropdown - resultsDiv.style.display = "block"; resultsDiv.replaceChildren(ul); + resultsDiv.style.display = "block"; } else { resultsDiv.textContent = "No results found"; resultsDiv.style.display = "none"; diff --git a/packages/explorer-views/src/pages/navigation.css b/packages/explorer-views/src/pages/navigation.css index c0f9b4f..808be57 100644 --- a/packages/explorer-views/src/pages/navigation.css +++ b/packages/explorer-views/src/pages/navigation.css @@ -1,15 +1,14 @@ nav { cursor: default; - display: flex; - flex-direction: column; - gap: 1em; + display: grid; + grid-gap: 1em; + grid-template-rows: min-content minmax(0, 1fr); height: 100vh; left: 0; padding: 1.5em 2px 1em 1em; position: fixed; top: 0; width: 25vw; - box-sizing: border-box; } nav p { @@ -18,18 +17,17 @@ nav { } nav .tabview { - display: flex; - flex-direction: column; - flex-grow: 1; + display: grid; + grid-template-rows: min-content minmax(0, 1fr); margin: 0; } nav .tabview-pages { background: var(--base01); border: 1px solid var(--base02); - padding: 1.5rem 0.5rem 5rem; - overflow: auto; - flex-grow: 1; + padding: 1.5rem .5rem 5rem; + overflow: clip auto; + overscroll-behavior: none; } nav ul {