[v16.0/forgejo] fix(ui): use rtl alignment for options dropdown in actions list (#13497)

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

Currently the dropdown will overflow on narrow screens, because it is
aligned on the left side to the button. To prevent this, align the right
side to the button.

| Before | After |
|--------|------|
|![image](/attachments/e9bdb33f-8efa-4167-96c3-77f68dfe3d9e) | ![image](/attachments/7689d7e2-86cb-494b-9d05-633f758fdbc2) |
|![image](/attachments/360a2cba-9ba8-431d-8e1f-0d333b94243c)||

Co-authored-by: Beowulf <beowulf@beocode.eu>
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/13497
Reviewed-by: 0ko <0ko@noreply.codeberg.org>
Reviewed-by: Beowulf <beowulf@beocode.eu>
This commit is contained in:
forgejo-backport-action 2026-07-17 21:36:38 +02:00 committed by Beowulf
commit 1c2b530d08
2 changed files with 15 additions and 1 deletions

View file

@ -38,7 +38,7 @@
<div class="run-list-meta">{{svg "octicon-calendar" 16}}{{DateUtils.TimeSince .Updated}}</div>
<div class="run-list-meta">{{svg "octicon-stopwatch" 16}}{{.Duration}}</div>
</div>
<details class="dropdown">
<details class="dropdown dir-rtl">
<summary class="border">
{{ctx.Locale.Tr "actions.runs.options"}} {{svg "octicon-triangle-down" 14}}
</summary>

View file

@ -269,3 +269,17 @@ test.describe('workflow list dynamic refresh', () => {
await expect(page.locator('[aria-expanded="true"]')).toHaveCount(1);
});
});
test('check that options dropdown not overflows', async ({page}) => {
await page.setViewportSize({
width: 500,
height: 1440,
});
await page.goto('/user2/test_workflows/actions');
await page.locator('.run-list-item-right + details.dropdown').first().click();
await expect(page.locator('.run-list-item-right + details.dropdown > .content').first()).toBeInViewport({
ratio: 1,
});
});