What is and how use "Custom CSS" for my Dashboards?

I have read about making some cool stuff with “Custom CSS”, but I have no idea what is it and how do it. Any explain Thanks !

Hi @Carlos_Juarez, see below for the quick explanation about CSS from www.w3.org

Cascading Style Sheets (CSS) is a simple mechanism for adding style (e.g., fonts, colors, spacing) to Web documents

It’s basically a style language for web elements. Ex: the following CSS is to hide the green toast message class which is basically the “Command Sent” message when a device tile is tapped.

.toast.green { display: none }

.

1 Like

Here are some examples I have collected:

.toast.green{ display: none; } 
.tile.weather .tile-footer { font-size: 0.8em; }  
.tile.clock .time { font-size: 1.8em; } .date { font-size: 2em; } 
.tile .title { text-shadow: none; } 
.tile .title { line-height: 110%; } 
.tile .tile-footer { text-align: center; }
.tile .tile-footer .status span.right { float: inherit!important; }
2 Likes

Thanks my friend, but Im lost where/how I code this ?!?..

Go to Account and “Manage Resources” and then “Themes”:

And then in Themes, click on “Advanced”:

And then finally at the bottom:

image

3 Likes

Great !!!..thanks a lot brother, I will try with the “Sent Message” green label ,this is cool !

Thanks brother, It worked !!! very cooool… Now dashboards avoid green message “Command Sent”!, but I tried center footer text, that one that display device status like ON, OPEN, CLOSE without success, I am using in CSS section:

.toast.green{ display: none; }
.tile .tile-footer { text-align: center; }

I thought last line was to center the footer but it did not work …

What am I missing ? TIA.

You need both of these as per @josh

3 Likes

Rocks !!!..Thanks my friend !