Have you finished your humidifer custom card?
Unfortunately no. I asked for the same a couple entries earlier. The ones I found on the forum is not working for my Xiaomi phone. I get the notifications but no alarm sound.
can you share this can i have a look?
Tablet format best practice?
Phone version looks great!.. tablets a dogs breakfast
Is there a style guide or best practice tips for doing a tablet version?
I guess I need to just duplicate everything, or is there a best practice for that?
ie I guess a duplicate of everything in the views folder, but name it home_tab, living_room_tab ect ect?
Thanks in advance 
THANKS! I try that
Mission completed.
The error was in the path, off courseâŚ
Thanks again!
@Jarne_Roussard: I used this as a starting point: A âfind my phone buttonâ - Configuration - Home Assistant Community (home-assistant.io)
@liminal: try layout card with grid mode, you can define the layout based on orientation, screen size etc. and define each block where should they be placed in each view. Very handy, the same config works on my phone, tablet and desktop with a different layout.
1 Like
That sounds amazing! Ive found a guide, but I dont really have any context to how this fits in with what I have already got;
If you can provide some examples with the home screen (assuming its similar to most of the others) so I can see how it fits in, then I should be able to work it out 
Thanks mate
2 Likes
wow! could you share your room card? i have been trying to figure out how to do layouts on these and it is making my eyes go crossedâŚ
I got my inspiration from CM000n:
homeassistant/lovelace-minimalist.yaml at bcf77c073a15a80ab240f7fd158857076292ee09 ¡ CM000n/homeassistant ¡ GitHub
I had to made some enhancements to fit my phone and tablet, âthanksâ to the different screen sizes.
1 Like
Hey guys,
whatâs the best solution for viewing security cameras?? I dont see any custom cards for cameras??
what do you all use for this??
thanks!
I have the same issue.
Colors work fine on my personal MacBook with Chrome but on my phone (Chrome or companion app) or my work MacBook (Chrome or Safari) everything appears white. The only time I manage to see colors is when the color is set with rgb(x, x, x).
Thanks mate, I can work with that
EDIT
Ok, so ive ported CM000ns home view in and made some changes. But it doesnât seem to change.
Just wondering if anything looks wrong here?
Everything is still a mess
Ive set the grids out and defined the layout view for each horozontal stack. This is not the full yaml. But I would have expected the top welcome, to be on its own row as least right?
My other question would be, how does it know which view to use?
What am I missing.
Thanks guys
title: "Home"
path: "home"
views:
- type: custom:grid-layout
layout:
#default
grid-gap: 1px 1px
grid-template-columns: 25% 25% 25% 25%
grid-template-rows: auto
grid-template-areas: |
" . welcome welcome . "
" devices1 devices2 . . "
" devices1 devices2 devices3 . "
" . person . . "
" navigation1 navigation2 navigation3 navigation4 "
" navigation5 navigation6 navigation7 navigation8 "
" list list list list "
" ble . . . "
mediaquery:
#phone
"(max-width: 800px)":
grid-gap: 1px 1px
grid-template-columns: 50% 50%
grid-template-areas: |
" welcome welcome "
" devices_on devices_on "
" person1 person2 "
" navigation1 navigation2 "
" navigation3 navigation4 "
" navigation5 navigation6 "
" navigation7 navigation8 "
" list list "
" ble . "
cards:
- type: "custom:button-card"
template: "card_esh_welcome"
triggers_update: "input_boolean.minimalist_dropdown"
variables:
ulm_card_esh_welcome_collapse: input_boolean.minimalist_dropdown
ulm_weather: "weather.mascot"
entity_1:
nav: "boolean"
icon: "mdi:gesture-tap-button"
name: "Boolean"
color: "blue"
entity_2:
nav: "media"
icon: "mdi:television-classic"
name: "Media"
color: "yellow"
entity_3:
nav: "network"
icon: "mdi:network"
name: Network Stats
color: "green"
entity_4:
nav: "workloads"
icon: "mdi:nas"
name: "Workloads"
color: "purple"
entity_5:
nav: "printer"
icon: "mdi:printer-3d-nozzle"
name: Printer
color: "red"
view_layout:
grid-area: welcome
- type: horizontal-stack
cards:
- type: "custom:button-card"
template: custom_card_yagrasdemonde_lights_count
entity: sensor.lights_on
- type: "custom:button-card"
template: custom_card_yagrasdemonde_lights_count
entity: sensor.covers_open
variables:
ulm_custom_card_yagrasdemonde_lights_count_type: "cover"
ulm_custom_card_yagrasdemonde_lights_count_icon_off: "mdi:window-shutter"
ulm_custom_card_yagrasdemonde_lights_count_color: "green"
view_layout:
grid-area: devices1
- type: horizontal-stack
cards:
- type: "custom:button-card"
template: custom_card_yagrasdemonde_lights_count
entity: sensor.doors_open
variables:
ulm_custom_card_yagrasdemonde_lights_count_type: "doors"
ulm_custom_card_yagrasdemonde_lights_count_icon_off: "phu:sliding-window-door-open"
ulm_custom_card_yagrasdemonde_lights_count_color: "blue"
view_layout:
grid-area: devices2
EDIT
OK, Im getting somewhere, I didnât have the cards lined up correctly.
I still dont get how it will know which view to use. Or how to have the welcome card centered at the top and everything else spread out. But lets see how it goes
EDIT
OK, I kinda got it
1 But how can I make it fill out the screen more?
2 Why does nav1 and nav2 from row 4, come up to row 1 LOL?
3 Can I make row 2 into thirds?
title: "Home"
path: "home"
cards:
- type: custom:layout-card
layout_type: grid
layout:
#default
grid-gap: 1px 1px
grid-template-columns: 25% 25% 25% 25%
grid-template-rows: auto
grid-template-areas: |
" . welcome welcome . "
" devices1 devices1 devices2 devices2 "
" person person person person "
" navigation1 navigation2 navigation3 navigation4 "
" navigation5 navigation6 navigation7 navigation8 "
" navigation9 . . . "
" list list list list "
" ble ble ble ble "
mediaquery:
#phone
"(max-width: 800px)":
grid-gap: 1px 1px
grid-template-columns: 50% 50%
grid-template-areas: |
" welcome welcome "
" devices1 devices1 "
" devices2 devices2 "
" person person "
" navigation1 navigation2 "
" navigation3 navigation4 "
" navigation5 navigation6 "
" navigation7 navigation8 "
" navigation9 . "
" list list "
" ble ble "
1 Like
âmediaqueryâ (in your case max-width) determines the layout to be used. Sadly Iâm not in front of my computer, so can not help more, but I found a lot of useful infomation on the web, f.e. how to show or hide given cards in specific views and so on. If you cannot figure it out Ibwill be available early next week.
1 Like
Has anyone gotten confirmations to work with room cards? I canât seem to get it to work for the 4 small button entities.
Somehow when all doors are closed, it shows me the string of âulm_custom_card_yagrasdemonde_lights_count_light_0:â instead of count_door_0.
I added my own translations.
Worked ok?
Unhelpfully lol, its working fine for me
Make sure all your indentations are correct ect. But if you added your own and its working, all good
Thats the one part I worked out after finding some more examples LOL â(max-width: 800px)â:
Ill post to the layout card as well and see if anyone can tell me what Im messing up LOL
But thanks for pointing me in the right direction
very nice done!
works now, I forgot I needed to set the variable to door oops. Thanks!
1 Like