foster/forgejo
1
0
Fork 0
mirror of https://codeberg.org/forgejo/forgejo.git synced 2025-01-20 16:50:28 -05:00
Code Issues Wiki Activity

fix(ui): prevent overflow of branch selector in commit graph (#6617)

Browse source 
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/6617
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Reviewed-by: 0ko <0ko@noreply.codeberg.org>
Reviewed-by: Otto <otto@codeberg.org>
This commit is contained in:
Otto 2025-01-20 15:26:49 +00:00
commit aa986ef1a6
2 changed files with 31 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
tests/e2e/repo-commitgraph.test.e2e.ts
View file

@ -8,10 +8,27 @@ import {expect} from '@playwright/test';
import {save_visual, test} from './utils_e2e.ts'; import {save_visual, test} from './utils_e2e.ts';
test('Commit graph overflow', async ({page}) => { test('Commit graph overflow', async ({page}) => {
await page.goto('/user2/diff-test/graph'); const response = await page.goto('/user2/repo1/graph');
expect(response?.status()).toBe(200);
await page.click('#flow-select-refs-dropdown');
const input = page.locator('#flow-select-refs-dropdown');
await input.press('Enter');
await input.press('Enter');
await input.press('Enter');
await input.press('Enter');
await input.press('Enter');
await input.press('Enter');
await input.press('Enter');
await input.press('Enter');
await input.press('Enter');
await input.press('Enter');
await expect(page.locator('#flow-select-refs-dropdown')).toBeInViewport({ratio: 1});
await expect(page.getByRole('button', {name: 'Mono'})).toBeInViewport({ratio: 1}); await expect(page.getByRole('button', {name: 'Mono'})).toBeInViewport({ratio: 1});
await expect(page.getByRole('button', {name: 'Color'})).toBeInViewport({ratio: 1}); await expect(page.getByRole('button', {name: 'Color'})).toBeInViewport({ratio: 1});
await expect(page.locator('.selection.search.dropdown')).toBeInViewport({ratio: 1}); await expect(page.locator('.selection.search.dropdown')).toBeInViewport({ratio: 1});
await save_visual(page);
}); });
test('Switch branch', async ({page}) => { test('Switch branch', async ({page}) => {

19
web_src/css/features/gitgraph.css
View file

@ -23,6 +23,18 @@
#git-graph-heading { #git-graph-heading {
align-items: center; align-items: center;
} }
#git-graph-heading-left {
margin-right: 1rem;
}
#git-graph-heading h2 {
flex-shrink: 0;
}
#git-graph-container #flow-select-refs-dropdown {
min-width: 250px;
}
} }
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
@ -34,15 +46,10 @@
#git-graph-heading-left { #git-graph-heading-left {
margin-bottom: 1rem; margin-bottom: 1rem;
} }
h2,
#flow-select-refs-dropdown {
max-width: 100%;
}
} }
#git-graph-container #flow-select-refs-dropdown { #git-graph-container #flow-select-refs-dropdown {
min-width: 250px; flex-wrap: wrap;
} }
#git-graph-container #flow-select-refs-dropdown .ui.label { #git-graph-container #flow-select-refs-dropdown .ui.label {