Pas mieux que @WarC0zes
Tu as une autre discussion en cours qui explore les mêmes notions: Mise en page des chips sur une ligne
Tu n’as probablement pas regardé le code des variantes horizontales dans le premier post car avant de faire du card mod sur un empilement vertical, on peut déja faire un empilement horizontal…
Enfin il existe une variante si tu n’as pas besoin de l’interface graphique, en ajoutant juste horizontal: true dans la vertical-stack-in-card :
type: custom:vertical-stack-in-card
horizontal: true
cards:
- type: custom:mushroom-template-card
entity: null
icon: mdi:sofa
icon_color: grey
primary: Salon
secondary: >
🌡️ {{ states("sensor.0x00158d0008ce3cbb_temperature") }} |💧{{
states("sensor.0x00158d0008ce3cbb_humidity") }} |💡{% set ListOfLightsOn =
['light.hue_color_lamp_1',
'light.hue_color_lamp_2', 'light.hue_play_tv', 'light.hue_go_1']
%}
{% set count = namespace(c=0) %}
{% set LightsOn = ListOfLightsOn | list | count %}
{% for i in range (0,LightsOn) %}
{% set LighStatus = states(ListOfLightsOn[i]) %}
{% if LighStatus == 'on' %}
{% set count.c = count.c + 1 %}
{% endif %}
{% endfor %}
{{count.c}}
layout: horizontal
badge_color: green
badge_icon: |-
{% if is_state('input_boolean.virtual_button_lg_tv', 'on') %}
mdi:television-box
{% endif %}
tap_action:
action: navigate
navigation_path: house
hold_action:
action: none
double_tap_action:
action: none
- type: custom:mushroom-chips-card
chips:
- type: template
entity: binary_sensor.hue_secure_contact_sensor_4_opening
hold_action:
action: none
tap_action:
action: more-info
icon: |-
{% if is_state(entity, 'on') %}
mdi:window-open-variant
{% else %}
mdi:window-closed-variant
{% endif %}
icon_color: |-
{% if is_state(entity, 'on') %}
red
{% else %}
grey
{% endif %}
- type: template
entity: binary_sensor.hue_secure_contact_sensor_1_opening
icon: |-
{% if is_state(entity, 'on') %}
mdi:door-open
{% else %}
mdi:door
{% endif %}
icon_color: |-
{% if is_state(entity, 'on') %}
red
{% else %}
grey
{% endif %}
tap_action:
action: more-info
hold_action:
action: none
double_action:
action: none
- type: template
entity: cover.rollershuttersalon_level
hold_action:
action: toggle
tap_action:
action: more-info
icon: |-
{{ is_state('cover.rollershuttersalon_level', 'closed') |
iif('mdi:window-shutter', 'mdi:window-shutter-open') }}
icon_color: >-
{% set position =
state_attr('cover.rollershuttersalon_level','current_position') %}
{% set hour = now().hour %}
{% set dusk_hour = as_timestamp(states.sun.sun.attributes.next_dusk) |
timestamp_custom('%H', true) | int +1 %}
{% if position > 25 and hour >= dusk_hour %}
red
{% endif %}
{% if position > 25 and hour < dusk_hour %}
blue
{% endif %} {% if position <= 25 %}
grey
{% endif %}
- type: template
entity: light.hue_color_lamp_1
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
title: Lumières salon
content:
type: vertical-stack
cards:
- type: custom:hue-like-light-card
title: >-
Salon - {{ light.hue_color_lamp_1 }}
({{light.hue_color_lamp_1.brightness}})
icon: mdi:sofa-outline
offColor: theme-color
entities:
- light.hue_color_lamp_1
- light.hue_color_lamp_2
- light.hue_play_tv
- light.hue_go_1
icon: >-
{% set ListOfLightsOn = ['light.hue_color_lamp_1',
'light.hue_color_lamp_2', 'light.hue_play_tv', 'light.hue_go_1'] %}
{% set count = namespace(c=0) %}
{% set LightsOn = ListOfLightsOn | list | count %}
{% for i in range (0,LightsOn) %}
{% set LighStatus = states(ListOfLightsOn[i]) %}
{% if LighStatus == 'on' %}
{% set count.c = count.c + 1 %}
{% endif %}
{% endfor %}
{% if count.c > 0%}
mdi:lightbulb-on
{% else %}
mdi:lightbulb
{% endif %}
hold_action:
action: none
double_tap_action:
action: none
icon_color: |-
{% if is_state(entity, 'on') %}
orange
{% elif is_state(entity, 'off') %}
grey
{% else %}
grey
{% endif %}
alignment: end
card_mod:
style:
style: |
ha-card {
padding-top: 8px;
padding-right: 8px;
}