Website Background Image | Crave Theme Edit

Hello everyone, I hope the question is both relevant and we can find a solution to my problem.

I have a website where I’ve been able to post a background image across the entire website using the following code:

In base.css


#MainContent {
background: transparent !important;
}
body.gradient {
background: url(“https://cdn.shopify.com/s/files/1/0615/9820/4089/files/WhiteBlue_Sky.png?v=1660511544”) no-repeat center center fixed !important;
background-size: cover !important;
background-attachment: fixed;
background-blend-mode: overlay;
background-repeat: repeating-linear-gradient;
}

.gradient {
background: transparent !important;
}


The code above produces the following results:

I would like for the following section to be in the original color that is specified:

Current:

Original:

My website is https://delicias-colombianas-gainesville.myshopify.com/

If anyone could help me, it’d be greatly appreciated.

Thank you

Hi @uff-gainesville ,

Thanks for the store url, could you please post store password too.
Can’t seem to seem to get it

Password: lordnobot

Hi, @uff-gainesville

You can try this code

  1. Go to Online Store-> Theme->Edit code
  2. Asset-> base.css ->paste the below code at the bottom of the file.
.card__content {
    background-color: #EEEEE5;
	}

Hi @Ahsan_ANC ,

Your product cards are transparent hence taking on the image background.
To get that initial product card, your best bet is change the background of ‘.card__content’ class.

Here’s the css below…

  • Go to Online Store-> Theme->Edit code
  • Asset->component-card.css->paste the below code at the bottom of the file.
.card-wrapper, .card__content {
    background-color: #f2efdd;
}

That should give you that beige background on the card you’re looking for.

Please mark as solution if this fixes your issue.

Thanks