TileBoard - New dashboard for Homeassistant

lol. last thing then ill leave you alone for now. thanks for beeing cool. the slider doesnt seen to work with my led light, but the switch does. turns it on. the slider does nothing.?

No worries :slight_smile: Do you mean the slider after the long press? Did you configure it (them) for correct attributes and min/max for your light?

Can you share a config example for phone ui?thanks

There is not much to share and my config consists of a lot of variables being used in various places. In this post I’ve mentioned a few key things:

Other than that, It is just one group per page…

This is getting to be like Christmas. Every morning I get up and there’s something new under the tree!

2 Likes

There must be a point when it would be wise to stop and simply polish what we have.

1 Like

Thanks. I’ll give that a try when I get a chance. I hadn’t spent too much time on trying to figure it out because shortly after I implemented the micro-tiles I saw your message regarding the mobile interface and I figured I’d dig into it in order to add the icons to the micro-tiles. Thanks again.

1 Like

What’s the best way to have this scale for different screens?

Just create different configs, dashboards are never designed to scale. You need to tailor each one to the specific screen size. This is the whole idea of a dashboard.

This is a config I created to test the Mobile capabilities, and it’s looking good on an iPhone X.

There’s a bit of an overlap at the bottom, and the weather icon doesn’t handle compact, but beyond that it’s working perfectly.

groupMarginCss: ‘5px’

Okay that makes sense. How I do open different configs in the browser?

There is a hacky way but the most straightforward one is to create separate html file with it’s own config.

Already set to 5px, I think this might be an iPhone notch thing, I’ll continue to investigate.

A change seems to have been made within the last day or so that has caused input_number slider to be unresponsive. If I make a change to the entity in another UI like the HA frontend, the change is visible in the dashboard. But I can’t move the slider in the dashboard, it doesn’t respond to touch (or mouse in a desktop browser).

Looks great! Could you please inform:

  1. How did you changed font and size of the clock?
  2. How did you centralize the clock? Default is pretty left shifted.
  3. Is it possible to use 24h format?
    Thanks!

For 1 and 3, add this into CONFIG before the pages definition starts:

/* timeFormat: 12 for AM/PM marker, 24 for 24 hour time (default) */
timeFormat: 12,
clockStyles: {
‘fontSize’: ‘20px’
},

For 2, I’m guessing you can add it into clockStyles.

1 Like

JoRoCoBo is correct. My settings:

clockStyles: { 'fontSize': '60px','padding-top':'40px','padding-left':'15px' }

1 Like

So I narrowed down my issue above. I have my tileSize set at half size in order to do the micro tiles. My slider is on a tile that is 4x1. At those dimensions it is not responding. But when I change it to 4x2 it is responsive. This behavior began when the mobile-view capability was added. Prior to that the slider worked at 4x1.

Please post your config