Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Action kebabs for tables: open to the right rather than the left #3357

Open
4 tasks
zandercymatics opened this issue Jan 16, 2025 · 3 comments
Open
4 tasks
Assignees
Labels
dev issue is for the dev team

Comments

@zandercymatics
Copy link
Contributor

zandercymatics commented Jan 16, 2025

Issue description

When clicking the action kebabs on our tables (such as domain request and member), their accordion content should be right aligned rather than left aligned.

Acceptance criteria

  • Our kebab style is adjusted such that they are right aligned rather than left aligned.
  • For the domain request table, the accordion content is not "cut off" due to overflow-x styles.
  • Edge cases like the kebab display under the last record on the table are accounted for, or the "expand" dropdown for the member table.
  • Apply these changes to any case where we have kebabs in a table

Additional context

While setting the content style to "right: auto" will work for the member table, it is worth noting that this is not the case for the domain request table. Due to differences in how overflow-x is defined, this will cause the content to get "cut off" as it expands into the table directly. This will need to be accounted for - see the linked slack thread for more context on this.

Current display:
Image

Desired display:
Image

See this thread for more context

Links to other issues

Implementation notes:

Change the behavior of the overflow above a certain breakpoint and set the kebob positioning to whatever we want. Will only work on larger screens. If that does not work, dynamically add/remove the responsive table wrapper class based on screen size. Either way, we'd be creating 2 different layout schemes for these tables, plus reconciling one of these with the member table so we have some consistency. Might be tricky and warrants its own ticket.

@zandercymatics zandercymatics added the dev issue is for the dev team label Jan 16, 2025
@zandercymatics zandercymatics moved this from 👶 New to ⚙ Dev Parking Lot in .gov Product Board Jan 16, 2025
@zandercymatics zandercymatics changed the title Table action kebabs: open to the right rather than the left Action kebabs for tables: open to the right rather than the left Jan 16, 2025
@abroddrick
Copy link
Contributor

Added a message to this thread to confirm with Gaby if this is needed. Will hold on marking this as ready in the meantime

@abroddrick
Copy link
Contributor

Gaby confirmed this is still desired, removing from dev parking lot

@abroddrick abroddrick moved this from ⚙ Dev Parking Lot to 🎯 Ready in .gov Product Board Jan 22, 2025
@abroddrick
Copy link
Contributor

Temporarily slotting for 64 as it would be good to do this one relatively soon

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
dev issue is for the dev team
Projects
Status: 🎯 Ready
Development

No branches or pull requests

3 participants