- This topic has 6 replies, 2 voices, and was last updated 3 years, 8 months ago by
.
-
Posts
-
Hi!
I’m having difficulty with a couple of CSS customizations:
1) Adding a border that goes around the entire navigation bar on desktop only (see image in private area) without impacting the mobile design.
2) Changing the active font color on desktop + mobile without impacting the rest of the design on (when I use the option in the Customizer it changes the border/background color as well, which is why I want to use CSS).
Customer Support
Hi Dmitrii,
Here’s a CSS you may try adding through Appearance > Customize > Additional CSS:
@media (min-width: 1025px) { /* CSS in here for desktop only */ .navigation-search.nav-search-active { left: unset; max-width: 95%; } span.menu-bar-item.search-item.active.close-search { border: solid 1px rgb(174, 174, 174); border-left: none; } } .inside-navigation input.search-field { color: rgb(0,0,0); }You may modify the values to your preference.
Hope this helps!
Works great, thanks!
The only part that doesn’t seem to reflect is this section: .inside-navigation input.search-field {
color: rgb(0,0,0);
}The font color remains the same when you start typing.
Try replacing that with this:
nav#site-navigation .inside-navigation input.search-field { color: rgb(0,0,0); }Kindly let us know how it goes.
That works, but it also changes the border/outline color on mobile.
But it’s not that big of a deal, I’ll change it later.
Thank you sir!
I see. You’re welcome Dmitrii!
Resolved.
- You must be logged in to reply to this topic.
