How add transparent background to modules

broberg

Show us your css code that you are trying to use

@JonoGee said in How add transparent background to modules:

I have tried this format …
.module.calendar {
  background-color:rgba(0,0,0,0.6);
  border-radius:8px;
  padding:8px;
}
and it works perfect for most modules but simply will not work for currentweather, weatherforecast or compliments?
Any ideas folks?

JonoGee

@broberg Hi mate. Thanks for taking the time.
I will copy it below… The PushBullet Notification one works fine but ones i mentioned don’t…

 body {




.module.currentweather {
  background-color:rgba(0,0,0,0.6);
  border-radius:8px;
  padding:8px;
}


 }

.module.MMM-PushBulletNotifications {
  background-color:rgba(0,0,0,0.6);
  border-radius:8px;
  padding:8px;
}



 }

.module.compliments {
  background-color:rgba(0,0,0,0.6);
  border-radius:8px;
  padding:8px;
}


 }



 }

.module.weatherforecast {
  background-color:rgba(0,0,0,0.6);
  border-radius:8px;
  padding:8px;
}

Regards

broberg

@JonoGee

Okey,
I see your problem.

You have put the .module.currentweather{} within the body{ }

Just remove the first line body { and the lonely } before .module.MMM-PushBulletNotifications {

Then it will work just fine.

And btw, You have a lot of stray }-brackets remove them aswell

JonoGee

@broberg I have sorted it this morning. I really appreciate your taking the time to help me, Thankyou Broberg. So many on here seem unwilling to help. Youre a legend!

schwarem

I am not having any success with this either. Here is my CSS. Can someone help me out?

body {
	color: #aaa;
}

.dimmed {
  color: #666;
}

.normal {
  color: #999;
}

.bright {
  color: #fff;
}

.module.clock {
  background-color:rbga(255,255,255,0.4);
  border-radius:8px;
  padding:8px;
}