[Resolved] LInk to Offcanvas panel through menu item

[Fernando]

Try adding this CSS:

button.menu-toggle[aria-expanded="false"] .fl-builder-content {
    display:none;
}

[John]

Hi Fernando,
Thank you – I have added this css but still am very confused about how this is going to work.
I don’t want to go beyond the scope of support so please just let me know if this is not going to work.

The mobile version still does not have any way to view the menu without clicking CONTACT.
This opens up the form and the menu.
But obviously this is not going to work.

Have you any other ideas or do I need to go back to the drawing board?

[Fernando]

Sorry, I think I’m misunderstanding you. Do you want the form to always appear on mobile? Or, if you can show a sketch of how it should look like, that would be great as well.

[John]

It’s OK – my explanation has been poor!

I have changed direction with how I will work this and will just link to a pop up.
Makes it much simpler.

Can you help me target the css to over ride the font clolr, line-height and padding in the .main-navigation .main-nav ul li a?
I want it to be:

.custom-menu-icon {
    background-color: #0091ad;
    border-radius: 25px;
    color: #ffffff!important;
    line-height: 10px;
    margin-left: 15px;
    padding: 0px 10px;
	
}

But it does not override the main site code:

.main-navigation .main-nav ul li a
{
  padding-left: 20px;
  padding-right: 20px;
  line-height: 60px;
  color: #783f76;
}

Any ideas on how I can target it better please?

[Fernando]

I see. Try this instead:

.custom-menu-icon > a {
    color: #ffffff!important;
    line-height: 10px;
    padding: 0px 10px;
}

[John]

Thank you for this @fernando
Sorry if I was not clear on what I wanted.
Cheers!

[Fernando]

You’re welcome John! No worries! Cheers!

[Author]

Posts