Anonymous | Login
Project:
RSS
  
News | My View | View Issues | Roadmap | Summary

View Revisions: Issue #52080 All Revisions ] Back to Issue ]
Summary 0052080: [React POS Portrait] Payment Panel should be responsive
Revision 2023-04-26 12:19 by AugustoMauch
Description See https://openbravo.atlassian.net/browse/RM-5641 [^]

The Payment Panel should be responsive by itself, so it will be displayed properly regardless if we are in landscape or portrait, at with any screen resolution.

It will have two different behaviors.

If its width is higher (or equal) than 490px it should continue displaying as it is now (see image 1)

If its width is lower than 490px, and if the right one is empty, it should show only one single column (the left one) as it is (see image 2)

If its width is lower than 490px, and if the right one has content, it should show both columns, but with an applied zoom of 70%, in order to ensure both columns content is properly displayed, even in the more adverse case (see image 3)

PS: TIP for developers (As in “List view” project): You cannot rely solely in the clientWidth of the component in order to determina if >=490px or not, since there is a dynamic conversion due to the dynamic font-size defined at :root level.

The width you need to calculate the previous logic, comes from this operation

document.getElementById(<-- Payment Panel ID -->).clientWidth*10 / parseFloat(window.getComputedStyle(document.body).getPropertyValue('font-size'))



Revision 2023-04-26 10:44 by AugustoMauch
Description See https://openbravo.atlassian.net/browse/RM-5641 [^]


Copyright © 2000 - 2009 MantisBT Group
Powered by Mantis Bugtracker