Refresh Theme how to move search bar with logo

Cherry_Moon
Excursionist
16 0 3

I want to swap places of those 2 objects, logo to the left, search bar to the middle and make it more wide 2x
https://imgur.com/a/6b9nKJM
webiste:
https://niedladyktatury.pl/

Replies 5 (5)

Abdosamer
Shopify Partner
821 146 164

Hi @Cherry_Moon , go to base.css and add the following code :

@media (max-width:990px){
  .header--top-center {
    grid-template-areas: 'heading left-icons icon'
      'navigation navigation navigation' !important;
}

.search__input.field__input {
    padding-right: 16rem !important;
}

}
Buy me a Coffee
Email : abdelrahamansamer71@gmail.com
Chat on WhatsApp
Work samples
Cherry_Moon
Excursionist
16 0 3

Sadly, it did not work for me 😢

Abdosamer
Shopify Partner
821 146 164

@Cherry_Moon , did you add the code to base.css file ?

Buy me a Coffee
Email : abdelrahamansamer71@gmail.com
Chat on WhatsApp
Work samples
Cherry_Moon
Excursionist
16 0 3

yeah, but the search bar prob. have different class'es due to adding it by hand in header.liquid

Abdosamer
Shopify Partner
821 146 164

@Cherry_Moon , this should be the result of the code, if you want I can send you an access request to better solve the problem:

Abdosamer_0-1701603128203.png

 

Buy me a Coffee
Email : abdelrahamansamer71@gmail.com
Chat on WhatsApp
Work samples