|
Description
Martin Renvoize (ashimema)
2021-02-24 16:20:27 UTC
Created attachment 117279 [details] [review] Bug 27777: Set invoices table to fixed width This invoices table on the point of sale page should be set to `table-layout: fixed;` to prevent it from overflowing it's alloated fieldset. Test plan 1/ Play with various screen resolutions and zoom levels on the point of sale page (This is easily achieved with chrome developer tools and the 'device toolbar' options. 2/ Apply the patch and build the css from it. 3/ Play with the various screen resolutions again and this time note that the tables should not overflow their boundaries. 4/ Signoff Created attachment 117280 [details] [review] Bug 27777: (alternate) Improve tables on Point of Sale page for low screen resolutions This alternate solution makes these minor changes: - The Bootstrap grid classes are adjusted so that the breakpoint between the two-column layout and the single-column layout happens at a wider browser-width. - The DataTable configurations are modified to set "autoWidth" to "false," which gives us a more fluid behavior. Interesting.. I like your alternative.. though I actually removed the autoWidth in bug 26189.. confused why I'm not seeing the issues I saw there now here. As discussed on IRC, the editable fields in the 'This sale' table currently make the table column widths jump around when they're invoked via click.. it would be great to resolve that here too :) (In reply to Martin Renvoize from comment #4) > As discussed on IRC, the editable fields in the 'This sale' table currently > make the table column widths jump around when they're invoked via click.. it > would be great to resolve that here too :) See bug 27792 Created attachment 117322 [details] [review] Bug 27777: (alternate) Improve tables on Point of Sale page for low screen resolutions This alternate solution makes these minor changes: - The Bootstrap grid classes are adjusted so that the breakpoint between the two-column layout and the single-column layout happens at a wider browser-width. - The DataTable configurations are modified to set "autoWidth" to "false," which gives us a more fluid behavior. Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> I like Owens approach better and it works just as well, if not better.. Removing mine and signing off his :) Created attachment 117754 [details] [review] Bug 27777: (alternate) Improve tables on Point of Sale page for low screen resolutions This alternate solution makes these minor changes: - The Bootstrap grid classes are adjusted so that the breakpoint between the two-column layout and the single-column layout happens at a wider browser-width. - The DataTable configurations are modified to set "autoWidth" to "false," which gives us a more fluid behavior. Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Pushed to master for 21.05, thanks to everybody involved! Pushed to 20.11.x for 20.11.04 Doesn't apply cleanly to 20.05, please rebase if needed |