Topic: Change focus color on search bar in search modal

Johan
April 17, 2024 at 11:44 pm

Hi!
I have been inspecting the code and I can’t figure out how to change the color when I type text in the search bar in the search modal.
When I type text the border gets blue, how do I change it?
And, how do I get the primary header menu centered?

Alvind

April 18, 2024 at 12:40 am

Hi there,

You can use this CSS to set a focus color of the search modal field:

#search-modal-input:focus {
   outline-color: blue;
}

And to center the menu:

@media(min-width: 769px) {
  .nav-float-right #site-navigation {
    margin-left: unset !important;
    flex: 1;
  }

  #primary-menu {
    margin: auto;
  }
}

Johan
April 18, 2024 at 1:17 am

Cool! Thanks a lot.
I see the search icon does appear a bit after the menu. Is it possible to get it after the last menu item instead?

David

April 18, 2024 at 4:56 am

Hi there,

change Alvinds second CSS rule to:


@media (min-width: 769px) {
    .nav-float-right #site-navigation {
        margin-left: unset !important;
        flex: 1;
    }

    #primary-menu {
        margin-left: auto;
    }
    .menu-bar-items {
        margin-right: auto;
    }
}

Johan
April 22, 2024 at 12:01 am

Perfect! Thanks.
David
April 22, 2024 at 3:26 am

You’re welcome

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

Are you a GenerateCustomer?

Just browsing?

Change focus color on search bar in search modal