Navigation and Logo all the way to the left - Refresh Theme

Store Design
,
1

Hey guys,

I need help with my shop. I would like to have the logo and navigation on the mobile view all the way to the left. I have already chosen this option in the header settings (middle left), but there is still a huge gap between the navigation and the left side of the screen and between the navigation and the logo (see picture below).

IMG_0134.jpg
IMG_0134.jpg351×773 12.4 KB

Does anyone know how I can reduce these gaps on the mobile view? I’m using the refresh theme.

Thank you very much in advance.

2 Likes
2

Hi Josh,

thanks for the quick reply, but I’d rather keep the conversation here so that everyone in the community can profit from the solution :slightly_smiling_face:

3

Hi @DTours , I hope you are doing well. Kindly share your store URL.

Thanks!

4

Hi @topnewyork

thanks for the reply!

The URL is dunk-tours.de and the password is “topnewyork” for now.

5

Try the below instructions and code:

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.liquid file
  3. In theme.liquid, paste the below code before

If my reply is helpful, kindly click like and mark it as an accepted solution.

Thanks!

6

Hi @topnewyork ,

unfortunately it did not work. It now added this line on the desktop and mobile view:

IMG_0135.jpg
IMG_0135.jpg1179×247 17.2 KB

And yes, I did add the code before in the theme liquid. Any idea what else could work?

7

@DTours , try now

.header { padding: 5px !important; }
8

@topnewyork ,

this one worked for the navigation, but:

  • The entire header now moves down on both desktop and mobile as I adjust the padding

  • The logo is still too much in the center on the mobile view.

Is there anyway to move the navigation more to the left side of the screen and reduce the space between navigation and logo? Only on the mobile view, I’m happy with the look on the desktop view.

Thank you for your help.

9

Hi @DTours

Is this solve, right?

10

Hi @Made4uo-Ribe ,

yes, this is the one :slightly_smiling_face: