Adjust the height of the menu in Layout 1.

Use the instructions below to adjust the menu height of Layout 1.

BEFORE

AFTER

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 box do not delete it! Simply add this code “below” the last character of code in the box.

/*** BEGIN: LAYOUT 1 - ADJUST MENU HEIGHT - OPTION 01 ***/

.layout.l1 {
ul.tabs {
li img {
width: 26px;
height: 26px;
max-height: 100%;
transform: translateY(-2px);
}
li p {
transform: translateY(-6px);
}
}
}
/*** END: LAYOUT 1 - ADJUST MENU HEIGHT - OPTION 01 ***/

You can also use this edit:

/*** BEGIN: LAYOUT 1 - ADJUST MENU HEIGHT - OPTION 02 ***/
.layout.l1 .tabs, .layout.l10 .tabs, .layout.l2 .tabs {
height: 75px;
padding: 4px;
padding-top: 0;
}
/*** END: LAYOUT 1 - ADJUST MENU HEIGHT - OPTION 02 ***/

You can also use this edit:

/*** BEGIN: LAYOUT 1 - ADJUST MENU HEIGHT - OPTION 03 ***/

.platform-ios{ .layout.l1 { ul.tabs { li img { width: 24px; height: 24px; max-height: 70%; transform: translateY(-5px); } li p { transform: translateY(-10px); } } }}

/*** END: LAYOUT 1 - ADJUST MENU HEIGHT - OPTION 03 ***/

4)Click Save.

NOTE: The edits above also work with other layouts. For example, to use it with layout 10, change the “l1” to “l10”.