Dashboard chapter 2: Let’s redesign the cards together!

The thing I hate most about this is that a lot of use are running out of windows because the UI Changes MS keeps doing and screwing things up and we all are supporting Open Source because of this.

we had the same issue when Microsoft changed the start menu and we hated it… now is happening in home assistant with the badges, it was changed because the new is modern not matter what… Nit happy with this :frowning:

1 Like

Was not against you or related to your scroll request.

It was only my overall doubt/feeling, why HA in general need to look exactly as 90% of other solutions.

Late on here,
I’ve played with all sorts of home automation ideas from early 1992. Remember mosaic??
Anyway - after all those years and many “great new things” ideas, about 7 years ago I took a plunge with HA.
I don’t regret my decision. Sure some of the scripts, yaml, syntax etc just does my head in.
BUT - for a bit of software that responds to users - these guys rock.
You pick your forum topics and after a while you recognise the worthwhile contributors.
Time for another beer!!!

1 Like

We already do scrolling for the toolbar in data tables.

With that said, the implementation in Apple Home is unintuitive for a different reason. Theirs aren’t “badges” even though they look visually similar. They are actually filters for the list below.

but that is not what Pieter meant I believe.
Data tables is after all a bit special, being the backend of the frontend… and not main focus of our Dashboard design

It would be a great addition if we could scroll horizontally either inside a view, or within cards.

for the view example par excellence would be the new badges indeed.
for scrolling within a card, my main target would be the container cards like horizontal-stack, and grid

It’s one of the few interactions HA doesnt have, and which would offer a great new world of options.

Compare custom:swipe-card, but than fully functional :wink:

(not mentioning sections, as I dont have experience enough there, but I would think above 2 suggestions would also fit )

And they do that so well, people couldn’t tell the difference…
it doenst matter though, as it really is about the scrolling experience. not so much what is being scrolled.

I can confirm that the new badges are wider than the old ones, regardless of the fact that the name appears above the value.

It would help if we had control over the icon’s visibility. Eliminating the icon would help to minimize the badge’s width.

If I want to display 6 room temperatures (top of my phone’s screen), I don’t need 6 thermometer icons taking up space. The value’s purpose is inferred from its unit of measurement (C or F).

3 Likes

That’s easy to answer: Because Steve Jobs was a genius and a pedant, when it came to design questions. And everybody else is trying to catch up with them. You can see that on Universities around the globe, Apple still is the design, that you’ll be compared with. :slight_smile:

The desing choices of Jobs/Apple were good, that’s out of question. And trying something different will be a task, that is likely to blow up in your face. :laughing:

I’m not a design guy, so I can’t say that this should be this way or not, I’m just saying, that’s what experts tell me about designs and why they look similar in some cases… I for one can only say I like it or not, but that’s my personal choice, not based on anything. :laughing:

see FR Add name, state option to new Badges · home-assistant/frontend · Discussion #21523 · GitHub

1 Like

Thank for replying, Madalena.

I’ll clarify a bit.

If you have the scrolling foundation, are you saying you consider adding that to the section for badges? That would be awesome.

My reference to Apple was just to show the scrolling. I know those aren’t badges. They’re more like filters, like I mentioned in another post as well. While I like that functionality, my intention wasn’t to say that specifically should be duplicated. It was just a quick demo to show the scrolling.

And, I’d very much like to see a vertical layout for fields per badge to make it more compact. :slight_smile:

With an iPad on the wall where I want to read the information from a greater distance, it is desirable to reduce the gutter space between the columns or set it to the same value as between the columns in a section. This leaves more room for the contents of the cards. For example, with 4 cards in 1 row, the space between all columns is the same.

I have seen some reply with “There are some gaps that you can adjust in a theme.yaml”. I have changed the values from 8px to 2px in the slate.yaml, but it did not change on the sections dashboard which I have set to the slate theme. To me it seems the gutter space is fixed and cannot be changed in 2024.08.0

When I change the badge layout to the old style with “custom:hui-state-badge-element”, Is it possible to change the text displayed with the badge if I don’t want it to match the entity name somehow?

Update: Found the tablets were running Android 11. Updated them to Lineage OS 21 (Android 14) and all sections appear properly formatted (hidden).

Potentially found a bug with section visibility when using Kiosk Browser. How do I get this info to the dashboard developers?

Having an issue where hidden sections take space when using Fully Kiosk browser as documented here.

Below are screenshots of my specific issue. The box in red is not visible when using Safari or Chrome but when using Fully Kiosk it is rendered and taking space. The blue box should be where the red box is.

Disagree. And your derisive ‘some developer’ comment raises my hackles.

@Janver448 How did you got rid of the section titles?

Just don’t type anything into them and they won’t be there.

1 Like

what card are you using for the date and time? I have currently sidebar on my tablet and I would like to re-do it with the sections. thanks

I have been using home assistant about 5 years. I am fairly technically literate and have decades of professional experience in an IT adjacent industry. after getting over the learning curve I was able to do what I wanted in HA fairly easily. All of these changes recently to “improve” the UX and UI feels like I’m now being forced use a kids speak and spell to write 2000 lines of complex nested IF/THEN statements. Every time I see an improvement from Home Assistant I add air quotes around it.

things don’t just “break”, lazy developers who are so excited to try new things intentionally break them because they think everyone is excited to try new things. Most users prefer stable systems that just work and hate when someone else breaks things in their house on a random tuesday afternoon.

Not quite so, old badges did not display the zone name in full, they shortened them, also did not display units of measurement, for example alerts for GDACS, or pending updates, new ones display and take up a lot of space, but this is absolutely not necessary. And there is no option to display without units of measurement.

It’s quite old but still works well.

1 Like