Hi everyone! We've had a lot of requests to customize both the location and size of the search bar in the top nav. Below are two examples of CSS you can use to adjust the search bar as needed. You can adjust the size of the search bar by adjusting the max-width.
Move the search bar to the center
.header__search {
max-width: 360px;
margin-left: auto;
margin-right: auto;
text-align: left;
border-radius: 4px;
font-size: 0.95rem;
background: white;
border: 1px var(--whites2) solid;
padding: 0 0.65rem;
justify-content: flex-start;
width: 100%;
transition: all 0.6s;
}
Move the search bar to the right
.header__search {
max-width: 360px;
margin-left: auto;
margin-right: 1rem;
text-align: left;
border-radius: 4px;
font-size: 0.95rem;
background: white;
border: 1px var(--whites2) solid;
padding: 0 0.65rem;
justify-content: flex-start;
width: 100%;
transition: all 0.6s;
}