As we have already known, since version 10, PHPMaker started using Twitter Bootstrap as the front-end framework for the generated web applications. Up to version 10.0.5, PHPMaker was still using Bootstrap 2.3.2; the latest Twitter Bootstrap stable for version 2. PHPMaker uses Modal Dialog to display the popup small window. Unfortunately, this Modal Dialog window has not supported for mobile-responsive-design. In other words, the width of its window will not be auto-adjusted to the screen width in the mobile device; which is narrower than the computer screen width. The most left and right of the window will be truncated.
To fix the issue above, then I just updated my two Extensions which will handle the displaying of Modal Dialog window so that it will support for mobile-responsive-design. They are: MasinoHeaderFooter10 and MasinoCustomCSS10. Please download them and replace the existing ones with the updated ones, afterwards don't forget to regenerate ALL your script files.
You may see the demo by visiting this link. Just click the links Terms and Conditions or About Us on the Footer section at the bottom of the page. You should see the Modal Dialog window appears. Try to resize/adjust the width of your browser window become narrower to see it in action. Now the width of Modal Dialog window will automatically be adjusted to the width of your browser.
This change also will apply to the Help Modal Dialog window. Try it by clicking on the question mark icon, for example on Categories menu, then you will see that its window will be auto-adjusted to the screen width of your narrower browser.
Enjoy it. 🙂
Leave a Reply
You must be logged in to post a comment.