using a horizontal-stack with device_trackers on Tile card, we get a double indicator for the state: the badge icon ad the actual state.
in this case, the trackers are for home network connectivity only so I require just home/not_home:
personally I dislike the ‘Thuis’ on each tracker very much and would love to take that out. Given the core options , we can not however…
type: tile
vertical: true
state: ' ' #fake, does not work
I tested card_mod on this:
card_mod:
style:
.: |
ha-tile-info$: |
.secondary {
visibility: hidden; /* also tested 'display: none'*/
}
but I cant get the secondary to disappear.
So resorting to Mushroom person card, whihc is a bit funny ofc since these are not persons at all, but it provides the badge icon.
type: custom:mushroom-person-card
secondary_info: none
layout: vertical
coloring is a bit different, but that is way less intrusive than the double state info
Wondering if there are any other solutions to this ‘problem’
heck, had a typo there:
card_mod:
style:
ha-tile-info$: |
.secondary {
visibility: hidden;
}
fixes it, though the filed still exists, and the Tiles are very rectangular.
using
card_mod:
style:
ha-tile-info$: |
.secondary {
display: none;
}
squares that out nicely in the grid with the option set to true:
bremby
August 15, 2023, 8:52pm
3
There’s a way to show the latest change as the secondary info?
markaabo
October 12, 2023, 3:33pm
4
I still seem to have empty space uncer the cards when using the secound solution you listed.
My current card code is:
type: custom:vertical-stack-in-card
cards:
- type: entity
entity: input_text.floorplan_mode
name: Mode
- type: horizontal-stack
cards:
- type: tile
tap_action:
action: call-service
service: input_text.set_value
target:
entity_id: input_text.floorplan_mode
data:
value: LIGHTS_SINGLE
entity: input_text.floorplan_mode
icon: mdi:lightbulb
vertical: true
color: purple
name: ' '
show_entity_picture: false
icon_tap_action:
action: call-service
service: input_text.set_value
target:
entity_id: input_text.floorplan_mode
data:
value: LIGHTS_SINGLE
card_mod:
style:
ha-tile-info$: |
.secondary {
display: none;
}
- type: tile
tap_action:
action: call-service
service: input_text.set_value
target:
entity_id: input_text.floorplan_mode
data:
value: LIGHTS_GROUP
entity: input_text.floorplan_mode
icon: mdi:lightbulb-group
vertical: true
color: purple
name: ' '
show_entity_picture: false
icon_tap_action:
action: call-service
service: input_text.set_value
target:
entity_id: input_text.floorplan_mode
data:
value: LIGHTS_GROUP
card_mod:
style:
ha-tile-info$: |
.secondary {
display: none;
}
- type: tile
tap_action:
action: call-service
service: input_text.set_value
target:
entity_id: input_text.floorplan_mode
data:
value: SOCKETS
entity: input_text.floorplan_mode
icon: mdi:power-socket-eu
vertical: true
color: purple
name: ' '
show_entity_picture: false
icon_tap_action:
action: call-service
service: input_text.set_value
target:
entity_id: input_text.floorplan_mode
data:
value: SOCKETS
card_mod:
style:
ha-tile-info$: |
.secondary {
display: none;
}
- type: tile
tap_action:
action: call-service
service: input_text.set_value
target:
entity_id: input_text.floorplan_mode
data:
value: INFOMATION
entity: input_text.floorplan_mode
icon: mdi:information-slab-circle
vertical: true
color: purple
name: ' '
show_entity_picture: false
icon_tap_action:
action: call-service
service: input_text.set_value
target:
entity_id: input_text.floorplan_mode
data:
value: INFOMATION
card_mod:
style:
ha-tile-info$: |
.secondary {
display: none;
}
- type: horizontal-stack
cards:
- type: conditional
conditions:
- entity: input_text.floorplan_mode
state: LIGHTS_SINGLE
card:
type: picture-elements
elements:
- type: state-icon
entity: light.entre_kokken
tap_action:
action: toggle
style:
top: 28%
left: 39%
border-radius: 50%
background-color: rgba(255, 255, 255, 0.75)
- type: state-icon
entity: light.stue
tap_action:
action: toggle
style:
top: 62%
left: 30%
border-radius: 75%
background-color: rgba(255, 255, 255, 0.75)
- type: state-icon
entity: light.sovevaerelse
tap_action:
action: toggle
style:
top: 65%
left: 66%
border-radius: 75%
background-color: rgba(255, 255, 255, 0.75)
image: http://192.168.1.150:8123/local/Lejlighed_Grundplan_BG.png
- type: conditional
conditions:
- entity: input_text.floorplan_mode
state: LIGHTS_GROUP
card:
type: picture-elements
elements:
- type: state-icon
entity: light.entre_kokken
tap_action:
action: toggle
style:
top: 28%
left: 39%
border-radius: 50%
background-color: rgba(255, 255, 255, 0.75)
- type: state-icon
entity: light.stue
tap_action:
action: toggle
style:
top: 62%
left: 30%
border-radius: 75%
background-color: rgba(255, 255, 255, 0.75)
- type: state-icon
entity: light.sovevaerelse
tap_action:
action: toggle
style:
top: 65%
left: 66%
border-radius: 75%
background-color: rgba(255, 255, 255, 0.75)
image: http://192.168.1.150:8123/local/Lejlighed_Grundplan_BG.png
- type: conditional
conditions:
- entity: input_text.floorplan_mode
state: SOCKETS
card:
type: picture-elements
elements:
- type: state-icon
entity: light.entre_kokken
tap_action:
action: toggle
style:
top: 28%
left: 39%
border-radius: 50%
background-color: rgba(255, 255, 255, 0.75)
- type: state-icon
entity: light.stue
tap_action:
action: toggle
style:
top: 62%
left: 30%
border-radius: 75%
background-color: rgba(255, 255, 255, 0.75)
- type: state-icon
entity: light.sovevaerelse
tap_action:
action: toggle
style:
top: 65%
left: 66%
border-radius: 75%
background-color: rgba(255, 255, 255, 0.75)
image: http://192.168.1.150:8123/local/Lejlighed_Grundplan_BG.png
- type: conditional
conditions:
- entity: input_text.floorplan_mode
state: INFOMATION
card:
type: picture-elements
elements:
- type: state-icon
entity: light.entre_kokken
tap_action:
action: toggle
style:
top: 28%
left: 39%
border-radius: 50%
background-color: rgba(255, 255, 255, 0.75)
- type: state-icon
entity: light.stue
tap_action:
action: toggle
style:
top: 62%
left: 30%
border-radius: 75%
background-color: rgba(255, 255, 255, 0.75)
- type: state-icon
entity: light.sovevaerelse
tap_action:
action: toggle
style:
top: 65%
left: 66%
border-radius: 75%
background-color: rgba(255, 255, 255, 0.75)
image: http://192.168.1.150:8123/local/Lejlighed_Grundplan_BG.png
- square: false
type: grid
cards:
- type: tile
entity: sensor.hue_motion_sensor_1_battery
name: 'Hue sensor: Enclosure'
- type: tile
entity: sensor.kontakt_stue_battery
name: 'Switch: Stue'
- type: tile
entity: sensor.kontakt_entre_battery
name: 'Switch: Entré'
- type: tile
entity: sensor.sm_a515f_battery_level
name: Samsung A51
columns: 2
sorry, but I have no idea what you mean, if you need some assistance, just list the minimum of yaml that creates the issue, and show us what you see.
markaabo
October 15, 2023, 4:35pm
6
i can do a screenshot highlighting the issue so here:
Also heres the specific bit that has those tiles (basicly just removed everything after the tiles):
type: custom:vertical-stack-in-card
cards:
- type: entity
entity: input_text.floorplan_mode_display
name: Mode
- type: horizontal-stack
cards:
- type: tile
tap_action:
action: call-service
service: script.floor_plan
target: {}
entity: input_text.floorplan_mode_code
icon: mdi:lightbulb
vertical: true
color: purple
name: ' '
show_entity_picture: false
icon_tap_action:
action: call-service
service: script.floor_plan
target: {}
card_mod:
style:
ha-tile-info$: |
.secondary {
display: none;
}
- type: tile
tap_action:
action: call-service
service: script.home_floorplan_mode_lights_group
target: {}
entity: input_text.floorplan_mode_code
icon: mdi:lightbulb-group
vertical: true
color: purple
name: ' '
show_entity_picture: false
icon_tap_action:
action: call-service
service: script.home_floorplan_mode_lights_group
target: {}
card_mod:
style:
ha-tile-info$: |
.secondary {
display: none;
}
- type: tile
tap_action:
action: call-service
service: script.home_floorplan_mode_sockets
target: {}
entity: input_text.floorplan_mode_code
icon: mdi:power-socket-eu
vertical: true
color: purple
name: ' '
show_entity_picture: false
icon_tap_action:
action: call-service
service: script.home_floorplan_mode_sockets
target: {}
card_mod:
style:
ha-tile-info$: |
.secondary {
display: none;
}
- type: tile
tap_action:
action: call-service
service: script.home_floorplan_mode_infomation
target: {}
entity: input_text.floorplan_mode_code
icon: mdi:information-slab-circle
vertical: true
color: purple
name: ' '
show_entity_picture: false
icon_tap_action:
action: call-service
service: script.home_floorplan_mode_infomation
target: {}
card_mod:
style:
ha-tile-info$: |
.secondary {
display: none;
}
