TileBoard - New dashboard for Homeassistant

Wow! Thank you SO much. This worked perfectly - One more thing; is there a way to remove this “upside down L” on my entities? I cirlced them in red:


edit: excuse the middle boxes circle - I am not great at paint! haha

Hi! Is there a sample of how you would use callScript(item,entity) ? Im attempting to start a timer thats unrelated to the entity of the tile. Any pointers would be much appreciated:)

in file main.css search for class .item-clickable, i think you must delete this:

  border-left: 2px solid rgba(255, 255, 255, 0.8);
  border-top: 2px solid rgba(255, 255, 255, 0.8);
``

I tried to delete it here:

.item.-scene .item-clickable {
  display: block;
  left: 5px;
  top: 5px;
  height: 6px;
  width: 6px;
  border-left: 2px solid rgba(255, 255, 255, 0.8); // DELETED THIS LINE
  border-top: 2px solid rgba(255, 255, 255, 0.8); // DELETED THIS LINE
  opacity: 0.5;
  position: absolute;
  z-index: 2;

but it didn’t work. I can’t find another place that shows this type of code

Around line 574 you should find:

Copy to clipboard

.item-clickable {
    display: none;
    left: 5px;
    top: 5px;
    height: 6px;
    width: 6px;
    border-left: 2px solid hsla(0, 0%, 100%, .8);
    border-top: 2px solid hsla(0, 0%, 100%, .8);
    opacity: .5;
    position: absolute;
    z-index: 2
}

delete the two lines with border.

Worked for me.

I can’t see anything like that on my code

This is what I have: https://paste.ofcode.org/fF5R3DXD8psgEYmwBijSFN

I am no expert but you could try changing the following:

.item-clickable {
  display: none;
}

to

.item-clickable {
  display: none;
  opacity: 0;
}

or

.item.-switch .item-clickable,
.item.-lock .item-clickable,
.item.-cover_toggle .item-clickable,
.item.-vacuum .item-clickable,
.item.-fan .item-clickable,
.item.-custom .item-clickable,
.item.-light .item-clickable,
.item.-script .item-clickable,
.item.-automation .item-clickable,
.item.-input_boolean .item-clickable,
.item.-input_select .item-clickable,
.item.-camera .item-clickable,
.item.-camera_thumbnail .item-clickable,
.item.-camera_stream .item-clickable,
.item.-alarm .item-clickable,
.item.-door_entry .item-clickable,
.item.-popup_iframe .item-clickable,
.item.-input_datetime .item-clickable,
.item.-dimmer_switch .item-clickable,
.item.-scene .item-clickable {
}
.item:active .item-clickable {
  opacity: 1;

to

.item.-switch .item-clickable,
.item.-lock .item-clickable,
.item.-cover_toggle .item-clickable,
.item.-vacuum .item-clickable,
.item.-fan .item-clickable,
.item.-custom .item-clickable,
.item.-light .item-clickable,
.item.-script .item-clickable,
.item.-automation .item-clickable,
.item.-input_boolean .item-clickable,
.item.-input_select .item-clickable,
.item.-camera .item-clickable,
.item.-camera_thumbnail .item-clickable,
.item.-camera_stream .item-clickable,
.item.-alarm .item-clickable,
.item.-door_entry .item-clickable,
.item.-popup_iframe .item-clickable,
.item.-input_datetime .item-clickable,
.item.-dimmer_switch .item-clickable,
.item.-scene .item-clickable {
}
.item:active .item-clickable {
  opacity: 0;

Please don’t change the original TileBoard CSS files as that will get overridden on updating and you’ll lose all your changes.

Custom CSS rules should go into styles/custom.css. To disable the “clickable tile” indication you could add:

.item-clickable {
    display: none !important;
}

this worked :slight_smile: thank you so much!

New to TileBoard. Love it and thank you for all the hard work. I’m trying to setup a tile for a person’s status (home, in a “zone”, etc.) that will will appear like the second screenshot on the first post. Similar to the status for Elena and Alexey. I can add it, but the status is covering our faces. Is there anyway to remove that?

Very nice dashboard ! Thanks for this !
Is it possible, when in screensaver mode, to show current now playing (music or movie) from a specified media player ? i would like to wall mount my old ipad :slight_smile: thanks !

Hi all, I notice when I check my browser console, it’s getting filled with a stream of these TypeErrors. Would you know where I look to fix this please? Thanks.

You have to look at your config file carefully. You seem to have created an undefined item in the list of tiles somewhere. You could have created it accidentally by inserting an extra comma somewhere, like: [{tile},,{tile}].

I suppose the TileBoard code could filter such items out automatically so feel free to create an issue for it in the repo.

1 Like

Hi all,
I’m trying to add a slider for three roller shutters in TileBoard. Unfortunately, I cannot get to work the % status of the roller shutter and the slider is always stuck to 0% when I refresh the page.
This is my code:

                  {
                     position: [0, 0],
                     width: 2,
                     type: TYPES.SLIDER,
                     //id: "input_number.volume",
                     id: 'cover.tapparella_salotto_destra', // replace it with real string id
                     state: true,
                     title: 'Livingroom right',
                     subtitle: 'Roller shutter',
                     unit: '%',
                     value: '@attributes._c.value',
                     slider: {
                        field: 'position',
                        request: {
                           type: "call_service",
                           domain: "cover",
                           service: "set_cover_position",
                           field: "position"
                        }
                     }
                  },

What am I doing wrong?
Thank you.

Hi, I would also like to know how I can add this tile?

that i snot simple tile, there are 6 tiles

Hi everyone, I’m new to tileboard, a perhaps trivial question, a I’m a beginner, in the config.js file, besides configuring the url (can I also put my address for example with duckdns?) There is more to change ? What is meant by changing the ID? Changing the url only, when I open the tileboard page I get the error page that tells me that tileboard is not configured correctly, thanks for your help!

Care to share these 6 tile, or a how to?

I wonder where did you copy this bit from? This needs to point to the attribute of cover position. Can you please show state dump of that cover from HA?