Code To Make My Product Layout Have Lines Like This?

Store Design
,
1

Hello, is anyone able to help give me the code to make my product page look like this with the lines?

The example site is https://sys-temic.com/collections/all-products

My site is https://sevenemotions.com/

Any help is greatly appreciated!!!

IMG_6461.PNG
IMG_6461.PNG1170Ɨ2532 298 KB

Screenshot 2024-04-04 at 3.53.20 PM.png
Screenshot 2024-04-04 at 3.53.20 PM.png3456Ɨ2234 728 KB

2

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. base.css
    Add This css in your base.css File

slider-component.slider-mobile-gutter.page-width.page-width-desktop.scroll-trigger.animate--slide-in {
    max-width: 100%;
    padding: 0;
}
ul.grid.product-grid.contains-card li.grid__item.scroll-trigger.animate--slide-in {
    border: 1px solid black;
}
ul.grid.product-grid.contains-card {
    column-gap: 0;
    row-gap: 0;
    justify-content: center;
}
3

Worked, thank you so much!