Repository navigation
Conversation
oandregal
added
[Type] Enhancement
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
oandregal
changed the title
|
Size Change: +949 B (+0.01%) Total Size: 6.84 MB
ℹ️ View Unchanged
|
Member
Author
|
Pending further testing, IMO, this is working well for the resting state, but the hover/selected states could be improved. The vertical border of the actions column makes the primary actions overlay look disconnected. How do you feel about this approach @jameskoster? Ideas to improve? Screen.Recording.2026-02-18.at.11.44.39.mov |
Contributor
|
I'm not entirely convinced about this because it can make action buttons look like the contents of cells in other columns. Excuse the crude mockup, but maybe expanding the entire column might work better? Screen.Recording.2026-02-18.at.15.35.29.movI don't know if that's feasible without reflow though. A simpler change might be to add an
|
Member
Author
|
Explored this, which connects the primary actions visually with the three-dots button: Screen.Recording.2026-02-19.at.09.56.38.movThough, I've come to dislike the overlay approach because, well, it overlaps the content — preventing users from seeing some columns when there's horizontal scroll, selecting text, or clicking. |
Member
Author
|
I'm trying the unpadded option at #75721 |
Contributor
Isn't there a container we could add some padding to, to ensure all columns are accessible when horizontal scrolling occurs? 🤔 |
Member
Author
|
@jameskoster I'm not sure I follow. If the actions is an overlay over the existing columns, there's a chance they'll cover the last columns (whether there's horizontal scrollign or not). Unless you're thinking or something else? 🤔 I've implemented the alternative (reducing padding) at #75721 |
Contributor
Not if there's right padding equal to the width of the actions column, right? Appreciate that might be difficult to implement in html tables though. |
Member
Author
Yeah, but then what's the benefit of the overlay? We could not reclaim that space for other columns, so we could just stay as it is (asign it to the actions column). |
Contributor
|
The benefit is that the Actions column is only as wide as the column header until you hover the row, like your video in #75671 (comment). I guess I misinterpreted your comment about "preventing users from seeing some columns when there's horizontal scroll". I thought you were referring to the fact that certain columns would be entirely inaccessible because they're obscured by the actions column when its visible. Not just that content would be obscured until the user scrolls. I'm not sure how much of an issue that is tbh. |
2 of 6 tasks
This branch has not been deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #75668, #80375
What?
Reduces the actions column width in the DataViews table layout by absolutely positioning primary action buttons so they only appear as an overlay on hover, instead of reserving permanent column space.
Why?
When there are multiple primary actions in the table layout, the actions column takes up excessive horizontal space.
How?
<div className="dataviews-primary-actions">in the PrimaryActions component.display: contentson the wrapper by default so it’s transparent to flex layout in other contexts (activity layout, etc.).display: flex; position: absolute; right: 100%— positioning it to the left of the kebab menu button. Hidden withopacity: 0by default, revealed on hover/focus.Testing Instructions
Screen.Recording.2026-02-18.at.11.26.11.mov