Collection page product titel removal, Size of Font, price and vendor

[falkenkoenig]

Hello.

I have a question about my brooklyn theme on shopify.
I am not happy with the page where all pruducts from a collection are listet. The layout of the product title, price and vendor is way to large compared to the product image. On mobile view I need a more clean look. Is there a way for improvement?
Is it possible to remove the product title, price and vendor only on mobile view? Would these change affect SEO?

Here is the link to my shop: https://falkenkoenig.ch/collections/ohrringe

Thanks for the help.

Cheers from Switzerland

[JHKCreate]

Hi @falkenkoenig 

You can add the following code to remove this from mobile view only:

@media screen and (max-width: 590px)
{
span.grid-product__title {
    display: none;
}

p.grid-product__vendor {
    display: none;
}
}

This will not affect SEO in any way, so no worries here!

Are the grey borders a requirement on your end?

[falkenkoenig]

Hi @JHKCreate 

Thank you very much for your reply.

The code worked very well, thank you very much.

You are absolutely right, the grey border is not a requirement. Is there a way to remove it?

There is something else:
- The bar on the left side of the price looks unnecessary. How can I remove this bar?
- I would like to place the price right bellow the image. Is this also possible?

I really appreciate your support.
Is there something else you would change or optimise on my shop.

Here is the the link to my shop: https://falkenkoenig.ch/collections/silber-fingerringe

Thank you for your reply.

[JHKCreate]

Add the following:

@_media screen and (max-width: 590px)
{
.product--wrapper {
    margin: 0px;
}

span.long-dash {
    display: none;
}

}