Adding a black or color border around all products images on my site w/ Debut theme

[classroomposter]

Hello. I am trying to figure out how to add a black or color border around all of the product images on my site (schoolposters.com). Some of the other options I found in the forum for adding code to theme.scss.liquid have yet to work. I really appreciate any help you can provide.

[Adenan]

Hey ^^,

Try to add this code at the bottom of your CSS file "theme.scss.liquid" (this edit is for your home page):

/* CUSTOM BORDER STYLE */
.product-card__image-with-placeholder-wrapper {
    position: relative;
    border: 2px solid #000;
    padding: 17px 0;
}

.grid-view-item__image-wrapper {
    margin: auto;
    position: relative;
    width: 100%;
}

For your product page edit the CSS file "jquery.rondellf26243.css" and add this code to the bottom:

/* CUSTOM BORDER STYLE */
.rondell-item-crop img {
    border: solid 2px #000;
    padding: 10px;
}

 
Hope it will help and let me know if it works 😉