[Resolved] Navigation opaqueness problem on Volume theme

[Yungum]

To whom it may concern,
I am writing this topic to ask navagation opaqueness problem on Volume theme.
This theme is working properly, however, since I accidentally deleted Slideout Header codes on Element, navigation opaqueness doesn’t seem to appear like Volume theme.
I tried to copy Volume demo site div but not working.
Currently my code is this.

<div class="slideout-header">
	<span class="custom slideout-toggle"><a><!-- custom slideout toggle --></a></span>
	<span class="slideout-exit"><a><!-- custom slideout exit --></a></span>
</div>

How can I redo my code and work just like Volume navigation?
Thank you in advance.

-Yungum

[David]

Hi there,

did you resolve the issue? I cannot see a difference – let me know and if needed send me a screenshot.

[Yungum]

Thank you David for the reply.
I still have a problem and maybe my explanation was not enough.
Can I send you screenshots?
If you let me know your email address I will send you problem screenshots.
Thank you.

-Yungum

[David]

If you can upload your screenshots to a share drive eg. Google Drive then attach the share links here or use one of the many online screenshot providers.

[Yungum]

David,
I uploaded a question to Google drive.
Please check the doc.
Thank you.

[David]

Ah ok.
So in Customizer > Additional CSS look for this:

.main-navigation .inside-navigation .menu .slideout-toggle,
button.menu-toggle,
.slideout-overlay {
    display: none !important;
}

And change it to:

.main-navigation .inside-navigation .menu .slideout-toggle,
button.menu-toggle,
.slideout-overlay .slideout-exit {
    display: none !important;
}

Then if you want to change the overlay color from default then use this CSS:

.slideout-overlay {
    background-color: rgba(255, 255, 255, 0.6);
}

[Yungum]

Thank you David.
It works perfectly.
Have a good day 🙂

-Yungum

[David]

Glad to be of help.

[Author]

Posts