How can I code a round search bar for the expanse theme?

[system]

Hi

Please could you provide the code needed to make the search bar round for the expanse theme, I’ve attached an example below.

Kind Regards, Tom

[Zworthkey]

Hii, @Anonymous
Can you send me your store URL so,
I can resolve your problem.
Thank You.

[dmwwebartisan]

@Anonymous

Please share your store URL.

[system]

Hi

The Domain is: www.ribbleappliances.co.uk with the expanse theme.

[system]

Hi

The domain is: www.ribbleappliances.co.uk

[dmwwebartisan]

@Anonymous

Please add the following code at the bottom of your assets/theme.css file.

.site-header__search-input{
border-radius: 25px !important;
}

Hope this works.

Thanks!

[system]

Hi

Thanks that worked! Is there a solution to centre the search bar?

Kind Regards, Tom

[Zworthkey]

hii, @Anonymous
Paste this code in the top theme.scss file.

.site-header__search-form{
left:137px !important;
}

Thank You.

[system]

Hi

Is this to centre the search bar?

Kind Regards, Tom

[Zworthkey]

@Anonymous
yes!!

[system]

Hi

Please could you provide a solution/code/html for adding a promotional bar (the bar that says, free delivery, flexi-pay etc) to add under the header. I’ve attached an example below.

Kind Regards, Tom

[beermash]

this doesn’t seem to work for mobile browser it shifts it off to the right, is there a mobile version of that code?