rob
/
smarttools
1
0
Fork 0
Code Issues Pull Requests Packages Projects 1 Releases Wiki Activity

Fix select element accessibility labels on tools page 

Add proper label associations with for/id attributes to all select
elements on the tools page for screen reader compatibility.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
rob 2025-12-31 23:25:16 -04:00
parent e7937361f3
commit 4fb229858f
1 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/smarttools/web/templates/pages/tools.html
View File

@ -69,7 +69,7 @@
<!-- Sort --> <!-- Sort -->
<div> <div>
<h3 class="text-sm font-medium text-gray-700 mb-3">Sort By</h3> <label for="sort-select" class="block text-sm font-medium text-gray-700 mb-3">Sort By</label>
<select id="sort-select" <select id="sort-select"
onchange="updateSort(this.value)" onchange="updateSort(this.value)"
class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 bg-white"> class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 bg-white">
@ -109,8 +109,9 @@
<!-- Mobile Categories --> <!-- Mobile Categories -->
<div> <div>
<label class="block text-sm font-medium text-gray-700 mb-2">Category</label> <label for="mobile-category-select" class="block text-sm font-medium text-gray-700 mb-2">Category</label>
<select onchange="window.location.href=this.value" <select id="mobile-category-select"
onchange="window.location.href=this.value"
class="w-full px-3 py-2 border border-gray-300 rounded-lg bg-white"> class="w-full px-3 py-2 border border-gray-300 rounded-lg bg-white">
<option value="{{ url_for('web.tools') }}" {{ 'selected' if not current_category }}>All Tools</option> <option value="{{ url_for('web.tools') }}" {{ 'selected' if not current_category }}>All Tools</option>
{% for cat in categories %} {% for cat in categories %}
@ -123,8 +124,9 @@
<!-- Mobile Sort --> <!-- Mobile Sort -->
<div> <div>
<label class="block text-sm font-medium text-gray-700 mb-2">Sort By</label> <label for="mobile-sort-select" class="block text-sm font-medium text-gray-700 mb-2">Sort By</label>
<select onchange="updateSort(this.value)" <select id="mobile-sort-select"
onchange="updateSort(this.value)"
class="w-full px-3 py-2 border border-gray-300 rounded-lg bg-white"> class="w-full px-3 py-2 border border-gray-300 rounded-lg bg-white">
<option value="downloads" {{ 'selected' if sort == 'downloads' }}>Most Downloads</option> <option value="downloads" {{ 'selected' if sort == 'downloads' }}>Most Downloads</option>
<option value="published_at" {{ 'selected' if sort == 'published_at' }}>Recently Published</option> <option value="published_at" {{ 'selected' if sort == 'published_at' }}>Recently Published</option>