wide bluff
Hi guys, working on getting my google nest hub to have a pleasant dashboard. I copied this one as a starting point from here: https://github.com/jimmy-landry/HA-Tablet-Dashboard-Config
What’s the best way to remove this dead space/move the bottom tiles up?
Thanks!
reef harness
You might be dealing with a resolution issue. The Dev states that they use the dashboard on an Amazon Fire HD 10 which has a resolution of 1920x1200. Your Google Nest Hub has a resolution of 1024x600. It looks like, on your screen, the dashboard will scroll, but on the Dev's it does not. I think the issue you're running into is the sidebar is designed to take up the majority of the vertical space and then the Lights/Climate, HomePod/Outlets/Security and Footer rows get distributed evenly based on the sidebar.
The layout is configured at Line 2698. yaml layout: grid-template-columns: 25% 22.5% 22.5% 22.5% grid-column-gap: 18pt grid-template-rows: auto grid-template-areas: | "sidebar lights lights climate" "sidebar media outlets security" "sidebar footer footer footer" You might be able to change the grid-template-rows to something that better handles your screen. Maybe something like grid-template-rows: 40% 40% auto, but I don't know what that's going to do to the sidebar. (The footer should automatically size itself.) You may have to remove some elements from it in order to get it to fit properly. It looks like the Dev use a couple of Markdown cards to act as spacers in the sidebar; maybe removing these can help. You can find them at Lines 2711 & 2870 (and a blank button-card at 2872; not sure why that's even there or if it does anything).
It also probably doesn't help that the Markdown card used for the time does not appear to be the proper dimensions. I'm not sure what the fix for this is.
This is one of those things that is not easily a drop-in-and-use kind of thing. Dashboards tend to be very specific to those who designed it.
reef harness
On my Fire HD 10, with Kiosk Mode and removing some of the lights and climate buttons like you did, it looks like this. (Don't mind all the errors; I did not put any effort into configuring it.)
reef harness
Here's some minimal configuration. I changed the layout to this: yaml layout: grid-template-columns: 25% 22.5% 22.5% 22.5% grid-column-gap: 18pt grid-template-rows: 28% 50% 15% auto grid-template-areas: | "sidebar lights lights climate" "sidebar media outlets security" "sidebar padding padding padding" "sidebar footer footer footer" The padding section is acting as a spacer to push down the footer.