Solved

Adjust description width under images, Venture theme

JamieBuck
Tourist
11 0 1

Hello

Using the Venture theme - I find it a bit ugly when the headings are wider than the product photo, see below. Also the headings can run into each other a little. Can I fix the line width to be the same as the image?
https://buckandhide.com/collections/lanyards

Next 🙂 Slightly trickier... When I have some headings on one line and some longer ones on two, it messes with the grid. I'd like all of the top lines of the descriptions to align horizontally, is that possible?
https://buckandhide.com/collections/snap-pouches

Thanks!
Jamie

Accepted Solution (1)

iDoThemes
Trailblazer
207 43 91

This is an accepted solution.

For the headings being wider you can add some padding.  Add this to the bottom of your theme.scss.liquid file

@media only screen and (min-width: 750px) {
  .product-card__name {
    padding: 1.3em 
  }
}

 

Developer of Liquify Chrome Extension -- Enhance the Shopify Theme Code Editor
.




Theme Developer -- Drop me a line

View solution in original post

Replies 4 (4)

iDoThemes
Trailblazer
207 43 91

This is an accepted solution.

For the headings being wider you can add some padding.  Add this to the bottom of your theme.scss.liquid file

@media only screen and (min-width: 750px) {
  .product-card__name {
    padding: 1.3em 
  }
}

 

Developer of Liquify Chrome Extension -- Enhance the Shopify Theme Code Editor
.




Theme Developer -- Drop me a line
JamieBuck
Tourist
11 0 1

Perfect, thanks!

JamieBuck
Tourist
11 0 1

Aaah hold on! That also creates padding above the title which affects the crop on all the images. Can I just change the line width? Or can I manually add a line break into the titles..?

iDoThemes
Trailblazer
207 43 91

Try padding: 0 1.3em; instead

Developer of Liquify Chrome Extension -- Enhance the Shopify Theme Code Editor
.




Theme Developer -- Drop me a line