2 sets of nav/link colours for dark mode support?

Hello,

Glad you like the plugin. Which colour options exactly are you referring to? Can you please share a link to your website?

Many thanks,

Oliver

Hi Oliver,
thinking it over, it would probably need to add a 2nd “Dark Mode” set on your following settings:
*Nav Options> Nav Burger Icon Color, Nav Link Color, Current Link Color, Nav Link Hover Color, Nav Mobile Link Hover Color
*Content Options> Content Link Color, Content Link Hover Color

With these changes, your support for dark mode would be excellent. The dark mode is a key feature of twentytweny-one, as much as I get. The readers on my pages give good feedback on this.

My current page under construction (the navigation menues are to come, but you see the colours of content links…): Enjoy the connection of living and timeless twins (twinconnection.space)

Kind regards, Chris

Hi Chris,

This is now quite an old plugin so it may be a while before we can dedicate the development time to add these options. In the meantime, please add this CSS to “Customizer – Additional CSS”, changing the HEX values of each item to that which you require and confirm if it works for you …

/* Nav Burger Icon Color */
.is-dark-theme .menu-button-container #primary-mobile-menu {
color: #ffffff;
}

/* Nav Link Color */
.is-dark-theme .primary-navigation a:link,
.is-dark-theme .primary-navigation a:visited,
.is-dark-theme .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-plus svg,
.is-dark-theme .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-minus svg {
color: #ffffff;
}
.is-dark-theme .primary-navigation #menu-item-search.menu-item>.svg-icon {
fill: #ffffff;
}

/* Current Link Color */
.is-dark-theme .primary-navigation .current-menu-item > a,
.is-dark-theme .primary-navigation .current_page_item > a {
color: #ffffff;
}

/* Nav Link Hover Color */
.is-dark-theme .primary-navigation a:hover,
.is-dark-theme .primary-navigation .sub-menu .menu-item > a:hover {
color: #ffffff;
}
.is-dark-theme .primary-navigation #menu-item-search.menu-item>.svg-icon:hover {
fill: #ffffff;
}

/* Nav Mobile Link Hover Color */
@media only screen and (max-width: 481px) {
.is-dark-theme .primary-navigation a:hover {
color: #ffffff;
}
}

/* Content Link Color */
.is-dark-theme .site-main a {
color: #ffffff;
}

/* Content Link Hover Color */
.is-dark-theme .site-main a:hover {
color: #ffffff;
}

Hi Oliver,
this works for me just perfect! I started with the first values and everything seems fine. Having fun working out new possibilities! Yes, probably better invest your work into new projects, I agree. I am happy – I always have been – with your product and support! So my request is perfectly completed.

So have a good Sunday Roast at The Plough at Crowhurst! ??
I just supported you for it, enjoy!
Thank you very much, Christian

Well Chris that is extremely kind of you. It’s a rare occasion that people show their appreciation so thank you!

I’ll take a look at adding some controls when I get a moment, they aren’t complicated it’s just the time and I may be able to squeeze it in between jobs today for you to repay your generosity.

Hey Oliver! Just leave it as it is if you can. My appreciation goes to what you’ve done. Just take it and enjoy! Really. Take a breather in between and have a coffee instead of squeezing it in between jobs. I’m perfectly fine with the solution you offered. If you still feel obliged to give something back in return for appreciation, then take another look at my homepage. ?? Take care, Chris

OK! Thanks again Chris, will do! Oliver