For Layouts 90 / 39 / 59 / 69 how do I fix the slide-out menu from overlaying the phone icon’s status bar?

Home Documentation How To For Layouts 90 / 39 / 59 / 69 how do I fix the slide-out menu from overlaying the phone icon’s status bar?

For Layouts 90/39/59/69, the slide-out menu may overlay the status bar of the phone (where the icons reside).  Follow the instructions below to correct this:

 

1) Log into your App Manager and select your app.

2) Click Colors from the left-hand-side of the screen (or the middle of the screen).

3) Scroll down to the Advanced SCSS box. If there is already code in the advanced SCSS box, do not remove it.  Start a new line “after” the last character in the box, then paste the above code.

For Layouts 39, 59 and 69

/**Begin fix layouts 39 59 and 69 status bar overlay*/
.layout.l39 .sidenav { top: 20px; padding-top: 0;}
.layout.l59 .sidenav { top: 20px; padding-top: 0;}
.layout.l69 .sidenav { top: 20px; padding-top: 0;}
/**End fix layouts 39 59 and 69 status bar overlay*/

For Layout 90

/**Begin fix layout 90 status bar overlay*/
.layout.l90 .sidenav { top: 15px; }
.layout.l90 #main .row { padding-top: 15px !important }
.layout.l90 .slider { top: 65px; }
/**End fix layout 90 status bar overlay*/

 

4) Click Save.

 

NOTE: Only use the code that’s in the Comments section above.  Don’t paste where it says “For Layout…”.

Comments are closed.