fix(ui): make pagination labels always visible to screenreader

- The pagination labels 'First', 'Previous', 'Next' and 'Last' are
hidden away when the screen width becomes smaller. However this also
hides them from the screen reader. Instead of using `display: none`, use
some well-known tricks to still make them visible to the screen reader.
- Add E2E test.
- Resolves Codeberg/Community#1858

(cherry picked from commit b6072496d4)
This commit is contained in:
Gusted 2025-04-23 23:39:27 +02:00 committed by forgejo-backport-action
commit a4396782b5
2 changed files with 24 additions and 1 deletions

View file

@ -0,0 +1,15 @@
// @watch start
// template/base/paginate.tmpl
// services/context/pagination.go
// @watch end
import {expect} from '@playwright/test';
import {test} from './utils_e2e.ts';
import {accessibilityCheck} from './shared/accessibility.ts';
test('Pagination a11y', async ({page}) => {
await page.goto('/explore/repos');
await expect(page.locator('.pagination')).toBeVisible();
await accessibilityCheck({page}, ['.pagination'], [], []);
});