misse
December 3, 2022, 3:26pm
312
Hi! Thanks for a great card
I am trying to build room cards that have cards that show conditionally, but when Iām adding a cards: entry into the room - they seem to keep refreshing very often, which makes them reset while youāre interacting with them.
Iāll attach a gif of what it looks like.
Gist with yaml for the dashboard: blinking_hass.yaml Ā· GitHub
Does anyone know whatās causing this? It doesnāt seem to be just custom:mushroom-light-card, since custom:mini-media-player is refreshing as well.
1 Like
If one of the entities used in the card changes value, the whole card refreshes. That includes the cards inside room card
misse
December 4, 2022, 1:55pm
314
Thanks Marco - so it makes more sense to have cards that are dynamic/update a lot outside of the baked in cards list? I ended up using vertical-stack and conditional cards like below.
type: custom:vertical-stack-in-card
cards:
- type: custom:room-card
title: Vardagsrum
entity: light.living_room
icon: mdi:lightbulb-outline
show_icon: true
tap_action:
action: toggle
entities:
- entity: light.livingroom_couch_ceiling_lamp
name: Sofflampa
tap_action:
action: toggle
- entity: switch.livingroom_window_star
name: StjƤrna
icon: mdi:star-outline
show_icon: true
state_color: true
tap_action:
action: toggle
- entity: switch.livingroom_corner_plug
name: Ledslinga
icon: mdi:led-strip
show_icon: true
state_color: true
- entity: media_player.living_room_tv
name: TV
show_icon: true
state_color: true
tap_action:
action: call-service
service: media_player.media_play_pause
service_data:
entity_id: media_player.living_room_tv
icon:
conditions:
- condition: equals
value: playing
icon: mdi:television-play
- condition: equals
value: paused
icon: mdi:television-pause
- condition: equals
value: stopped
icon: mdi:television
- entity: media_player.living_room_speaker
show_icon: true
state_color: true
icon: mdi:google-home
name: Speaker
- type: conditional
conditions:
- entity: media_player.living_room_tv
state_not: 'off'
card:
type: custom:mini-media-player
entity: media_player.living_room_tv
- type: conditional
conditions:
- entity: media_player.living_room_speaker
state_not: 'off'
card:
type: custom:mini-media-player
entity: media_player.living_room_speaker
- type: conditional
conditions:
- entity: light.livingroom_couch_ceiling_lamp
state: 'on'
card:
type: custom:mushroom-light-card
entity: light.livingroom_couch_ceiling_lamp
show_brightness_control: true
show_color_temp_control: true
fill_container: true
Yes exactly. The room card isnāt really designed to house other cards, the fact it does is just something extra. But itās always best to not nest cards
foglietti
December 9, 2022, 3:56pm
316
Hello. I want to horizontally justify the entities of a row to avoid empty spaces in the right part of the cards.
Thanks.
GH2user
December 10, 2022, 1:35pm
317
@marcokreeft87
- entity: input_boolean.mailbox_full
show_icon: true
state_color: true
name: mail
icon:
state_on: mdi:mailbox-up
color_on: red
state_off: mdi:mailbox-outline
color_off: green
You could use templates. So not for values but templates for the whole entities Configuration Ā· marcokreeft87/room-card Wiki Ā· GitHub
You could try card mod. Or conditions?
1 Like
foglietti
December 11, 2022, 7:57pm
320
OK, I will investigate using these two options with the card.
Thanks.
ronvl
January 6, 2023, 3:32pm
321
First off all thank you for this awsome card! It allowed me to get everything on a single page and the interface it gives works very well.
nice is also the flexibility to use browser_mod.popup which creates a perfect interface, for example clicking the Lights icon in living room pops up:
4 Likes
Ofir
January 8, 2023, 7:17am
322
Hey!example
but I keep getting an error:
type: custom:button-card
template:
- card_room
- red_no_state
name: Bathroom
entity: light.bathroom
icon: mdi:shower-head
tap_action:
action: navigate
navigation_path: /ui-lovelace-minimalist/bathroom
variables:
label_use_temperature: false
label_use_brightness: true
entity_1:
entity_id: light.bathroom
templates:
- yellow_on
tap_action:
action: toggle
entity_2:
entity_id: binary_sensor.badkamer_motion_sensor
templates:
- blue_on
tap_action:
action: none
entity_3:
entity_id: input_boolean.badkamer_motionsensor_enabled
templates:
- green_on
- red_off
tap_action:
action: toggle
entity_4:
entity_id: input_boolean.bath_mode
templates:
- pink_on
tap_action:
action: toggle
I do have a room card in HACS and I did empty my cache and did reload the page as well.
pkscout
January 8, 2023, 1:41pm
323
Seems like you have the wrong name for Custom Room Card. Try room-card or maybe custom:room-card. Iām not familiar with button-card, so Iām not sure what that template section is expecting. Or maybe there is some step in button-card you need to do to make the card_room template?
Ofir
January 8, 2023, 1:51pm
324
Great, now it showing me some card, but not what they should look like
should look like this:https://ui-lovelace-minimalist.github.io/UI/usage/cards/card_room/#usage
pkscout
January 8, 2023, 5:01pm
325
Ofir:
What am I missing here?
Youāre in the wrong thread for starters. This thread is for a custom card called Room Card. You seem to be trying to use UI Lovelace Minimalist, which has an option for something called a room card. But itās not this one. Iād try this thread for UI Lovelace Minimalist.
Bokubās post , I had several requests for more details on my configuration. I drew a lot of inspiration from 7ahangās work that I found on Behance.
[HA]
2 Likes
Beersteddy
January 8, 2023, 6:31pm
326
Any chance you can share the code?
pkscout
January 9, 2023, 12:58am
327
Iām stumped. I have a socket for a fan that I use to control the Christmas tree during the holidays. I also have a couple sockets I only plug in during the holidays, so Iām trying to use their availability to set a name and icon for another entity so that my interface either shows a Fan or a Tree. It doesnāt seem like room-card understands unavailable as a state for an entity, or at least I canāt figure it out. Hereās what I have that doesnāt work (i.e. it always shows the Tree even when the sockets are unavailable).
entities:
- entity: fan.living_room
hide_if:
conditions:
- condition: not_equals
entity: switch.holiday_lights_1
attribute: state
value: 'unavailable'
name: Fan
state_color: true
show_icon: true
tap_action:
action: toggle
- entity: fan.living_room
hide_if:
conditions:
- condition: equals
entity: switch.holiday_lights_1
attribute: state
value: 'unavailable'
name: Tree
state_color: true
show_icon: true
icon: mdi:pine-tree
tap_action:
action: toggle
State isnt an attribute, try without the āattributeā
1 Like
ronvl
January 9, 2023, 3:50pm
329
Not all of it but here is something to get you going
type: vertical-stack
cards:
- type: custom:room-card
title: Living Room
entities:
- entity: light.living_room_lights
name: Lights
show_icon: true
icon:
state_on: mdi:light-switch
state_off: mdi:light-switch-off
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: entities
state_color: true
show_header_toggle: true
entities:
- type: custom:slider-entity-row
entity: light.living_room_sphere
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.living_room_ceiling
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.living_room_leds_channel_1
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.sideboard_stairs_channel_1
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.staircase_kg_2
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.living_room_leds_channel_3
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.living_room_leds_channel_2
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.kitchen_light
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.gallery_wall_light
hide_state: true
toggle: true
step: 1
- entity: light.kitchen_counter
- entity: light.black_1_switch
double_tap_action:
action: none
hold_action:
action: none
- entity: input_boolean.scene_livingroom_off
name: Scenes
icon:
state_off: mdi:lightbulb-group
state_on: mdi:lightbulb-group-off-outline
template:
styles: >
if (states["input_boolean.scene_livingroom_off"].state == 'off')
return 'color:var(--paper-item-icon-active-color)';
show_icon: true
state_color: false
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: entities
state_color: true
entities:
- entity: input_boolean.scene_livingroom_off
name: 'Off'
state_color: true
tap_action:
action: toggle
- entity: input_boolean.scene_livingroom_normal
name: 'On'
state_color: true
tap_action:
action: toggle
- entity: input_boolean.scene_livingroom_dim
name: Dim
state_color: true
tap_action:
action: toggle
- entity: input_boolean.scene_livingroom_tvtime
name: TV Time
state_color: true
tap_action:
action: toggle
- entity: input_boolean.livingroom_motion_control
name: Control
state_color: true
tap_action:
action: toggle
- entity: binary_sensor.living_room_motion
name: Motion
state_color: true
show_icon: true
- entity: cover.living_room_shutters
name: Shutters
state_color: true
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: entities
state_color: true
entities:
- entity: cover.living_room_shutters
- type: custom:slider-entity-row
entity: cover.living_room_shutters
full_row: true
step: 1
- type: divider
- entity: cover.living_room_1
- type: custom:slider-entity-row
entity: cover.living_room_1
full_row: true
step: 1
- type: divider
- entity: cover.living_room_2
- type: custom:slider-entity-row
entity: cover.living_room_2
full_row: true
step: 1
- type: divider
- entity: cover.living_room_3
- type: custom:slider-entity-row
entity: cover.living_room_3
full_row: true
step: 1
- type: divider
- entity: cover.living_room_4
- type: custom:slider-entity-row
entity: cover.living_room_4
full_row: true
step: 1
- entity: media_player.livingroom
name: Display
state_color: true
show_icon: true
icon: mdi:television
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: media-control
entity: media_player.livingroom
- entity: media_player.home_theater
name: Audio
state_color: true
show_icon: true
icon: mdi:audio-video
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: media-control
entity: media_player.home_theater
- entity: media_player.living_room_tv
name: TV
state_color: true
show_icon: true
icon: mdi:television
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: media-control
entity: media_player.living_room_tv
- entity: binary_sensor.sliding_door_access_control_window_door_is_open
name: Door
show_icon: true
state_color: true
icon:
state_on: mdi:door-sliding_open
state_off: mdi:door-sliding
- entity: switch.fridge
show_icon: true
state_color: true
- entity: switch.dishwasher_power_on
show_icon: true
state_color: true
- entity: switch.steam_combination_oven_power_on
show_icon: true
state_color: true
info_entities:
- entity: sensor.multisensor_6_air_temperature
- entity: sensor.multisensor_6_humidity
- entity: sensor.multisensor_6_illuminance
card_mod:
style: |
ha-card {
height: 100% !important;
}
.card-header .entities-info-row {
padding: 0px 0px 0px 0px;
margin: 0px;
right: 10px;
top: 0px;
}
.card-header {
margin: 0px;
padding: 0px 0px 0px 8px;
right: 10px;
top: 0px;
font-size: 18px !important;
}
.entities-row.content-left {
padding: 0px 0px 0px 8px;
margin-right: 0px;
margin-left: 0px;
}
.entities-row.content-left .entity {
padding: 0px 0px 0px 0px;
margin-right: 3px;
margin-left: 3px;
}
- type: custom:room-card
title: Living Room Luca
entities:
- entity: light.living_room_luca_lights
name: Lights
show_icon: true
icon:
state_on: mdi:light-switch
state_off: mdi:light-switch-off
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: entities
state_color: true
show_header_toggle: true
entities:
- type: custom:slider-entity-row
entity: light.luca_living_room_ceiling
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.living_room_luca_spheres
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.living_room_luca_right_sphere
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.living_room_luca_left_sphere
hide_state: true
toggle: true
step: 1
double_tap_action:
action: none
hold_action:
action: none
- entity: cover.luca_living_room
name: Shutter
state_color: true
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: entities
state_color: true
entities:
- entity: cover.luca_living_room
- type: custom:slider-entity-row
entity: cover.luca_living_room
full_row: true
step: 1
- entity: media_player.nestaudio5366
name: Speaker
state_color: true
show_icon: true
icon: mdi:speaker
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: media-control
entity: media_player.nestaudio5366
- entity: media_player.samsung_ue55ku6079_3
name: TV
state_color: true
show_icon: true
icon: mdi:television
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: media-control
entity: media_player.samsung_ue55ku6079_3
info_entities:
- entity: sensor.luca_living_room_ht_temperature
- entity: sensor.luca_living_room_ht_humidity
card_mod:
style: |
ha-card {
height: 100% !important;
}
.card-header .entities-info-row {
padding: 0px 0px 0px 0px;
margin: 0px;
right: 10px;
top: 0px;
}
.card-header {
margin: 0px;
padding: 0px 0px 0px 8px;
right: 10px;
top: 0px;
font-size: 18px !important;
}
.entities-row.content-left {
padding: 0px 0px 0px 8px;
margin-right: 0px;
margin-left: 0px;
}
.entities-row.content-left .entity {
padding: 0px 0px 0px 0px;
margin-right: 3px;
margin-left: 3px;
}
- type: custom:room-card
title: Bedroom
entities:
- entity: light.bedroom_lights
show_icon: true
icon:
state_on: mdi:light-switch
state_off: mdi:light-switch-off
name: Lights
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: entities
state_color: true
show_header_toggle: true
entities:
- entity: light.bedroom_ron
name: Ron
- entity: light.bedroom_ledi
name: Ledi
double_tap_action:
action: none
hold_action:
action: none
- entity: input_boolean.bedroom_motion_control
name: Control
state_color: true
tap_action:
action: toggle
- entity: binary_sensor.bedroom_home_security_motion_detection
name: Motion
state_color: true
show_icon: true
- entity: cover.bedroom_shutters
name: Shutters
state_color: true
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: entities
state_color: true
entities:
- entity: cover.bedroom_shutters
- type: custom:slider-entity-row
entity: cover.bedroom_shutters
full_row: true
step: 1
- type: divider
- entity: cover.bedroom_1
- type: custom:slider-entity-row
entity: cover.bedroom_1
full_row: true
step: 1
- type: divider
- entity: cover.bedroom_2
- type: custom:slider-entity-row
entity: cover.bedroom_2
full_row: true
step: 1
- type: divider
- entity: cover.bedroom_3
- type: custom:slider-entity-row
entity: cover.bedroom_3
full_row: true
step: 1
- entity: media_player.bedroom_display
name: Display
state_color: true
show_icon: true
icon: mdi:television
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: media-control
entity: media_player.bedroom_display
info_entities:
- entity: sensor.bedroom_air_temperature
- entity: sensor.bedroom_humidity
- entity: sensor.bedroom_illuminance
card_mod:
style: |
ha-card {
height: 100% !important;
}
.card-header .entities-info-row {
padding: 0px 0px 0px 0px;
margin: 0px;
right: 10px;
top: 0px;
}
.card-header {
margin: 0px;
padding: 0px 0px 0px 8px;
right: 10px;
top: 0px;
font-size: 18px !important;
}
.entities-row.content-left {
padding: 0px 0px 0px 8px;
margin-right: 0px;
margin-left: 0px;
}
.entities-row.content-left .entity {
padding: 0px 0px 0px 0px;
margin-right: 3px;
margin-left: 3px;
}
- type: custom:room-card
title: Bedroom Luca
entities:
- entity: light.bedroom_luca_lights
show_icon: true
icon:
state_on: mdi:light-switch
state_off: mdi:light-switch-off
name: Lights
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: entities
state_color: true
show_header_toggle: true
entities:
- type: custom:slider-entity-row
entity: light.luca_bedroom_light
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.bedroom_luca
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.right_sphere_light_0
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.left_sphere_light_0
hide_state: true
toggle: true
step: 1
double_tap_action:
action: none
hold_action:
action: none
- entity: media_player.luca_bedroom
name: Speaker
state_color: true
show_icon: true
icon: mdi:speaker
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: media-control
entity: media_player.luca_bedroom
- entity: media_player.chromecast
name: Chromecast
state_color: true
show_icon: true
icon: mdi:google-chrome
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: media-control
entity: media_player.chromecast
info_entities:
- entity: sensor.luca_bedroom_ht_temperature
- entity: sensor.luca_bedroom_ht_humidity
card_mod:
style: |
ha-card {
height: 100% !important;
}
.card-header .entities-info-row {
padding: 0px 0px 0px 0px;
margin: 0px;
right: 10px;
top: 0px;
}
.card-header {
margin: 0px;
padding: 0px 0px 0px 8px;
right: 10px;
top: 0px;
font-size: 18px !important;
}
.entities-row.content-left {
padding: 0px 0px 0px 8px;
margin-right: 0px;
margin-left: 0px;
}
.entities-row.content-left .entity {
padding: 0px 0px 0px 0px;
margin-right: 3px;
margin-left: 3px;
}
- type: custom:room-card
title: Bathroom
entities:
- entity: light.bathroom_lights
name: Lights
show_icon: true
state_color: true
icon:
state_on: mdi:light-switch
state_off: mdi:light-switch-off
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: entities
state_color: true
show_header_toggle: true
entities:
- type: custom:slider-entity-row
entity: light.bathroom_eg_ceiling
hide_state: true
toggle: true
step: 1
- type: custom:slider-entity-row
entity: light.bathroom_cabinet_channel_1
hide_state: true
toggle: true
step: 1
double_tap_action:
action: none
hold_action:
action: none
- entity: input_boolean.scene_bathroom_eg_off
name: Scenes
icon:
state_off: mdi:lightbulb-group
state_on: mdi:lightbulb-group-off-outline
template:
styles: >
if (states["input_boolean.scene_bathroom_eg_off"].state == 'off')
return 'color:var(--paper-item-icon-active-color)';
show_icon: true
state_color: false
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: entities
state_color: true
entities:
- entity: input_boolean.scene_bathroom_eg_off
name: 'Off'
state_color: true
tap_action:
action: toggle
- entity: input_boolean.scene_bathroom_eg_on
name: 'On'
state_color: true
tap_action:
action: toggle
- entity: input_boolean.scene_bathroom_eg_dim
name: Dim
state_color: true
tap_action:
action: toggle
- entity: input_boolean.bathroom_eg_motion_control
name: Control
state_color: true
tap_action:
action: toggle
- entity: binary_sensor.bathroom_eg_home_security_motion_detection
name: Motion
state_color: true
show_icon: true
- entity: media_player.bathroom
name: Speaker
state_color: true
show_icon: true
icon: mdi:speaker
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
content:
type: media-control
entity: media_player.bathroom
info_entities:
- entity: sensor.bathroom_eg_air_temperature
- entity: sensor.bathroom_eg_humidity
- entity: sensor.bathroom_eg_illuminance
card_mod:
style: |
ha-card {
height: 100% !important;
}
.card-header .entities-info-row {
padding: 0px 0px 0px 0px;
margin: 0px;
right: 10px;
top: 0px;
}
.card-header {
margin: 0px;
padding: 0px 0px 0px 8px;
right: 10px;
top: 0px;
font-size: 18px !important;
}
.entities-row.content-left {
padding: 0px 0px 0px 8px;
margin-right: 0px;
margin-left: 0px;
}
.entities-row.content-left .entity {
padding: 0px 0px 0px 0px;
margin-right: 3px;
margin-left: 3px;
}
view_layout:
grid-area: main1
1 Like
pkscout
January 9, 2023, 11:06pm
330
Thanks. That did it. I swear I thought I had tried that variation, but if I did I had the logic wrong.
1 Like
Good news! Another bug fixed :
opened 08:53PM - 22 Oct 22 UTC
bug
Version: 1.07.00 but I guest for all of them
**Describe the bug**
On and offā¦ (toggle) entities on phone where we`re using finger and scrolling entities turn on... but should on when I press on that button, please have a look on video, this is not happened on other entities or some other functions on HA :)
**To Reproduce**
use phone or watch a movie..
**Screenshots**
https://youtu.be/uit821515mQ
**Desktop (please complete the following information):**
On laptop we don`t use touch screen but will be the same.
- Device:iphone and adroid
