TileBoard - New dashboard for Homeassistant

Yes, but even with else condition, how I make it refreshing?

  1. the easier way - try finding the best tile size and tile margin

  2. use custom css with following

     .group {
     margin-top: 0px !MPORTANT; 
     }
    
  3. If you go to main.css and find the class “.-hide-scrollbar .page” Should be online 192. Change the percentage to 100% should fix your issue.

is there an option to loop through the pics of given folder as screensaver slides rather than identifying individually each as array of slides?

It should refresh whenever state changes. There have been a few examples of customStyles in this thread.

TileBoard is an HTML page. It has no access to FS.

Ok, good, checking it now.

But can you tell regarding refreshing rate of background image from camera?
What you suggested before not worked :\

Thank you so much that worked perfectly!

      bgSuffix: function(item, entity) {
        return this.parseFieldValue('&camera.XXX.attributes.entity_picture')
          + '&iterator=' + Math.ceil(Date.now() / 100 / 100000);
      },

This would stop image being cached however image will only be refreshed whenever value of the entity bould to the tile changes.

1 Like

Dear @resoai
Please help me . How to display like that images vd

Can you share your configuration to display both sensors like this? Thanks in advance.

      - type: history-graph
        entities:
          - sensor.nhiet_o_phong_ngu 
          - sensor.dark_sky_temperature  
      - type: history-graph
        entities:
          - sensor.dark_sky_humidity  
          - sensor.o_am_phong_ngu

indoor : Used flash sonoff tasmota
outdoor : Used dark_sky

Grafana + IFRAME tile will allow you to display graphs. I have not tried it myself since I’m not a fan of graphs on dashboards but I have seen people do that in this thread.

1 Like

Of course, but for further, could you please use the forum search, I can guarantee you will find a lot of interesting stuff)

Finally decided to start with Tileboard and I love it :slight_smile:

Am now trying to figure out how to do dynamic colouring of the tiles. I want to change the colour of a sensor tile depending on its value. Did anyone manage to do something similar yet?

Is there any way to change the font size from customStyle individually for title, subtitle and entity item icon?

You can define custom CSS in custom.css file and specify it via classes:[] of that tile. Please remember that it is an array.

I use this to control light i the living room.
image
The “bars” are scenes, which is used 99% of the time. I would like to have a visual indication of, which is the active scene, by changing the background picture to aversion with yellow bars.
My plan is to

  • create input_boolean for each tile.
  • each Tile should run a script, which turn on the scene and update the input_boolean
  • in the Tile define the background by a JavaScript function.

My issue is to write the function. Below is the only piece of JS I have ever written.

This is used to define the background picture in a device tracker tile, whether the person is home or not home and it works perfect.

So any thoughts on how I could do the same for my sceenes would be appreciated

1 Like

Hi
This is an example I’ve added to main.css (I should have placed it in custom.css)

.item.-on.-door_entry .item-entity–icon {
color: red!important;
}

It changes the color of the MDI to red, when a window is open and white for closed…

Something like this should do the trick:

customStyles: function(item, entity){
   return {
      'backgroundColor': entity.state === 'on' ? '#ff0000' : '#ffff00'
   }
 }