Change size of font Off-Canvas menue / submenue - Forum | JoomShaper
Solved Helix Framework

Change size of font Off-Canvas menue / submenue

Asked by Joerg Distler 5 months ago Last activity 5 months ago

Hi! How can I change the font size in the menu? 1.5 rem / submenu 1.4 rem, further submenu 1.3.
Is it also possible to change the direction of the menu arrow?

Best Jörg

Accepted answer

Marked as the solution
Ziaul Kabir Staff
5 months ago

Remove previous css, try this:

/* Top level */
.offcanvas-menu .offcanvas-inner ul.menu > li > a,
.offcanvas-menu .offcanvas-inner ul.menu > li > span {
    font-size: 1.5rem !important;
    line-height: 1.2 !important;
}

/* First submenu */
.offcanvas-menu ul.menu .menu-child > li > a,
.offcanvas-menu ul.menu .menu-child > li > span {
    font-size: 1.4rem !important;
    line-height: 1.2 !important;
}

/* Deeper submenu */
.offcanvas-menu ul.menu .menu-child .menu-child > li > a,
.offcanvas-menu ul.menu .menu-child .menu-child > li > span {
    font-size: 1.3rem !important;
    line-height: 1.2 !important;
}

Thanks

4 more replies

Oldest first Newest first Most helpful
Ziaul Kabir Staff
5 months ago

Hi Jörg,

Thanks for reaching out to us.

You can control both the font sizes and the submenu arrow direction using custom CSS.

🔤 Font sizes (Off-Canvas menu)

Add the following to your custom CSS:

.offcanvas-menu .menu a {
    font-size: 1.5rem;
}
/* First level submenu */
.offcanvas-menu .menu .menu-child a {
    font-size: 1.4rem;
}
/* Deeper submenu levels */
.offcanvas-menu .menu .menu-child .menu-child a {
    font-size: 1.3rem;
}

➡️ Change submenu arrow direction

To adjust the arrow direction, use:

.offcanvas-menu .menu-toggler::after {
    transform: rotate(90deg);
}

You can adjust the rotation as needed:

* 90deg → right
* 0deg → down
* -90deg → left

Let me know is it help or not.

Best Regards,

Joerg Distler Asked this
5 months ago

Hey
Thank you for the answer.
I added the first code to the CSS, but it's not displaying correctly.
The font size of the main menu is fine, the first submenu hasn't changed, but the sub-submenu is in uppercase.
What's wrong here?

Best regards!

Jörg

Joerg Distler Asked this
5 months ago

Thank you very much!!
Good Luck! Have a great day!

Ziaul Kabir Staff
5 months ago

You are welcome. We greatly value your opinion and would love to hear your feedback about SP Page Builder. If you could spare a moment, it would mean a lot to us!

You can share your review here:

Joomla Extensions Directory

Trustpilot

Log in to reply.