[Resolved] Bug with merging the header/navigation & content

[Mathieu]

Hi 🙂

I’ve been digging at this for a few hours now and can’t find a solution : I would like to have my navigation menu (nav icon + menu + sticky) in another color on the single posts.

I have merged my header and navigation with the content on the single posts, so I know the solution is in this module.
But for some reason, if I try to change the colors of the nav menu (or any other option), it resets the background color and text color options in the “content” tab. If I click on anything else after I’ve changed those two colors, they are resetted to default.

Could it be a conflict with another plugin ?

Thanks a lot !

[Leo]

Hi there,

I’ve actually noticed that bug and logged as an issue already.

I can provide CSS solution in the mean time if you need. Just link me to your site 🙂

[Mathieu]

Thanks for the quick reply !

Is there a way to send you this info privately ? Website is behind a password for now 🙂

[Leo]

Use Account Issue here and reference the topic: https://generatepress.com/contact/

[Leo]

Can you first guide me to the page in question, then let me know exactly what you want to achieve?

Thanks for your patience 🙂

[Mathieu]

I have created this specific header/nav/content for the single posts, that is in “News & Insights”, any article.

I managed to have a color overlay on the featured images and an appropriate color for the title, but I can’t change the nav colors and logo without resetting the overlay.

Thanks a lot !

[Leo]

Try this CSS to change the background color of single posts navigation:

.single .main-navigation {
    background-color: #ffffff;
}

So the page header navigation overwrite doesn’t work either?

[Tom]

This just looks like the value has been saved incorrectly: https://www.screencast.com/t/xKj1vouCJW

Can you check the value and make sure the values have a # in front of the hex code?

[Mathieu]

@Leo : I’d like my background transparent and my text white.

@Tom : I’ve added a .single in front of that part of the css and it worked ! I’ve had to do the same for the title of the single post

For some reason I’ve managed to add the alternate color logo on the single posts nav this time – however I’d like it to revert to the classic (colorful) logo as soon as the page is scrolled down and the white background appears. Is there a way to do that ?
Another thing : the alternate color logo is replaced with the standard logo on mobile screens …

Sorry for being a pain, thanks for your time !

[Mathieu]

Ok I’ve managed a workaround :

.single nav .sticky-logo a:first-child {
    background-image: url('/wp-content/uploads/2018/01/logo_white_small.png');
    background-repeat: no-repeat;
    background-position: center center;
	padding:10px;
    min-height: 50px;
    min-width: 170px;
}
.single nav.is_stuck .sticky-logo a:first-child {
    background-image: url('/wp-content/uploads/2017/12/Quividi-new-logo.png');
	background-repeat: no-repeat;
    background-position: center center;
	background-size : 125px auto ;
}
.single nav .sticky-logo a:first-child .header-image {
    display: none;
}

Does not work for mobile/tablet view though …

[Mathieu]

And this did the trick for mobile :

@media (max-width: 768px) {
	.single nav .site-logo a:first-child {
    background-image: url('/wp-content/uploads/2018/01/logo_white_small.png');
    background-repeat: no-repeat;
    background-position: center center;
	padding:10px;
    min-height: 50px;
    min-width: 170px;
}
.single nav.is_stuck .site-logo  a:first-child {
    background-image: url('/wp-content/uploads/2017/12/Quividi-new-logo.png');
	background-repeat: no-repeat;
    background-position: center center;
	background-size : 115px auto ;
}
.single nav .site-logo   a:first-child .header-image {
    display: none;
}
}

Thank you for your time 🙂

[Leo]

Glad you found the solution!

That was all you 🙂

[Author]

Posts