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

New Issue

GiteaMirror · 2025-11-02T10:57:40-06:00

GiteaMirror commented

2025-11-02 10:57:40 -06:00

Originally created by @misthios on GitHub (Jan 9, 2025).

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

Originally created by @misthios on GitHub (Jan 9, 2025). ### 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: ![big-window](https://github.com/user-attachments/assets/96028715-efd5-4234-8b71-a69efe62d896) 2:Browser with smaller width: ![small-window](https://github.com/user-attachments/assets/306e202a-1a85-43cf-a40a-26cb17e6e6a0) 3: Browser with smaller width ![smaller-window](https://github.com/user-attachments/assets/e367d4e6-257e-4e24-9bc3-fcb3a0dbec7e) ### 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

GiteaMirror added the issue/confirmed topic/ui type/bug labels 2025-11-02 10:57:40 -06:00

GiteaMirror closed this issue

2025-11-02 10:57:41 -06:00

GiteaMirror commented

2025-11-02 10:57:42 -06:00

@wxiaoguang commented on GitHub (Jan 11, 2025):

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.

@wxiaoguang commented on GitHub (Jan 11, 2025): 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.

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github-starred/gitea#13934