Project:
View Revisions: Issue #52080 | [ 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 |