Files
bookhoard/templates/filter_item.templ
T
john-okeefe 8ea70ea7f8 feat(ui): migrate remaining pages to the new shell
Apply the sidebar shell and bold primitives across the rest of the app so
the whole experience shares one visual language:

- Browse/organize: series (keeps stacked-covers/series-card CSS),
  collections (keeps wood-paneling + carousel classes), browse_detail.
- Account/stats: profile + form + modal, progress, analytics (stat-card
  tiles), devices, conflicts (status semantics), queue (status/priority
  badges).
- Admin: admin sidebar restyled with icons, dashboard/users/library/
  processing-issues/settings migrated to .card/.btn/.input primitives.
- Docs/setup/misc: docs (keeps prose/highlight.js), api_explorer, setup
  wizard, unlinked_books, custom_section builder.
- Modals/fragments: collection_modal, collection_rules,
  restore_system_collection_modal, filter_item, book_detail_modals — all
  overlays use --surface-overlay + --shadow-pop.

Every Alpine handler, HTMX attribute, id, name, and data-* is preserved;
only presentation changes.
2026-08-05 16:45:02 -04:00

28 lines
654 B
Templ

package templates
templ FilterItem(id string, name string) {
<div
class="flex items-center justify-between gap-2 p-2 rounded-lg hover:bg-surface-hover"
data-filter-id={ id }
>
<button
data-action="load-filter"
@click="loadFilter($event)"
class="flex-1 text-left px-2 py-1 text-sm rounded-lg hover:bg-surface-hover"
style="color: var(--text-primary);"
>
{ name }
</button>
<button
data-action="delete-filter"
@click="deleteFilter($event)"
class="icon-btn shrink-0"
style="color: var(--text-secondary);"
title="Delete filter"
aria-label="Delete filter"
>
@Icon("trash", "h-4 w-4")
</button>
</div>
}