Hi Guys,
Is there a way to hide all the entities, i would like only when i click on the Sensors header that all the entities will shown, please look at the picture below:
Please look at code for the following picture:
- type: vertical-stack
cards:
- type: horizontal-stack
cards:
- type: "custom:button-card"
aspect_ratio: 14/1
name: Sensors
styles:
card:
- border-radius: 15px
- background: none
- box-shadow: none
name:
- justify-self: start
- padding-left: 15px
# - font-weight: bold
- font-size: 15px
- color: AliceBlue
- type: horizontal-stack
cards:
- type: custom:decluttering-card
template: sensorgreen2black
variables:
- name: Front Door
- entity: binary_sensor.door_window_sensor_158d0001d68618
- icon: mdi:door
- type: custom:decluttering-card
template: sensorgreen2black
variables:
- entity: binary_sensor.smoke_sensor_158d0002b223fd
- name: Fire Alarm
- icon: mdi:shield-check
- type: custom:decluttering-card
template: sensorgreen2black
variables:
- entity: binary_sensor.motion_sensor_158d0001e50fc6
- name: Bedroom
- icon: mdi:motion-sensor
- type: horizontal-stack
cards:
- type: custom:decluttering-card
template: sensorgreen2black
variables:
- entity: binary_sensor.motion_sensor_158d00030518db
- name: Master Bedroom
- icon: mdi:motion-sensor
- type: custom:decluttering-card
template: sensorgreen2black
variables:
- entity: binary_sensor.motion_sensor_158d0003051953
- name: Tablet
- icon: mdi:motion-sensor
- type: custom:decluttering-card
template: sensorgreen2black
variables:
- entity: binary_sensor.motion_sensor_158d000113e40d
- name: Shower
- icon: mdi:motion-sensor
- type: horizontal-stack
cards:
- type: custom:decluttering-card
template: sensorgreen2black
variables:
- entity: binary_sensor.motion_sensor_158d000319bf5a
- name: Bathroom
- icon: mdi:motion-sensor
- type: custom:decluttering-card
template: fridge2black
variables:
- entity: sensor.temperature_158d0003225f19
- name: Freezer Storage
- icon: mdi:fridge
- type: custom:decluttering-card
template: fridge2black
variables:
- entity: sensor.temperature_158d00032251d9
- name: Kitchen Fridge
- icon: mdi:fridge
- type: horizontal-stack
cards:
- type: custom:button-card
entity: sensor.mi_kettle_current_temperature
tap_action:
action: more-info
icon: 'mdi:kettle'
aspect_ratio: 1/1
name: Kettle
styles:
card:
# - background-color: 'rgba(255,255,240,0.9)'
- background-color: 'rgb(100,100,100)'
- border-radius: 15px
- padding: 10%
- color: AliceBlue
- font-size: 10px
# - text-shadow: 0px 0px 5px black
- text-transform: capitalize
grid:
- grid-template-areas: '"i temp" "n n" "cpu cpu" "ram ram" "sd sd"'
- grid-template-columns: 1fr 1fr
- grid-template-rows: 1fr min-content min-content min-content min-content
name:
- font-weight: bold
- font-size: 13px
- color: AliceBlue
- align-self: middle
- justify-self: start
- padding-bottom: 4px
img_cell:
- justify-content: start
- align-items: start
- margin: none
icon:
- color: >
[[[
if (entity.state < 40) return '#1ac5ff';
if (entity.state >= 40 && entity.state < 80) return '#ffa500';
if (entity.state >= 81 && entity.state < 101) return 'red';
else return '#ffcc00';
]]]
- width: 70%
- margin-top: -10%
custom_fields:
cpu:
- padding-bottom: 2px
- align-self: middle
- justify-self: start
- --text-color-sensor: '[[[ if (states["sensor.processor_use"].state > 200) return "red"; ]]]'
ram:
- padding-bottom: 2px
- align-self: middle
- justify-self: start
- --text-color-sensor: '[[[ if (states["sensor.memory_use_percent"].state > 200) return "red"; ]]]'
sd:
- align-self: middle
- justify-self: start
- --text-color-sensor: '[[[ if (states["sensor.disk_use_percent_home"].state > 200) return "red"; ]]]'
# power:
# - align-self: middle
# - justify-self: start
# - --text-color-sensor: '[[[ if (states["switch.hassio"].state == "on") return "black"; ]]]'
custom_fields:
cpu: >
[[[
return `<ha-icon
icon="mdi:temperature-celsius"
style="width: 12px; height: 12px; color: AliceBlue;">
</ha-icon><span>Temperature: <span style="color: var(--text-color-sensor);">${states['sensor.mi_kettle_current_temperature'].state}</span></span>`
]]]
ram: >
[[[
return `<ha-icon
icon="mdi:temperature-celsius"
style="width: 12px; height: 12px; color: AliceBlue;">
</ha-icon><span>Target Temp: <span style="color: var(--text-color-sensor);">${states['sensor.mi_kettle_set_temperature'].state}</span></span>`
]]]
sd: >
[[[
return `<ha-icon
icon="mdi:kettle-outline"
style="width: 12px; height: 12px; color: AliceBlue;">
</ha-icon><span>Status: <span style="color: var(--text-color-sensor);">${states['sensor.mi_kettle_action'].state}</span></span>`
]]]
# power: >
# [[[
# return `<ha-icon
# icon="mdi:harddisk"
# style="width: 12px; height: 12px; color: black;">
# </ha-icon><span>SD: <span style="color: var(--text-color-sensor);">${states['switch.hassio'].state}</span></span>`
# ]]]
- type: "custom:button-card"
color_type: blank-card
- type: "custom:button-card"
color_type: blank-card
Can someone help me with the code, tried without success fold entities rows card.
Thank for the help!