fix(ui): make pagination labels always visible to screenreader (#7616)
Some checks are pending
/ release (push) Waiting to run
testing / backend-checks (push) Waiting to run
testing / frontend-checks (push) Waiting to run
testing / test-unit (push) Blocked by required conditions
testing / test-e2e (push) Blocked by required conditions
testing / test-remote-cacher (redis) (push) Blocked by required conditions
testing / test-remote-cacher (valkey) (push) Blocked by required conditions
testing / test-remote-cacher (garnet) (push) Blocked by required conditions
testing / test-remote-cacher (redict) (push) Blocked by required conditions
testing / test-mysql (push) Blocked by required conditions
testing / test-pgsql (push) Blocked by required conditions
testing / test-sqlite (push) Blocked by required conditions
testing / security-check (push) Blocked by required conditions

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/7616
Reviewed-by: Beowulf <beowulf@beocode.eu>
Reviewed-by: Otto <otto@codeberg.org>
This commit is contained in:
Otto 2025-04-24 22:37:10 +00:00
commit 580b7e2671
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'], [], []);
});

View file

@ -952,7 +952,15 @@ img.ui.avatar,
@media (max-width: 767.98px) {
.ui.pagination.menu .item:not(.active,.navigation),
.ui.pagination.menu .item.navigation span.navigation_label {
display: none;
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border-width: 0;
}
}