Simplify website search and listing controls (#1553)

* Removing search from the home pageThis was a little confusing because there are two searches, but the overall site search is a lot more powerful

* Prefilter website search by resource page

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

* small error handling and formatting

* Simplify website listing controls

Remove per-page text search, trim page-specific controls, and move remaining sort/filter controls into compact flyouts.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

---------

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
Aaron Powell
2026-04-29 16:03:08 +10:00
committed by GitHub
parent 0d7a5ad4c2
commit 76ac13a9b8
29 changed files with 1166 additions and 1331 deletions
+3 -19
View File
@@ -39,45 +39,29 @@ export function sortSkills<T extends RenderableSkill>(
});
}
export function renderSkillsHtml(
items: RenderableSkill[],
options: {
query?: string;
highlightTitle?: (title: string, query: string) => string;
} = {}
): string {
const { query = "", highlightTitle } = options;
export function renderSkillsHtml(items: RenderableSkill[]): string {
if (items.length === 0) {
return `
<div class="empty-state">
<h3>No skills found</h3>
<p>Try a different search term or adjust filters</p>
<p>No skills are available right now.</p>
</div>
`;
}
return items
.map((item) => {
const titleHtml =
query && highlightTitle
? highlightTitle(item.title, query)
: escapeHtml(item.title);
return `
<article class="resource-item" data-path="${escapeHtml(
item.skillFile
)}" data-skill-id="${escapeHtml(item.id)}" role="listitem">
<button type="button" class="resource-preview">
<div class="resource-info">
<div class="resource-title">${titleHtml}</div>
<div class="resource-title">${escapeHtml(item.title)}</div>
<div class="resource-description">${escapeHtml(
item.description || "No description"
)}</div>
<div class="resource-meta">
<span class="resource-tag tag-category">${escapeHtml(
item.category
)}</span>
${
item.hasAssets
? `<span class="resource-tag tag-assets">${