Impulse theme underline search bar on mobile menu

[Luxurymrkt]

Hi,

im looking to underline the search bar only on the mobile menu like the photo on amiri.com

• my site is https://luxurymrkt.com

thanks in advance,

mike

[made4Uo]

Hi @Luxurymrkt ,

You can try the code below.

1. From your Admin Page, click Online Store > Themes >Actions > Edit code
2. In the Asset folder, open the theme.css
3. Paste the code below at the very bottom of the file.

@media only screen and (max-width: 750px) {
form#HeaderSearchForm {
    min-height: 40px;
    margin: auto;
}
input.site-header__search-input {
    border-bottom: 2px solid;
}
}

[Luxurymrkt]

Hi unfortunately this didn’t work.

also I just want to underline search on mobile menu not outside the mobile menu drawer . Snippets / drawer . Is there another code that might work?

[Luxurymrkt]

Sure please leave your solution here so others can benefit

[made4Uo]

Oh. Sorry @Luxurymrkt . I misunderstood.

You can try the code below. Replace the code with this instead

1. From your Admin Page, click Online Store > Themes >Actions > Edit code
2. In the Asset folder, open the theme.css
3. Paste the code below at the very bottom of the file.

@media only screen and (max-width: 750px) {
input.input-group-field {
    border-bottom: 2px solid;
}
}

[Luxurymrkt]

Worked amazing! Any chance you know how to reduce the white space between image and close button

[made4Uo]

HI @Luxurymrkt ,

You can add the code below to the theme.css

div.drawer__scrollable {
    padding-top: 0;
    margin-top: -1rem;
}

[Luxurymrkt]

Amazing thanks so much!!!