[v14.0/forgejo] fix: modals on small viewport height (#11560)

**Backport:** https://codeberg.org/forgejo/forgejo/pulls/11547

- For small modals fomantic tried to add a `scrolling` class using a function that was not implemented, this function is now stubbed.
- There's not really a need to conditionally change the behavior of scrolling or not, we can specify `overflow-y: auto` which is more than enough to take care of this. We do add some layout changes to ensure the modal is fully scrollable.
- Refactor to nested CSS.
- Resolves forgejo/forgejo#10991

Co-authored-by: Gusted <postmaster@gusted.xyz>
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/11560
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Co-authored-by: forgejo-backport-action <forgejo-backport-action@noreply.codeberg.org>
Co-committed-by: forgejo-backport-action <forgejo-backport-action@noreply.codeberg.org>
This commit is contained in:
forgejo-backport-action 2026-03-08 02:44:47 +01:00 committed by Gusted
parent 9421d22215
commit beed05d2f7
3 changed files with 35 additions and 5 deletions

View file

@ -103,3 +103,27 @@ test('Dialog modal: width', async ({page, isMobile}) => {
expect(width).toBe(800);
}
});
test('Dialog modal: short viewport', async ({page, isMobile}) => {
test.skip(isMobile);
// Small height for viewport.
await page.setViewportSize({
width: 1000,
height: 200,
});
await page.goto('/user2/repo1/settings');
// Open modal with long content
const deleteModal = page.locator('#delete-repo-modal');
await expect(deleteModal).toBeHidden();
await page.getByRole('button', {name: 'Delete this repository'}).click();
await expect(deleteModal).toBeVisible();
// Scroll to the bottom.
const scrollY = await page.evaluate(() => document.querySelector('.ui.dimmer').scrollHeight);
await page.mouse.wheel(0, scrollY);
const scrollTop = await page.evaluate(() => document.querySelector('.ui.dimmer').scrollTop);
expect(scrollTop).toBeGreaterThan(0);
});