forgejo/web_src/css
Henry Catalini Smith dd968f147d Improve repo file list table semantics for screen readers (#11846)
https://codeberg.org/forgejo/forgejo/issues/11116

To understand the impact of this you really need to listen to the before and after screen recordings attached. https://codeberg.org/forgejo/forgejo/issues/11116 is a really great bug report, and I was surprised by how disorienting this actually was when testing manually compared to my expectation after reading the issue. This is an impactful improvement!

This is my first time adding new translation strings. Excited to learn more about that if I've guessed wrong about how to do it.

To summarise, what we're doing here is as follows.

1. Address the core issue by changing the existing `<th>` elements to `<td>` so that screen readers stop semantically associating them with each row and reading them out for every table cell.
2. Replace them with real `<th>` elements that communicate the true semantic role of each column.
3. Add a `<caption>`. This serves a dual purpose: it gives the table an accessible name which improves the navigability of the page, and it gives us a place to explain to the user that the first row of the table is a little bit different because it's the latest commit rather than a file in the repo.
4. Visually hide the new caption and headings so that only screen reader users get them.

## Checklist

The [contributor guide](https://forgejo.org/docs/next/contributor/) contains information that will be helpful to first time contributors. All work and communication must conform to Forgejo's [AI Agreement](https://codeberg.org/forgejo/governance/src/branch/main/AIAgreement.md). There also are a few [conditions for merging Pull Requests in Forgejo repositories](https://codeberg.org/forgejo/governance/src/branch/main/PullRequestsAgreement.md). You are also welcome to join the [Forgejo development chatroom](https://matrix.to/#/#forgejo-development:matrix.org).

### Tests for JavaScript changes

- I added test coverage for JavaScript changes...
  - [ ] in `web_src/js/*.test.js` if it can be unit tested.
  - [ ] in `tests/e2e/*.test.e2e.js` if it requires interactions with a live Forgejo server (see also the [developer guide for JavaScript testing](https://codeberg.org/forgejo/forgejo/src/branch/forgejo/tests/e2e/README.md#end-to-end-tests)).

### Documentation

- [ ] I created a pull request [to the documentation](https://codeberg.org/forgejo/docs) to explain to Forgejo users how to use this change.
- [ ] I did not document these changes and I do not expect someone else to do it.

### Release notes

- [x] This change will be noticed by a Forgejo user or admin (feature, bug fix, performance, etc.). I suggest to include a release note for this change.
- [ ] This change is not visible to a Forgejo user or admin (refactor, dependency upgrade, etc.). I think there is no need to add a release note for this change.

*The decision if the pull request will be shown in the release notes is up to the mergers / release team.*

The content of the `release-notes/<pull request number>.md` file will serve as the basis for the release notes. If the file does not exist, the title of the pull request will be used instead.

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/11846
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Reviewed-by: Andreas Ahlenstorf <aahlenst@noreply.codeberg.org>
Co-authored-by: Henry Catalini Smith <henry@catalinismith.se>
Co-committed-by: Henry Catalini Smith <henry@catalinismith.se>
2026-04-08 02:20:35 +02:00
..
chroma [Port] gitea#30014: Various code view improvements 2024-03-28 16:43:14 +01:00
codemirror Remove EasyMDE focus outline on text (#25328) 2023-06-18 04:10:07 +00:00
editor fix(ui/mde): fix switch height and buttons alignment (#9545) 2025-10-08 17:53:50 +02:00
features fix(ui): use overflow:auto to avoid scrollbars when they are not needed (#11469) 2026-03-04 00:36:54 +01:00
markup fix(ui): center-align emojis to neighbouring text (#11057) 2026-01-27 22:56:22 +01:00
modules fix: missing syntax dialog rounded corners (#11945) 2026-04-04 21:58:16 +02:00
repo feat(ui): responsive releases list (#11080) 2026-02-07 19:15:14 +01:00
shared fix(ui): improve milestone/project header consistency (#7174) 2025-03-09 16:24:52 +00:00
standalone chore(ui): change /devtest to /-/demo (#11019) 2026-01-26 13:12:25 +01:00
themes feat: add form-based runner management (#11516) 2026-03-12 02:14:45 +01:00
actions.css fix(ui): improve consistency in new runner management pages (#11675) 2026-03-15 15:29:01 +01:00
admin.css feat: move more modals to native dialogs (#9636) 2025-10-13 17:48:49 +02:00
base.css feat: "Add member" button in org members list (#11848) 2026-03-31 02:56:12 +02:00
dashboard.css fix(ui): cleanup css deadcode related to stackable menus (#11719) 2026-03-17 18:45:50 +01:00
explore.css [Port] gitea#29982 Introduce .secondary-nav and handle .page-content spacing universally 2024-03-28 16:43:09 +01:00
font_i18n.css Fix @font-face overrides (#24855) 2023-05-24 01:48:51 +00:00
form.css feat(ui): use better contrast color for required field indicator (#11677) 2026-03-17 19:45:18 +01:00
helpers.css Merge pull request 'Replace gt-word-break with tw-break-anywhere' (#4102) from 0ko/forgejo:ui-replace-gt-word-break into forgejo 2024-06-11 10:39:03 +00:00
home.css fix(ui): center footer links (#7925) 2025-05-22 15:27:00 +02:00
index.css feat: improve label filtering exclusion (#10702) 2026-02-08 00:31:31 +01:00
install.css UI improvements to optional sections in installation page (#4062) 2024-06-07 17:57:54 +00:00
issues.css feat: improve label filtering exclusion (#10702) 2026-02-08 00:31:31 +01:00
migrate.css feat(ui): redesign migration selection screen (#6795) 2025-04-19 13:51:35 +00:00
org.css feat: "Add member" button in org members list (#11848) 2026-03-31 02:56:12 +02:00
repo.css Improve repo file list table semantics for screen readers (#11846) 2026-04-08 02:20:35 +02:00
review.css chore(ui): cleanup reviews css, improve consistency (#10268) 2025-12-01 01:30:25 +01:00
user.css feat(ui): create repo-specific access tokens (#11696) 2026-03-23 15:29:08 +01:00