Search Issue on Mobile platform with regards to screen sizing

Solved
Hetz
New Member
4 0 0

Hi All! 

I appear to have an issue with my website with regards to the screen optimisation when the website is viewed on a mobile platform. 

 

The website in question is www.smokz.co.uk 

 

when viewed on a desktop the search bar works correctly and is visible one the screen as below Screenshot 2021-01-07 at 13.04.16.png

 

When viewed on a mobile device the following occurs as you can see the screen isn't optimised for the mobile and cuts the left hand side of the view out. 

IMG_B0637F51A45D-1.jpeg

This only appears to happen when using the search function?

 

Can anybody help out? 

0 Likes
neeravmakwana
Shopify Partner
163 29 35

Welcome to Shopify Community Hetz.

Can you please search for the below in theme.scss.liquid and change the left and right margins to 5 px (currently they are set to -15 px)

.spf-has-filter #gf-products

0 Likes
Hetz
New Member
4 0 0

Hi, thanks for the reply, 

would i be looking for the line in the below: 

Also where about would that line be?

Screenshot 2021-01-07 at 14.17.06.png

 

 

0 Likes
neeravmakwana
Shopify Partner
163 29 35

That's the right place. Can you try hitting Ctrl F keys (for find).

Or search somewhere for the search/find text option.

 

I don't know where exactly would these lines be.

0 Likes
Hetz
New Member
4 0 0

Hi

I have looked through the theme file, but the following does not appear to exist -.spf-has-filter #gf-products?

 

I am using the AJAX theme if that makes a difference?

 

thanks 

0 Likes
neeravmakwana
Shopify Partner
163 29 35

This is an accepted solution.

It was related to the v5.globo file. Can you check if it is fixed.

0 Likes
Hetz
New Member
4 0 0

Products are now aligned, but the search bar is still cut off on the site: 

IMG_2BCDF13E7FA9-1.jpeg

0 Likes