Upcoming Discussion - Sections

[kauelima]

Firstly, this aims to be a discussion about the Sections Feature that had a sneak peek in last week’s video as shown by Madalena, Matthias and Paul. I don’t know if this is the best place for it to be, but there is no “Upcoming” category here.

I want to first congratulate you guys, that looks like a HUGE step into getting more logic into the dashboard creation. So i wanted to make this topic here for us to discuss other things that can be into this feature in the future. I’ll start with my ideas but please let this be a repository of ideas for everyone!

Those are just some ideas I had while hearing about the new feature, as a product person my brain was full power after this! hahahha

Types of sections

As seen in the presentation, this is already going to be prepared for new types of sections in the future, but two of them are a must have in my opinion. Vertical Stack and Horizontal Stack. I know that those are already a “card” but with this sections feature it make no sense for them to be cards. Layout organization belongs here.

Number of columns (and lines) in a grid

Another way of getting vertical/horizontal stacks in while giving even more flexibility is letting users choose the number of columns (and lines) in each grid, a vertical stack is 1 by N grid, a horizontal stack is N by 1 grid. This is a bit more advanced but can be the underlining feature that horizontal/vertical use to make it easier for users.

Sections inside sections

With all that in mind, I feel the need of nesting sections, it’s something I already do to create “micro-components” inside of my dashboard like the one pictured bellow.

That can be achieved with the stacks inside of a section. But if we have sections controlling all the layout organization like I said previouslly, that could be better resolved like the layout bellow:

More options in sections

What about letting sections have their own set of options. The first ones would be display/hide title but maybe we could have things like section appearance (will this section be a card or it will be a free floating element?)

[Massamino]

I’m happy with the new layout as well and agree with the grid stuff.

• An option to set how many grid rows/columns a card (or whatever) takes in the section.
• Maybe an option to span sections themselves over multiple rows/columns (so you can have sections like 2 - 1, 1 - 1 - 1, …)
• Native support for css alteration maybe (in sections and cards) (yes, I know you can install mods )

[teachingbirds (Isabella Gross Alström)]

After playing around with the demo and reading the blog post (I have not yet watched the video) your post basically sums up my thoughts nicely too! It would also be amazing if we could have some sort of “span” feature. Basically some way of for example achieving a view with tre columns, but the first row has a section that spans column 1-3 (like a header) or something in that style. Could maybe be achieved with the “sections in sections” thingy.
But the most crucial feature I think is choosing number of columns. I don’t particularly like four columns, but would rather have three. And in some views just two “main” sections, and then divide them into sections…

[kauelima]

I agree 100% with the “span” feature. After playing a little more, I feel that this will even make it easier for those custom cards that we use that will take some time to get updated, if ever.

I also ran into the issue with default cards I wanted spanning through all 4 columns but being only 2 in the section.

[MiguelAngelLV (Miguel Ángel)]

The nesting sections are needed.

A simple way to add all in the same card with section layout should be enough for now.

[Freemann (Marco F.)]

Don’t know if this is the right place/topic, but;
I updated to 2024.3.0 and when I create a new dashboard from scratch, I don’t get the option to choose the view type.
Does anybody know how to get this option?

(I couldn’t find any other topic about the new View Type)

[dzerovibe]

Create the dashboard, and then go to the new dashboard and start editing. You’ll now see a row of “views” across the top, with one view called Home already created. Click to edit the view, and there you’ll find the option for view type.

[Freemann (Marco F.)]

Thanks found it and didn’t know that!

[lweberru (Lukas)]

Hi,
a simple conversion utility for the migration would be great. There does not need to be much intelligence in the conversion itself, because you can simply rearrange the details with drag an drop so fast now.
I already started to convert several things manually, with great results. But still takes long to copy every single card from old to new view.
Regards

[kauelima]

That is a great Idea. It had to copy and paste manually all my configs in the one dashboard I recreated using sections. It would help a lot!

[HJM (John Munro)]

Maybe this is possible now or not, I don’t know. I am looking for a way to add a Tile card to a section and have it use both columns WITHIN in that section (unlike the span feature talked about above).

The tile card uses a climate entity and a single column within a section is too narrow. It needs to span across the whole section width.

The card in a masonry layout:

And in the sections layout it is too narrow:

Update:
I can get this to span both columns by putting the tile card inside a horizontal stack, but that feels like a bit of a hack. There should be an intuitive method to add a card and specify its size (number of columns, rows).

[kauelima]

The span feature we discussed is exactly that. Not between different sections. And today unfortunately the only way to do this is the way you did with the horizontal stack.

[madelena]

Thanks for the feedback.

Spanning cards over a specified number of grid columns and rows, i.e. card resizing, is in the works! It’s another tough nut to crack because it involves essentially redesigning every card, so please be patient.

Spanning sections over a number of section columns, however, will likely be reserved as a power user feature who really knows what they are doing, because… it will essentially undo the responsive design problem we just solved with Sections, by making Sections resizing unpredictably as they would no longer necessarily fit on mobile. (In short, we don’t want your household members to be able to create an unusable dashboard too easily.)

And there will be dedicated special header/footer sections available for normal users, as we’ve noticed that is the use case for most users who asked for that feature.

[kauelima]

Lovely @madalena ! The resizing of cards will help already on most of the situations described on this thread! Thanks for your hard work!

[BBESINET (BBE)]

@madelena

Spanning cards over a specified number of grid columns and rows, i.e. card resizing, is in the works! It’s another tough nut to crack because it involves essentially redesigning every card, so please be patient.

Very good !

Will there be a way to have this also for custom cards?
I am here mainly thinking about the famous stack-in cards (which would be a marvelous core feature, but that is another story…).

[Gliding2347]

Jumping on the bandwagon, I am also really loving the Sections feature.

One additional thing I am missing is the ability to show/hide a section conditionally.

[Richi_Bowzer]

you can do this, but you would have to make each card conditional in the section

[Richi_Bowzer]

I was able to do this no issue just with a custom button card, then grid for each row, but it would be nice to have each card as its own eliment.

[kauelima]

Nice! The only issue with this is that you loose the ability to drag and drop cards with this. You will drag an drop the whole grid right?

[GH2user]

I do love the way we can keep the cards in a specific order. Drag and drop sections and cards in sections works great. Good job team!

I think our current cards are taking up a lot of space and also if we use a section header a lot of white space on the right. Please consider using the space next to the section header for data display.
To maximise space usage I combine the custom ‘room-card’ and tiles to get a nice overview.

To add a feature request; it would be great if we can show a hidden section by clicking somewhere. For instance my light controls are default hidden and only show when a light in the room is on. It would be great if I can click on a lightbulb icon to show the controls section if I want them on earlier than the automations do it.