Draft: Resolve "Make the table element responsive"
What is in this MR
Adds default responsiveness to TableElement
and an option to stack the fields in tablet
and mobile
views, requiring no horizontal scrolling in these modes.
Screenshots
-
Working in page preview:
table-responsiveness -
Configuration in the editor:
table-responsive-config
zdm
compatible as it does not make responsive_layout
property null
by default.
How to test this MR
- Add a new table element connected to a data source
- Add lots of columns to test the horizontal behavior.
- In the table element form there should be a new
Responsive layout
dropdown that allows you to select betweenHorizontal scroll
andStack fields
- Play with the different combinations in the editor: per each dropdown value test the website in
desktop
,tablet
andmobile
modes. - The table show automatically update based on these properties.
Merge Request Checklist
-
changelog.md has been updated if required. -
New/updated Premium/Enterprise features are separated correctly in the premium or enterprise folder -
The latest Chrome and Firefox have been used to test any new frontend features -
Documentation has been updated -
Quality Standards are met -
Performance: tables are still fast with 100k+ rows, 100+ field tables -
The redoc API pages have been updated for any REST API changes -
Our custom API docs are updated for changes to endpoints accessed via api tokens -
The UI/UX has been updated following UI Style Guide
Closes #2523
Edited by Afonso Silva