Fix button alignments and remove unnecessary styles #34206

kerwin612 · 2025-04-15T00:51:15Z

before:

after:

…a common button group style, and gradually replace the button group styles on other pages later.

silverwind · 2025-04-15T08:42:27Z

I'd prefer if we just remove margin-right from .ui.button at some point, will be a bit of a refactor, but worth it.

kerwin612 · 2025-04-15T08:53:40Z

I'd prefer if we just remove margin-right from .ui.button at some point, will be a bit of a refactor, but worth it.

Actually, I also agree. However, if we directly delete it from .ui.button, it may affect the usage in other places. So I want to make a mark here to facilitate subsequent maintenance and modification.

Since buttons are not always in groups, there might be a situation where there is another node beside a button, and the margin there might be meaningful. But it's impossible to accurately locate such nodes.

Therefore, my suggestion is that whenever we find such a case, we change it to this mark(gitea-buttons). This will greatly simplify subsequent maintenance and modification.

silverwind · 2025-04-15T08:57:25Z

I disagree, we should fix problems at their root instead of creating more technical debt by introducing another class. Also gitea-buttons is a bad name. It tells nothing what it does.

wxiaoguang

Disagree +1

We already have flex-text-block and flex-text-inline to explicitly use "flex align center with gap", so ideally we need to:

.flex-text-block > .ui.button,
.flex-text-inline > .ui.button {
...
}

And use flex-text-block and flex-text-inline to replace legacy tw-flex styles.

wxiaoguang · 2025-04-16T00:17:37Z

We already have flex-text-block and flex-text-inline to explicitly use "flex align center with gap", so ideally we need to:
And use flex-text-block and flex-text-inline to replace legacy tw-flex styles.

Hmm, actually we have already done so in "Adjust the layout of the toolbar on the Issues/Projects page (#33667)"

.flex-text-block > .ui.button,
.flex-text-inline > .ui.button {
  margin: 0; /* fomantic buttons have default margin, when we use them in a flex container with gap, we do not need these margins */
}

wxiaoguang · 2025-04-16T00:26:18Z

web_src/css/repo/header.css

+
+.repo-buttons button {
+  /* ensure that text-btn and svg-text-btn have consistent height. */
+  line-height: 16px !important;


Why it is needed? I don't see difference.

OK, I can see that it is for the "accept/reject transfer" buttons

Let's remove that patch and leave the button height fine-tunes to the future.

This patch should also be refactored together later.

wxiaoguang · 2025-04-16T03:43:31Z

Removed more hacky patches.

GiteaBot · 2025-04-16T07:05:51Z

@kerwin612 please fix the merge conflicts. 🍵

# Conflicts: # web_src/css/repo/clone.css

* giteaofficial/main: Fix various misalignments and overflows (go-gitea#34227) Update net package (go-gitea#34228) Fix button alignments and remove unnecessary styles (go-gitea#34206) Fix project board links to related Pull Requests (go-gitea#34213) Fix empty repo clone panel border (go-gitea#34219) Fix: quoted replies incorrectly render user input as part of the quote (go-gitea#34216)

Continue with #34206. --------- Co-authored-by: wxiaoguang <[email protected]> Co-authored-by: Lunny Xiao <[email protected]>

Fix the style issues of the top buttons on the release page, extract …

4f496ac

…a common button group style, and gradually replace the button group styles on other pages later.

GiteaBot added the lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. label Apr 15, 2025

github-actions bot added modifies/templates This PR modifies the template files modifies/frontend labels Apr 15, 2025

fix lint error

3b6261c

lunny added the topic/ui Change the appearance of the Gitea UI label Apr 15, 2025

delvh approved these changes Apr 15, 2025

View reviewed changes

GiteaBot added lgtm/need 1 This PR needs approval from one additional maintainer to be merged. and removed lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. labels Apr 15, 2025

hiifong approved these changes Apr 15, 2025

View reviewed changes

GiteaBot added lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. and removed lgtm/need 1 This PR needs approval from one additional maintainer to be merged. labels Apr 15, 2025

wxiaoguang reviewed Apr 15, 2025

View reviewed changes

wxiaoguang marked this pull request as draft April 15, 2025 09:51

wxiaoguang changed the title ~~Fix Release Page Button Style and Extract Common Button Group Style~~ WIP: Fix release page button style and extract common styles Apr 15, 2025

kerwin612 added 2 commits April 15, 2025 10:02

revert

c2eba62

Solve the issue using the existing styles.

5d72742

kerwin612 requested a review from wxiaoguang April 15, 2025 23:58

wxiaoguang reviewed Apr 16, 2025

View reviewed changes

remove unnecessary styles

f278b7d

wxiaoguang changed the title ~~WIP: Fix release page button style and extract common styles~~ Fix release page button style and extract common styles Apr 16, 2025

wxiaoguang changed the title ~~Fix release page button style and extract common styles~~ Fix release page button style and remove unnecessary styles Apr 16, 2025

wxiaoguang marked this pull request as ready for review April 16, 2025 00:58

Merge branch 'main' into fix/release-btn-style

e3339ae

wxiaoguang force-pushed the fix/release-btn-style branch from 077fb57 to 3d7db9f Compare April 16, 2025 03:33

wxiaoguang changed the title ~~Fix release page button style and remove unnecessary styles~~ Fix button aligments and remove unnecessary styles Apr 16, 2025

wxiaoguang changed the title ~~Fix button aligments and remove unnecessary styles~~ Fix button alignments and remove unnecessary styles Apr 16, 2025

wxiaoguang force-pushed the fix/release-btn-style branch from 3d7db9f to a0150b7 Compare April 16, 2025 03:38

wxiaoguang approved these changes Apr 16, 2025

View reviewed changes

wxiaoguang force-pushed the fix/release-btn-style branch from a0150b7 to 97b4eef Compare April 16, 2025 03:50

align all buttons

e9bcc17

wxiaoguang force-pushed the fix/release-btn-style branch from 97b4eef to e9bcc17 Compare April 16, 2025 03:54

kerwin612 added the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label Apr 16, 2025

GiteaBot and others added 3 commits April 16, 2025 14:33

Merge branch 'main' into fix/release-btn-style

99924e1

fine tune

75b5fcb

fine tune

f0c7b63

GiteaBot removed the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label Apr 16, 2025

wxiaoguang added 3 commits April 16, 2025 15:07

fine tune

42d7088

Merge branch 'main' into fix/release-btn-style

d7e7f38

# Conflicts: # web_src/css/repo/clone.css

Merge branch 'main' into fix/release-btn-style

84609ad

wxiaoguang enabled auto-merge (squash) April 16, 2025 07:44

wxiaoguang added the type/refactoring Existing code has been cleaned up. There should be no new functionality. label Apr 16, 2025

fine tune

31d0417

wxiaoguang merged commit bde014e into go-gitea:main Apr 16, 2025
26 checks passed

GiteaBot added this to the 1.25.0 milestone Apr 16, 2025

kerwin612 deleted the fix/release-btn-style branch April 16, 2025 08:20

lunny modified the milestones: 1.25.0, 1.24.0 Apr 16, 2025

kerwin612 mentioned this pull request Apr 24, 2025

Fix button alignments #34276

Merged

lunny added a commit that referenced this pull request Apr 27, 2025

Fix button alignments (#34276)

533b8b2

Continue with #34206. --------- Co-authored-by: wxiaoguang <[email protected]> Co-authored-by: Lunny Xiao <[email protected]>

kerwin612 mentioned this pull request Apr 29, 2025

Fix button alignments #34307

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix button alignments and remove unnecessary styles #34206

Fix button alignments and remove unnecessary styles #34206

kerwin612 commented Apr 15, 2025

silverwind commented Apr 15, 2025

kerwin612 commented Apr 15, 2025 •

edited

Loading

silverwind commented Apr 15, 2025

wxiaoguang left a comment •

edited

Loading

wxiaoguang commented Apr 16, 2025

wxiaoguang Apr 16, 2025

wxiaoguang Apr 16, 2025

wxiaoguang Apr 16, 2025

wxiaoguang Apr 16, 2025

wxiaoguang commented Apr 16, 2025

GiteaBot commented Apr 16, 2025

Fix button alignments and remove unnecessary styles #34206

Fix button alignments and remove unnecessary styles #34206

Conversation

kerwin612 commented Apr 15, 2025

silverwind commented Apr 15, 2025

kerwin612 commented Apr 15, 2025 • edited Loading

silverwind commented Apr 15, 2025

wxiaoguang left a comment • edited Loading

Choose a reason for hiding this comment

wxiaoguang commented Apr 16, 2025

wxiaoguang Apr 16, 2025

Choose a reason for hiding this comment

wxiaoguang Apr 16, 2025

Choose a reason for hiding this comment

wxiaoguang Apr 16, 2025

Choose a reason for hiding this comment

wxiaoguang Apr 16, 2025

Choose a reason for hiding this comment

wxiaoguang commented Apr 16, 2025

GiteaBot commented Apr 16, 2025

kerwin612 commented Apr 15, 2025 •

edited

Loading

wxiaoguang left a comment •

edited

Loading