Buttons for new repo/migration on organization main page different sizes and missing spacing on certain width

[misthios]

Description

The buttons for a new Repository/Migration on a organization page are a different size when placed underneath each other when using a desktop browser with a small width.

There appears to be a width that is in the middle between 2 stages where the buttons are placed underneath each other. instead of next to each other. When this happens they are not the same size and there is no spacing between them.

Screenshot 1 shows the browser in full width. (1440p monitor for reference)

Screenshot 2 shows the browser in the middle width stage where they are placed underneath each other (between 1029 innerwidth and about 777 innerwidth according to console.log(window.innerWidth).

Screenshot 3 shows the browser with less width where the buttons are back to being placed next to each other again (about 766 innerwidth).

Screenshots

1: Browser with full width:

2:Browser with smaller width:

3: Browser with smaller width

Gitea Version

1.23.0

Can you reproduce the bug on the Gitea demo site?

Yes

Operating System

PopOS 24.04

Browser Version

Firefox 134 / Chromium 131.06778.204

[wxiaoguang]

A longstanding UI problem.

I also have noticed (and actually have tried to "fix" it several times) but haven't figured out a proper better layout yet.