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.

Sign up for GitHub

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

Jump to bottom

Paginator & menu of tables/grids/cruds & Tabs not breaking properly on small width columns #1780

Open
mkrecek234 opened this issue Apr 25, 2022 · 2 comments · May be fixed by #1973
Open

Paginator & menu of tables/grids/cruds & Tabs not breaking properly on small width columns #1780

mkrecek234 opened this issue Apr 25, 2022 · 2 comments · May be fixed by #1973

Comments

@mkrecek234
Copy link
Contributor

mkrecek234 commented Apr 25, 2022 •
edited
Loading

Steps to reproduce:

  • e.g., add three columns in a view
  • add a crud with menu bar and paginator in the first column
  • fill with sufficient data to have many pages, so paginator is wider

Error:

  • menu bar does not break responsively into next line (or better: fold into burger menu)
  • Paginator does not responsively break properly into two lines - exceeds width into next column

image

image

Expected result:

  • Menu folds down into burger menu (or at least render in multiple lines)
  • Paginator folds into menu with drop-down to select page, or at least breaks into multiple lines, does not exceed column width of outer view, even if many pages have to be displayed.
@mkrecek234 mkrecek234 changed the title Paginator of tables not breaking properly on small width columns Paginator & menu of tables/grids/cruds not breaking properly on small width columns Apr 26, 2022
@mvorisek
Copy link
Member

mvorisek commented Apr 27, 2022 •
edited
Loading

flex-wrap: wrap set for selector .ui.pagination.menu fixes this issue:

image

tested on demos/interactive/paginator.php demo

FUI issue: fomantic/Fomantic-UI#2345

@mkrecek234
Copy link
Contributor Author

mkrecek234 commented Jan 21, 2023 •
edited
Loading

@mvorisek The FUI class ui menu will easily break properly on mobile devices if we add stackable class to it. Tested on Crud. This will fix it for grid/crud menus properly. Can we include your paginator improvement as well into develop now?

See PR #1973

@mkrecek234 mkrecek234 linked a pull request Jan 21, 2023 that will close this issue
Draft
@mkrecek234 mkrecek234 changed the title Paginator & menu of tables/grids/cruds not breaking properly on small width columns Paginator & menu of tables/grids/cruds & Tabs not breaking properly on small width columns Jan 21, 2023
@mvorisek mvorisek mentioned this issue Jan 23, 2023
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Fix Tabs/Menu/Paginator wrapping when width is too small atk4/ui
2 participants
@mvorisek @mkrecek234