Mirrors_Framework/awesome-python
1
0
Fork 0
mirror of https://github.com/vinta/awesome-python.git synced 2026-03-23 13:56:43 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: improve table accessibility and mobile expand tags

Browse Source 
- Add sr-only headings for search/filter and results regions
- Add role=region and aria-label to .table-wrap for landmark navigation
- Add tabindex=0 and focus outline to .table-wrap for keyboard reachability
- Add sr-only text to empty Details column header
- Add role=button to expandable rows
- Add .expand-tags-mobile to show category/group tags in expand row on mobile
- Show .expand-tags-mobile via media query at <=900px breakpoint

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Vinta Chen
2026-03-18 18:49:52 +08:00
parent 15a38caaf9
commit 95b6b3cc69
2 changed files with 29 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
website/static/style.css
View File

@@ -201,6 +201,11 @@ a:hover { color: var(--accent-hover); text-decoration: underline; }
overflow-x: auto;
}
.table-wrap:focus {
outline: 2px solid var(--accent);
outline-offset: -2px;
}
.table {
width: 100%;
border-collapse: separate;
@@ -321,6 +326,20 @@ a:hover { color: var(--accent-hover); text-decoration: underline; }
line-height: 1.6;
}
.expand-tags-mobile {
display: none;
gap: 0.4rem;
margin-bottom: 0.4rem;
}
.expand-tag {
font-size: var(--text-xs);
color: oklch(45% 0.06 240);
background: var(--bg);
padding: 0.15rem 0.4rem;
border-radius: 3px;
}
.expand-also-see {
margin-top: 0.25rem;
font-size: var(--text-xs);
@@ -419,6 +438,7 @@ a:hover { color: var(--accent-hover); text-decoration: underline; }
/* === Responsive === */
@media (max-width: 900px) {
.col-group { display: none; }
.expand-tags-mobile { display: flex; }
}
@media (max-width: 640px) {