peterstockings/workout
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add exercise category search in settings

Browse Source
This commit is contained in:
Peter Stockings
2026-02-08 16:31:05 +11:00
parent 31f738cfb3
commit ce28f7f749
3 changed files with 68 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
templates/settings.html
View File

@@ -189,16 +189,30 @@
d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z"></path>
</svg>
</div>
<input type="search" id="exercise-search"
<input type="search" id="exercise-search" name="q"
class="block w-full p-2 pl-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-cyan-500 focus:border-cyan-500 transition-all shadow-sm"
placeholder="Search exercises..."
_="on input show <tbody>tr/> in closest <table/> when its textContent.toLowerCase() contains my value.toLowerCase()">
placeholder="Search e.g. 'muscle:chest'..."
hx-get="/exercises/search"
hx-trigger="input changed delay:250ms, search"
hx-target="#new-exercise" hx-indicator="#search-spinner">
<div id="search-spinner"
class="htmx-indicator absolute inset-y-0 right-3 flex items-center">
<svg class="animate-spin h-4 w-4 text-cyan-600"
xmlns="http://www.w3.org/2000/svg" fill="none"
viewBox="0 0 24 24">
<circle class="opacity-25" cx="12" cy="12" r="10"
stroke="currentColor" stroke-width="4"></circle>
<path class="opacity-75" fill="currentColor"
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z">
</path>
</svg>
</div>
</div>
</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-100" id="new-exercise"
hx-target="closest tr" hx-swap="outerHTML swap:0.5s">
hx-target="closest tr" hx-swap="innerHTML swap:0.5s">
{% for exercise in exercises %}
{{ render_partial('partials/exercise.html', exercise_id=exercise.exercise_id,
name=exercise.name, attributes=exercise.attributes)}}