Problem with mobile menu

mark256

Hello.

The problem is being solved in another topic. https://www.joomlart.com/forums/d/47912-t4-bs5-blank-jquer-error/reply
Please go to problems: 2 and 3.

mark256

Fa menu item icon for the mobile version is not displayed.
The menu is not fully displayed, both on the PC version and for the mobile version, if the name of the menu item is large.

dominic

Hi mark256

2/ I have fixed this issue, it conflicts with the js file that I provided, I have updated the solution to fix issue 1

3/ You can add the following CSS code to resolve this issue:

.t4-offcanvas .t4-off-canvas-body .t4-module .module-inner h3.module-title {
    padding: 0 3rem;
}

.t4-offcanvas .t4-off-canvas-body .t4-module .module-inner {
     padding: 0 0.2rem;
}
 
.t4-offcanvas .t4-off-canvas-body .navbar.drilldown-effect .navbar-nav .nav-item {
    margin: 0 0.8rem;
}

mark256

Hello. I have overwritten the site backup. Because the site stopped working. After adding your code, it is still displayed incorrectly.

dominic

Hi mark256,
You can add of this CSS code:

.t4-offcanvas .t4-off-canvas-body .navbar .dropdown-menu .dropdown-item,
 .t4-offcanvas .t4-off-canvas-body .navbar .dropdown-menu .nav-link {
    white-space: normal;
}

mark256

dominic work. Thanks.

Could you tell me how to solve the problem with displaying icons in the mobile menu? Or did you mean that there will be an update in the future that will fix this?

dominic

Hi mark256,
I have checked and see that the menu icons are showing well.

mark256

Hello. Fa icons are not displayed in the mobile version.

And in the mobile version it’s like this:

dominic

Hi mark256,
I have added the following CSS code to Backend > site template styles > t4_bs5_blank > Tools > Custom CSS:

@media (max-width: 992px) {
    .t4-megamenu .navbar-nav > li:last-child > a.fa-bookmark {
    position: relative;
    padding-left: 26px;
}
.t4-megamenu .navbar-nav > li:last-child > a.fa-bookmark span:before {
    content: "\f02e";
    position: absolute;
    left: 10px;
}
}

mark256

dominic Thanks