Help with collection page products glitch (debut theme)

Highlighted
Tourist
14 0 1

I was having help on a different issue with my website here: https://community.shopify.com/c/Shopify-Design/Lowering-title-of-collections-on-home-page-amp-collec...and the person helping me gave me code that fixed something but then messed up my products and their layout on the collection pages. I removed the code but the issue was still there. 

 

You can see the issue here, it's hard to explain but it's not supposed to look like this.

fa7b492074c205f4cf4f52ad4d9cd284.png

 

It's supposed to look like this:

17b3770d07af70bad7299fe0e78980af.png

 

My website is:

https://jerseyhypekick.myshopify.com/

Password:

austai

 

Thank you in advance!

0 Likes
Highlighted
Shopify Partner
591 84 127

PLease place this code  at the end of theme.scss

.collection-grid-item__overlay {
background-size: contain !important;
    background-position: center center  !important;
}

 

If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes
Highlighted
Tourist
14 0 1

Thank you for your response! Unfortunately, it didn't fix the issue 

0 Likes
Highlighted
Shopify Partner
591 84 127

It seems that you did not paste the code in the end of theme.scss

If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes
Highlighted
Tourist
14 0 1

I took it out because it gave me an issue with the collection thumbnails on the home page and didn't resolve the issue with the product page. 

  

This is before pasting the code:

defafe1a1ccb8f22b1349ac9f73c1518.png

And after pasting the code:

04d66c5c70f9016403f4fd10f21c10d6.png

 

0 Likes
Highlighted
Shopify Partner
591 84 127

So what do you want?

If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes
Highlighted
Tourist
14 0 1

I want to fix the product page, the two images at the top of the thread of how it looks right now, and how it's supposed to look. When I'm in preview mode it looks how it's supposed to, but then I save changes and on the website it appears the wrong way

0 Likes
Highlighted
Shopify Partner
591 84 127
 .collection-hero__image {
background-size: contain !important;
}
If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes
Highlighted
Tourist
14 0 1

where should I place this code?

0 Likes
Highlighted
Shopify Partner
591 84 127

At the end of theme.scss

If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes