walkxcode/homer-theme

Want to change App Card background color

spandan13 opened this issue · 2 comments

spandan13 commented

Hi, I wanted to change the app card background color in the light mode but I am not able to do it properly. You can see my current preview for the light mode and my changes to the config and custom.css files here
The changes I made to the custom.css file for app card background show up for both dark and light mode. How to I set them separately?

Worvein commented

I solved this problem by creating a variable (--card-cover) that changes its value depending on whether the background is light or dark. Here is the code I added to custom.css:

body #app .card {
  background-color: var(--card-cover); 
  box-shadow: 0 2px 15px 0 var(--card-shadow);
}

body #app.is-dark{
  --card-cover: rgb(0, 255, 0, 0.8);
}

body #app.is-light{
  --card-cover: rgb(255 ,0 ,0 , 0.8);
}

P.D. (I know the colors are horrible, but they are like that to show that it works)

spandan13 commented

@Worvein Thanks, this seems to be working great!

  • 🎉1