Solved Helix Framework

Auto offcanvas submenus issues

Asked by COTTIN Rudy 1 year ago Last activity 1 year ago

Hi,

I'm using Helix ultimate 2.1.1 on Joomla 5.2.2 with an auto off-canvas based on main menu.
There's a display issue with the sub-menus (they use the font size of body.css) and the menu-togglers associated are in the same position (one on top of the other).

If I desactive the "top:50%" property in "template.css : .offcanvas-menu .offcanvas-inner ul.menu > li.menu-parent li.menu-parent .menu-toggler", I can see the 2 menu-togglers, but in wrong position with a top offset.

Could you give me a patch in custom CSS to fix this issues (font and position)?
Thanks a lot.

Accepted answer

Marked as the solution

Mehtaz Afsana Borsha Staff

1 year ago

Could you please keep a full site backup and remake this portion?

You can follow this documentation below:

https://www.joomshaper.com/documentation/helix-framework/menu-navigation#:~:text=How%20to%20build%20advanced%20Submenu,example%20of%20three%20columns%20submenu.

8 more replies

Mehtaz Afsana Borsha Staff

1 year ago

Thanks for contacting us and sorry for your issue. Could you please give me a screenshot of your issue?

-Regards.

COTTIN Rudy Asked this

1 year ago

I also gave you the site url in hidden content in my first message.

Regards.

Mehtaz Afsana Borsha Staff

1 year ago

Could you please give me that specific page link?

COTTIN Rudy Asked this

1 year ago

There's no specific page link. That concerns the Off-Canvas menu in the header.
Click on off-canvas menu icon and deploy menu "Activites". You should see two sub-menus with wrong font (inherited from body.css) and toggler icons in wrong top position (not aligned with their sub-menus and one on top of the other).

Regards.

Mehtaz Afsana Borsha Staff

1 year ago

Use this CSS in your custom.css file

span.nav-header{
  font-size: 16px;
}

COTTIN Rudy Asked this

1 year ago

Hi,
Thanks for your reply. It fix the font issue.
But what solution to fix the wrong top position of toggler icons ? The 2 icons are in the same position, one on top of the other.

Thanks for your help.

Mehtaz Afsana Borsha Staff

1 year ago

Are you talking about this portion?

https://prnt.sc/vdkQ6ji7UneN

Isn't it ok? What kind of problem are you facing? Could you please explain it a bit more?

COTTIN Rudy Asked this

1 year ago

Hi,

Yes, issue is in this portion.
The sub-menus "Activites/Simulation" and "Activites/Developpement de logiciels" have each sub-menu but we can see only 1 toggler. In fact, there are 2 togglers (1 for each sub-menu) but exactly in same position.

If you click on toggler, that deploys sub-menu "Activites/Developpement de logiciels" and you should see the other toggler under the first, but not clickable.

http://prnt.sc/kvxsRfCCr-rS
http://prnt.sc/wzUuvJS20d-3

The off-canvas should be like this, with 2 togglers :
http://prnt.sc/Ue2Rv7pzQL0D

Regards.

Mehtaz Afsana Borsha Staff

1 year ago

Right now it seems like this in my end.

COTTIN Rudy Asked this

1 year ago

Hi,

The issue is on togglers of sub-menus. See the screenshots I've sent in my previous message.

Actual wrong sub-menus : https://prnt.sc/o4mqvaJIUiIM

It should be like this : https://prnt.sc/Ue2Rv7pzQL0D

Thanks.

COTTIN Rudy Asked this

1 year ago

Hi,

All is OK now.
Issue was due to sub-menus that were "Menu Heading" instead of "URL" as it's specified in your link.

Thank you for your help.

Mehtaz Afsana Borsha Staff

1 year ago

Glad to know that its now working. You are welcome.