Show Off Your Dashboards!

Very cool. What system are you using to generate this?

It's a stock Hubitat dashboard with manualy modified CSS (144 tiles, with 96 lines of CSS on 100x60 grid)

4 Likes

That's a sweet looking dashboard. I can't imagine the amount of time doing it.

1 Like

Well you have done a great job both technically and aesthetically. Those 96 lines probably took quite a long time unless you are a CSS pro.

definitely the look is simple but very effective, will yor be sharing rhe code and layout?

96 lines: many are repeating the same things for different tiles and I found them all on this thread:

As for sharing, I wish there was a possibility of templates with hubitat dashboards but the beast is often a pain to work with and due to the number of workaround needed to achieve something presentable, it does not let itself adapted easily.

1 Like

You can at least repeat a "template" across tiles in a dashboard with my CSS editor tool. I am working towards sharing between dashboards or even users here, but finding the time to progress it can be hard sometimes...

5 Likes

Just finished my migration from SmartThings and Webcore started about a week ago. It wasn't an entirely smooth ride :face_with_spiral_eyes: but I made it to the end and turned off the smartthings hub yesterday. I've been playing around with the dashboard tools and brushing off the CSS skills which aren't too great anyway and this is what I have so far,

For the PC/Tablet, a TabletView that shows all my meager smart devices:

For the Phone, I did 5 views:
Phoneview Top Page:


Living Room:

Media Room:

Mud Room:

Other Rooms:

It's a work in progress. I still need to add battery tracking and I need some weather data (Luminance for lighting control). Suggestions gratefully accepted. I also need better presence detection. Hubitat, I'm afraid isn't meeting expectations (for presence detection). There's no geofence on my wife's phone at all and my phone has a geofence and shows me in and out of it but it never seems to change anything, presence tile or Mode. I tried Alexa but that is ONLY detecting when I leave and never not once when I return. Weird. Any suggestions?

Updated 1/16/2023 Added a PowerPanel:

5 Likes

With a modified version of @mbarone 's iFrameAdvanced driver, I was able to produce "tabs" at the top of a dashboard to switch between different dashboards on-screen. Not necessarily the dashboards I would choose for this effect, but they were there, so I used them to develop the idea. I would most likely put different rooms or different topics at the top, like Lighting, Climate, Power, etc.

2C4DD603-6809-4715-8E85-810A5E391D9A

10 Likes

I've avoided dinking with the built in HE dashboards because I was pretty happy with my own HousePanel app. This weekend I took the dive and started playing with it thanks to the many great examples here and in the Noob's guide thread referenced here often. What I focused on what using the same icons I've come to love and expect from HousePanel and merging them into the HE platform using CSS. It was surprisingly easy and the end result looks quite nice I think. I will likely start using this now exclusively given the advantages of using the HE supported platform - such as avoiding cloud access when I'm in my home. If anyone is a user of HousePanel and wants to migrate using the CSS I created, let me know and I'll happily share. Here are two pages. Each page links back to the main page to simulate the HP multi-tab capability. Not quite as fast, but fast enough.

6 Likes

Just commenting to say....nice range!

how do you get smaller tiles and fit more than 2 wide on your phone screen?

That's done through CSS editing.

Click on SETTINGS and, on the GRID tab, change this to however many columns you want:

Then goto OPTIONS tab & delete this field and it will fit that many columns across your screen of whatever device you are using at the time:


If you delete Row Height, it will fit however many rows you designate.

Also, 1x1 doesn't have to be your "standard" tile size. To increase precision when placing tiles, I have had my "standard" size as 4x4 so that things like Text tiles can be 1x1, 1x4, etc.

In this dashboard, my "standard" tiles are 2x1 but the Text Header is 1x3 where 3 is the number of columns that dashboard is set. The dashboard is set to have 12 rows.

2 Likes

I think he was talking about the Smartly Inject style above

That would make a great e-ink display

Blockquote
Click on SETTINGS and, on the GRID tab, change this to however many columns you want:

Then goto OPTIONS tab & delete this field and it will fit that many columns across your screen of whatever device you are using at the time:

Also, 1x1 doesn't have to be your "standard" tile size. To increase precision when placing tiles, I have had my "standard" size as 4x4 so that things like Text tiles can be 1x1, 1x4, etc.

THANK YOU!!!

Am I the only one using ActionTiles? It works fine but would like something with a bit more "polish". Maybe it's something I can do within the app?


1 Like

I went a little crazy here, creating a dashboard in hubiVue to display all of the wonderful data provided in Hub Info Driver by @thebearmay :

3 Likes

If you are using an Amazon Fire tablet, I would use Android Dashboard