Skip to content

Fix text alignment in invocation grid rows - #22158

Draft
dannon wants to merge 1 commit into
galaxyproject:devfrom
dannon:fix/invocation-menu-text-alignment
Draft

Fix text alignment in invocation grid rows#22158
dannon wants to merge 1 commit into
galaxyproject:devfrom
dannon:fix/invocation-menu-text-alignment

Conversation

@dannon

@dannon dannon commented Mar 17, 2026

Copy link
Copy Markdown
Member

Fixes #21143.

The history name in SwitchToHistoryLink had two alignment issues when wrapping to multiple lines:

  1. The flex container used justify-content: space-between and align-items: center, which pushed the archive/purge icon to the far right and vertically centered it against multi-line text. Switched to baseline and dropped space-between.

  2. GLink renders as a <button> when no href/to prop is provided, and browsers default buttons to text-align: center. On single-line text this is invisible, but wrapped text center-aligns each line. Used a scoped :deep() selector to override this on the history link.

@dannon
dannon marked this pull request as draft March 17, 2026 14:40
@dannon

dannon commented Mar 17, 2026

Copy link
Copy Markdown
Member Author

Marking as draft — I want to add before/after screenshots and verify this doesn't have unintended consequences on other grid pages or SwitchToHistoryLink usages before requesting review.

@github-actions github-actions Bot added this to the 26.1 milestone Mar 17, 2026
@dannon
dannon force-pushed the fix/invocation-menu-text-alignment branch from be05608 to dcdc9eb Compare March 18, 2026 21:03
@mvdbeek mvdbeek moved this from Needs Review to In Progress in Galaxy Dev - weeklies Apr 7, 2026
@mvdbeek mvdbeek modified the milestones: 26.1, 26.2 May 19, 2026
SwitchToHistoryLink's flex container used space-between and center, which
pushed the archive/purge icon far right and vertically centered it against
multi-line text. Switched to baseline and dropped space-between. Also,
GLink renders as a button when no href/to is provided and browsers default
buttons to text-align: center — used a scoped deep selector to override
this so wrapped history names stay left-aligned.

Fixes galaxyproject#21143.
@dannon
dannon force-pushed the fix/invocation-menu-text-alignment branch from dcdc9eb to 5cf41ca Compare June 1, 2026 21:17
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

Status: In Progress

Development

Successfully merging this pull request may close these issues.

Text alignment in invocation menu suboptimal

2 participants