Add option to create larger tiles

[pjmaenh]

It would be nice to add an option to create larger tiles (e.g. a tile with the width of 2 tiles, or the height of 2 tiles, or both).

This would be very handy, as some components are just too large to fit in a single tile.

[DBuit]

Hi @pjmaenh,

So i am looking into adding this option but how are you gonna use it? is it just because text does not fit in the current tile? of do you wanna render other cards inside a tile?

Wanna see what functionality is needed. Because width is pretty easy to add but when i wanna change the height it gets more complex because other tiles might be smaller so you could get like 1 big tile and 2 small tiles below each other need to see how to build this

[pjmaenh]

I personally was thinking of using larger tiles for custom cards, e.g. to display a webcam picture or a custom:mini-media-player card.

However, this will not be straightforward, especially when you want to combine with 1x1 cards, for example in a layout like this:

[  2x2   ][1x1]
[        ][1x1]
[1x1][1x1][1x1]

Especially when rescaling (e.g. on mobile) this could give some strange effects when the last column appears under the previous columns (similar to how the current rows and columns behave on a mobile device).

I have been playing with customising the layout myself, maybe this can be done in CSS using a grid with grid-template-areas, grid-template-rows and grid-template-rows ?

cfr. https://css-tricks.com/snippets/css/complete-guide-grid/

[acateon]

How about a 2 x 1 or even wider?

[DBuit]

In next release it will be possible to make a tile 1x1, 2x1, 2x2 or 1x2 but it would look really great if you use 2x2 togheter with 1x1 so i have to see how to make it better. maybe the grid system but that means rewrite the whole thing.... haha

[DBuit]

@aceteon and @pjmaenh i just release v0.4 where you can use wider and higher option on an entity to get tiles that are bigger

[acateon]

Looks great!

Just one thing, it doesn't play so nice with the mini-media-player card. It looks great but there's something going on with the controls not functioning. As if that div containing the play/pause-buttons being a lower z index.

[DBuit]

@acateon can you share how you configure this than i can check if i can do something

[acateon]

`

                  - card: 'custom:mini-media-player'
                    noPadding: true
                    wider: true
                    higher: true
                    cardOptions:
                      entity: media_player.kok
                      info: hidden
                      icon: false
                      artwork: full-cover
                      hide:
                        mute: true
                        icon: true
                        power: true
                        power_state: true
                        progress: true
                        source: true
                        volume: true

`

[DBuit]

@acateon already placed reaction on your other issue with the error in console. This fixes the controls on the cards

[skank01]

Is this included yet? Would love to see 2x1 and 1x2 tiles too, for ex for weather card

[pjmaenh]

@skank01 Yes since v0.4 you can use wider and higher option @DBuit thanks for this update btw! Apologies for the slow reply, have been busy weeks so didn't get much time to play with lovelace

[skank01]

Oh cool you're from Ghent :) I'm from Knokke

Anyway, nice we can use larger tiles then. Got to get it working first :p see other issue

[tws80]

@DBuit On the topic of wider/higher tiles, is there there the possibility of adding 1/2 hight tiles. I would love to be able to use 1/2(h)x2(w) for something like scenes or scripts that does not really have addition information.

[DBuit]

@tws80 i added the half height option check release 0.4.9 of the card