diff --git a/scripts/check.mjs b/scripts/check.mjs
index 678bf90..2b39d7f 100644
--- a/scripts/check.mjs
+++ b/scripts/check.mjs
@@ -121,7 +121,8 @@ for (const value of [
assert(html.includes("Search the library"));
assert(html.includes("Search by title, task, or contributor"));
assert(html.includes('class="search-field"'));
-assert(html.includes("styles.css?v=20260622-search-prominence"));
+assert(html.includes("styles.css?v=20260622-sort-focus"));
+assert(html.includes("script.js?v=20260622-sort-focus"));
assert(css.includes(".search-control-label"));
assert(css.includes(".search-control:hover .search-field"));
assert(css.includes(".search-control:focus-within .search-field"));
@@ -144,7 +145,11 @@ assert(learnHtml.includes("How agent loops work"));
assert(agentHtml.includes("For AI agents"));
assert(css.includes(".loop-row"));
assert(css.includes(".sort-control"));
+assert(css.includes(".sort-control select.is-pointer-focused:focus"));
assert(browserScript.includes("data-category-filter"));
+assert(browserScript.includes('sortSelect.addEventListener("pointerdown"'));
+assert(browserScript.includes('sortSelect.addEventListener("keydown"'));
+assert(browserScript.includes('sortSelect.addEventListener("blur"'));
assert(html.includes(''));
assert(html.includes(''));
assert(browserScript.includes('"oldest"'));
diff --git a/site/index.html b/site/index.html
index 36af896..db1acde 100644
--- a/site/index.html
+++ b/site/index.html
@@ -132,7 +132,7 @@
href="https://signals.forwardfuture.ai/loop-library/agents/"
/>
-
+
-
+
Loop Library: Repeatable AI Agent Workflows | Forward Future
diff --git a/site/script.js b/site/script.js
index b9d3ba3..d66a00e 100644
--- a/site/script.js
+++ b/site/script.js
@@ -82,6 +82,18 @@ const SORT_OPTIONS = new Set([
let activeSort = "featured";
+if (sortSelect) {
+ sortSelect.addEventListener("pointerdown", () => {
+ sortSelect.classList.add("is-pointer-focused");
+ });
+ sortSelect.addEventListener("keydown", () => {
+ sortSelect.classList.remove("is-pointer-focused");
+ });
+ sortSelect.addEventListener("blur", () => {
+ sortSelect.classList.remove("is-pointer-focused");
+ });
+}
+
function rowTitle(row) {
return normalize(row.querySelector(".loop-title-link")?.textContent ?? "");
}
diff --git a/site/styles.css b/site/styles.css
index 1675a5f..f871b86 100644
--- a/site/styles.css
+++ b/site/styles.css
@@ -757,6 +757,10 @@ code {
outline-offset: 2px;
}
+.sort-control select.is-pointer-focused:focus {
+ outline: none;
+}
+
.copy-button {
border: 1px solid var(--ink);
color: var(--ink);