github-starred/gitea
2
0
Fork 0
mirror of https://github.com/go-gitea/gitea.git synced 2026-03-11 17:46:29 -05:00
Code Issues 2.6k Packages Projects Releases 100 Wiki Activity

Options button in the commit view is taller than Browse Source #11854

New Issue
Closed
opened 2025-11-02 09:49:46 -06:00 by GiteaMirror · 1 comment
GiteaMirror commented 2025-11-02 09:49:46 -06:00
Owner
Copy Link

Originally created by @rhdunn on GitHub (Oct 15, 2023).

Description

  1. Open Firefox 118.0.2.
  2. Navigate to the "Commits" list on a repository you have edit rights to.
  3. Click on the SHA1 hash of a commit.

URL: ad9c1583bd

Investigation

  1. Open the developer tools.
  2. Highlight the Operations button.
  3. Scroll down to the .ui.dropdown rule in the Rules tab.
  4. Deselect the line-height: var(--line-height-default) CSS rule.

After step 4 above, the height of the Options button shrinks to the same height as the Browse Source button.

The :root element defines the --line-height-default value as normal.

The .ui.button style has line-height: 1em;. Setting this on the Options div element makes the height consistent.

Conclusion

Firefox is prioritizing the .ui.dropdown rule for the line height when the classes ui dropdown button are used together. I'm not sure about other browsers.

There are several possible ways to fix this:

  1. Add a .ui.dropdown.button rule that sets line-height: 1em; consitent with the .ui.button rule.
  2. Modify the .ui.dropdown line height to be 1em to be consistent with .ui.button.
  3. Replace .ui.button { ... } with .ui.button, .ui.button.dropdown { ... } to make the button rule have a higher CSS priority than .ui.dropdown.

Gitea Version

1.21.0+rc1-23-g21f1e223d

Can you reproduce the bug on the Gitea demo site?

Yes

Log Gist

No response

Screenshots

image

Git Version

2.34.1

Operating System

Ubuntu

How are you running Gitea?

Building from source using the bindata option.

Database

SQLite

Originally created by @rhdunn on GitHub (Oct 15, 2023). ### Description 1. Open Firefox 118.0.2. 2. Navigate to the "Commits" list on a repository you have edit rights to. 3. Click on the SHA1 hash of a commit. URL: https://try.gitea.io/rhdunn/test-options-button/commit/ad9c1583bd7bf8f18bf20112494b5ba7b5d25c7f ## Investigation 1. Open the developer tools. 2. Highlight the Operations button. 3. Scroll down to the `.ui.dropdown` rule in the Rules tab. 4. Deselect the `line-height: var(--line-height-default)` CSS rule. After step 4 above, the height of the Options button shrinks to the same height as the Browse Source button. The `:root` element defines the `--line-height-default` value as normal. The `.ui.button` style has `line-height: 1em;`. Setting this on the Options div element makes the height consistent. ## Conclusion Firefox is prioritizing the `.ui.dropdown` rule for the line height when the classes `ui dropdown button` are used together. I'm not sure about other browsers. There are several possible ways to fix this: 1. Add a `.ui.dropdown.button` rule that sets `line-height: 1em;` consitent with the `.ui.button` rule. 2. Modify the `.ui.dropdown` line height to be `1em` to be consistent with `.ui.button`. 3. Replace `.ui.button { ... }` with `.ui.button, .ui.button.dropdown { ... }` to make the button rule have a higher CSS priority than `.ui.dropdown`. ### Gitea Version 1.21.0+rc1-23-g21f1e223d ### Can you reproduce the bug on the Gitea demo site? Yes ### Log Gist _No response_ ### Screenshots ![image](https://github.com/go-gitea/gitea/assets/47298/656b73d6-895d-4b88-9626-21d9d19273c9) ### Git Version 2.34.1 ### Operating System Ubuntu ### How are you running Gitea? Building from source using the bindata option. ### Database SQLite
GiteaMirror added the type/bug label 2025-11-02 09:49:46 -06:00
GiteaMirror commented 2025-11-02 09:49:48 -06:00
Author
Owner
Copy Link

@wxiaoguang commented on GitHub (Oct 15, 2023):

-> Improve dropdown button alignment and fix hover bug #27632

@wxiaoguang commented on GitHub (Oct 15, 2023): -> Improve dropdown button alignment and fix hover bug #27632
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
$20
$250
$50
$500
backport/done
💎 Bounty
docs-update-needed
good first issue
hacktoberfest
issue/bounty
issue/confirmed
issue/critical
issue/duplicate
issue/needs-feedback
issue/not-a-bug
issue/regression
issue/stale
issue/workaround
lgtm/need 2
modifies/api
modifies/translation
outdated/backport/v1.18
outdated/theme/markdown
outdated/theme/timetracker
performance/bigrepo
performance/cpu
performance/memory
performance/speed
pr/breaking
proposal/accepted
proposal/rejected
pr/wip
pull-request
Mirrored from GitHub Pull Request
 reviewed/wontfix
💰 Rewarded
skip-changelog
status/blocked
topic/accessibility
topic/api
topic/authentication
topic/build
topic/code-linting
topic/commit-signing
topic/content-rendering
topic/deployment
topic/distribution
topic/federation
topic/gitea-actions
topic/issues
topic/lfs
topic/mobile
topic/moderation
topic/packages
topic/pr
topic/projects
topic/repo
topic/repo-migration
topic/security
topic/theme
topic/ui
topic/ui-interaction
topic/ux
topic/webhooks
topic/wiki
type/bug
type/deprecation
type/docs
type/enhancement
type/feature
type/miscellaneous
type/proposal
type/question
type/refactoring
type/summary
type/testing
type/upstream
No Label type/bug
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
GiteaMirror ninjasurge
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/gitea#11854
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?