Roh la grosse fatique de mon côté 
C’est vrai que ça limite pas mal, sinon faut connaitre un bon maçon pour obturer 1 fenêtre ou 2 
1 « J'aime »
oui un maçon ! Ou alors : changer de maison, une plus petite et n’avoir pas plus de 9 fenêtres. A l’heure des économies d’énergie c’est une autre bonne option si on connait un banquier
1 « J'aime »
Bonsoir @Herbs et @Pulpy-Luke
Alors non pas de maçon c’est pas au programme enfin si je veux garder ma femme encore quelques années 
Sinon, à la lecture de la doc aussi, et des divers sujets en cette fin journée il n’est pas possible effectivement de mettre un nombre mais c’est un icone
Je vais regardé et tester ton code que tu proposes sur ma carte test
Après j’ai pas un château mais pour certain usage je pourrais dépasser les 10 
1 « J'aime »
Bonsoir,
Aller je viens de faire mes devoir de début de soirée
Le code passe nickel je n’avais pas de doute sauf sur l’ICC que je suis en fait
Néanmoins sur PC j’ai un léger décalage à droite du nombre
et sur téléphone c’est un léger décalage à gauche
En plus on peut aussi le mettre en bas, à droite à gauche, en haut
Merci en tout cas de l’aide
1 « J'aime »
En s’amusant un peu il y a de quoi vachement simplifier les dashboards:
type: custom:stack-in-card
mode: vertical
cards:
- type: custom:stack-in-card
mode: horizontal
cards:
- type: custom:mushroom-template-card
primary: Volets de la maison
multiline_secondary: true
secondary: >-
{% set all = expand('cover.volets_maison'|lower) -%} {% set positions
= all | map(attribute='attributes.current_position')|list-%} {% set
moving = all | selectattr('state', 'in', ['open','closed'])|list|count
-%} {% set open = positions | reject("!=",100) |list |count -%} {%
set closed = positions | reject("!=",0) |list |count -%} {% set
other = positions|list|count - open - closed -%} Fermés = {{ closed
}} / Partiels = {{ other }} / Ouverts = {{ open }}
icon: |
{% if is_state('cover.volets_maison', 'open') %}
mdi:window-shutter-open
{% else %}
mdi:window-shutter
{% endif %}
entity: cover.volets_maison
badge_icon: none
badge_color: transparent
icon_color: |
{% if is_state('cover.volets_maison','open') %}
green
{% else %}
blue
{% endif %}
card_mod:
style: |
mushroom-badge-icon:after {
content: "{{ expand(states.cover.volets_maison) | selectattr( 'state', 'eq', 'open') | list | count }}";
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-green));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: 0;
width: 100%;
height: 100%;
font-size: 0.8em;
}
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
entity: cover.volets_maison
icon: mdi:arrow-up
primary_info: none
vertical: true
secondary_info: none
icon_color: disabled
card_mod:
style: |
ha-card {
--chip-background: rgba(var(--rgb-grey), 0.05);
}
tap_action:
action: call-service
haptic: success
service: cover.set_cover_position
service_data:
entity_id: cover.volets_maison
position: 100
- type: custom:mushroom-entity-card
entity: cover.volets_maison
icon: mdi:pause
primary_info: none
vertical: true
secondary_info: none
icon_color: disabled
card_mod:
style: |
.shape {
background-color: rgba(var(--rgb-grey), 0.01);
}
tap_action:
action: call-service
haptic: success
service: cover.stop_cover
service_data:
entity_id: cover.volets_maison
- type: custom:mushroom-entity-card
entity: cover.volets_maison
icon: mdi:arrow-down
primary_info: none
vertical: true
secondary_info: none
icon_color: disabled
card_mod:
style: |
ha-card {
--chip-background: rgba(var(--rgb-grey), 0.025);
}
tap_action:
action: call-service
haptic: success
service: cover.set_cover_position
service_data:
entity_id: cover.volets_maison
position: 0```
- type: custom:mushroom-template-card
primary: Ouvrants
secondary: |
{% set all = expand('group.all_doors_sensor_entities')| list -%}
{% set closed1 = all | selectattr('state','eq','off')|list|count%}
{% set open1 = all | selectattr('state','eq','on')|list|count%}
Fermés : {{closed1}} / ouverts : {{open1}}
icon: |
{% if is_state('group.all_doors_sensor_entities', 'on') %}
mdi:door-open
{% else %}
mdi:door-closed
{% endif %}
icon_color: |
{% if is_state('group.all_doors_sensor_entities','on') %}
red
{% else %}
green
{% endif %}
entity: group.all_doors_sensor_entities
badge_icon: none
badge_color: transparent
card_mod:
style: |
mushroom-badge-icon:after {
content: "{{ expand(states.group.all_doors_sensor_entities) | selectattr( 'state', 'eq', 'off') | list | count }}";
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-green));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: 0;
width: 100%;
height: 100%;
font-size: 0.8em;
}
- type: custom:stack-in-card
mode: horizontal
cards:
- type: custom:mushroom-template-card
primary: Lumières Maison
secondary: |
{% set all = expand('group.all_lights')| list -%}
{% set closed1 = all | selectattr('state','eq','off')|list|count%}
{% set open1 = all | selectattr('state','eq','on')|list|count%}
Eteintes : {{closed1}} / allumées : {{open1}}
icon: mdi:lightbulb
icon_color: amber
entity: group.all_lights
badge_icon: none
badge_color: transparent
card_mod:
style: |
mushroom-badge-icon:after {
content: "{{ expand(states.group.all_lights) | selectattr( 'state', 'eq', 'on') | list | count }}";
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-orange));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: 0;
width: 100%;
height: 100%;
font-size: 0.8em;
}
- type: horizontal-stack
cards:
- type: custom:mushroom-light-card
entity: group.all_lights
name: Lumières Maison
use_light_color: true
show_brightness_control: true
show_color_temp_control: true
show_color_control: true
collapsible_controls: true
icon: hue:bulb-group
hold_action:
action: toggle
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
title: All Living Room Lights
content:
type: custom:auto-entities
card:
type: entities
filter:
include:
- group: group.all_lights
options:
type: custom:mushroom-light-card
show_brightness_control: true
use_light_color: true
show_color_control: true
show_color_temp_control: true
collapsible_controls: true
tap_action:
action: toggle
card_mod:
style: |
ha-card {
{% set r = state_attr(config.entity, 'rgb_color')[0] %}
{% set g = state_attr(config.entity, 'rgb_color')[1] %}
{% set b = state_attr(config.entity, 'rgb_color')[2] %}
{% if is_state(config.entity, 'on') %}
background: rgba({{r}}, {{g}}, {{b}},0.1);
--primary-text-color: rgb({{r}}, {{g}}, {{b}});
--secondary-text-color: rgba({{r}}, {{g}}, {{b}},0.5);
{% endif %}
}
ha-card {
padding: 8px 24px !important;
}
ha-card {
--badge-size: 0px;
}
ha-card {
background: none;
--ha-card-box-shadow: 0px;
}
exclude: []
sort:
method: friendly_name
card_mod:
style: |
ha-card {
{% set r = state_attr(config.entity, 'rgb_color')[0] %}
{% set g = state_attr(config.entity, 'rgb_color')[1] %}
{% set b = state_attr(config.entity, 'rgb_color')[2] %}
{% if is_state(config.entity, 'on') %}
background: rgba({{r}}, {{g}}, {{b}},0.1);
--primary-text-color: rgb({{r}}, {{g}}, {{b}});
--secondary-text-color: rgba({{r}}, {{g}}, {{b}},0.5);
{% endif %}
}
ha-card {
padding: px 24px !important;
}
ha-card {
--badge-size: 0px;
}
ha-card {
background: none;
--ha-card-box-shadow: 0px;
}
3 « J'aime »
En allant encore un peu plus loin et avec les actions de clic et les sous dashboard :
type: custom:stack-in-card
cards:
- type: custom:layout-card
layout_type: masonry
layout: {}
cards:
- type: custom:mushroom-chips-card
chips:
- type: menu
- type: alarm-control-panel
entity: alarm_control_panel.maison
content_info: none
name: Alarme
- type: template
entity: lock.nuki_porte_entree_lock
icon: >-
{{ 'mdi:lock' if is_state('lock.nuki_porte_entree_lock', 'locked')
else 'mdi:lock-open' }}
icon_color: >-
{{ 'green' if is_state('lock.nuki_porte_entree_lock', 'locked')
else 'red' }}
content: null
tap_action:
action: more-info
- type: template
entity: switch.siren
icon: mdi:alarm-bell
icon_color: '{{ ''green'' if is_state(''switch.siren'', ''off'') else ''red'' }}'
content: null
tap_action:
action: more-info
card_mod:
style: |
:host {
--ha-card-background: var(--card-background-color);
}
- type: custom:mushroom-title-card
title: |-
{% set time = now().hour %}
{% if (time >= 20) %}
Bonne nuit, {{user}}!
{% elif (time >= 14) %}
Bon après-midi, {{user}}!
{% elif (time >= 5) %}
Bonjour, {{user}}!
{% else %}
Salut, {{user}}
{% endif %}
subtitle: ''
- type: markdown
card_mod:
style: |
ha-card {
background: none;
box-shadow: none;
font-family: Quicksand;
margin-bottom: -0.9em;
}
content: >
<center> Aujourd'hui nous sommes le {{ states('sensor.current_date')
}}, nous fêtons les {{ states('sensor.fete_du_jour') }} <center>
<center>
- type: vertical-stack
cards:
- type: vertical-stack
cards:
- elements:
- entity: sensor.time
style:
font-family: Dancing Script
color: '#EAC117'
filter: opacity(60%)
font-size: 1000%
left: 50%
top: 56%
pointer-events: none
z-index: 0
type: state-label
- entity: sensor.week_day
style:
filter: opacity(60%)
font-family: Dancing Script
font-size: 500%
left: 43%
pointer-events: none
text-shadow: 0px 0px 80px black
top: 20%
z-index: 1
type: state-label
- entity: sensor.current_date
style:
filter: opacity(100%)
font-family: Dancing Script
font-size: 280%
left: 50%
top: 33%
pointer-events: none
z-index: 2
type: state-label
image: /local/continent.png
type: picture-elements
- square: true
columns: 2
type: grid
cards:
- type: custom:button-card
entity: person.chris
aspect_ratio: 1/1
name: Chris
show_entity_picture: true
show_name: true
double_tap_action:
action: call-service
confirmation:
text: Alarm will sound, OK?
service: script.find_my_phone
state:
- value: not_home
styles:
card:
- background-color: '#404040'
custom_fields:
icon:
- border-color: '#B0B0B0'
- opacity: 30%
styles:
card:
- border-radius: 5%
- padding: 5%
- color: lightgray
- font-size: 11px
grid:
- grid-template-areas: '"icon status" "n network" "battery proximity"'
- grid-template-columns: 1fr 1fr
- grid-template-rows: 1fr min-content min-content min-content min-content
name:
- font-size: 16px
- justify-self: left
- padding-bottom: 5px
- justify-self: left
custom_fields:
icon:
- width: 120%
- pointer-events: none
- display: grid
- border: 3px inset
- border-color: |
[[[
var stav=states['person.chris'].state;
if (stav=='home') {
return `#77c66e`;
}
if ((stav=='home')|(stav=='maison_papy')) {
return `darkorange`;
}
if ((stav=='zzz')|(stav=='maison_papy')) {
return `deepskyblue`;
}
]]]
- border-radius: 100px
- margin: 0 0 0 0
- justify-self: left
- opacity: 1
status:
- align-self: start
- justify-self: end
- text-transform: capitalize
- color: lightgray
battery:
- justify-self: left
- font-size: 11px
- color: lightgray
- '--icon-color': |
[[[ var l = states['sensor.honor_battery_level'].state;
if (l < 10) return "#e45649";
if (l < 20) return "#ff9050";
if (l < 30) return "#ffb040";
else return "#77c66e"
]]]
network:
- justify-self: end
- font-size: 11px
- color: lightgray
- '--icon-color': |
[[[ var n = states['sensor.honor_network_type'].state;
if ((n=='cellular')|(n=='wifi')) return "#77c66e";
else return "grey"
]]]
proximity:
- justify-self: end
- font-size: 11px
- color: lightgray
- '--icon-color': |
[[[ var p = states['proximity.home'].state;
if (p > 1) return "#ffb040";
if (p > 20) return "#ff9050";
if (p > 100) return "#e45649";
else return "#77c66e"
]]]
custom_fields:
icon: >
[[[ return entity === undefined ? null : `<img
src="${states['person.chris'].attributes.entity_picture}"
width="100%">`; ]]]
status: |
[[[ var stav = states['person.chris'].state;
var doma = `<ha-icon icon="mdi:home" style="color: #77c66e;`
var produkce = `<ha-icon icon="mdi:city-variant-outline" style="color: deepskyblue;`
var volno = `<ha-icon icon="mdi:gymnastics" style="color: deepskyblue;`
var nasi = `<ha-icon icon="mdi:home-outline" style="color: darkorange;`
var pryc = `<ha-icon icon="mdi:home-export-outline" style="color: lightgray;width: 20px; height: 20px;"></ha-icon><span> Pryč</span>`
var solid = ` width: 20px; height: 20px;"></ha-icon><span> ${entity.state}</span>`
if (stav=='home') {
return doma+solid
}
if ((stav=='home')|(stav=='maison_papy')) {
return produkce+solid
}
if ((stav=='ddd')|(stav=='sss')) {
return volno+solid
}
if ((stav=='fff')|(stav=='eee')) {
return nasi+solid
} else {
return pryc
}
]]]
battery: |
[[[
var i = states['sensor.honor_battery_level'].attributes.icon;
var b = states['sensor.honor_battery_level'].state;
return `<ha-icon icon='${i}' style='width:20px; height: 20px; vertical-align:2px; color: var(--icon-color);'></ha-icon>${b}%`
]]]
network: |
[[[
var i = states['sensor.honor_network_type'].attributes.icon;
var s = parseFloat(states['sensor.honor_mobile_tx_gb'].state).toFixed(1);
var r = parseFloat(states['sensor.honor_mobile_rx_gb'].state).toFixed(1);
return `<ha-icon icon='${i}' style='width:20px; height: 20px; vertical-align:2px; color: var(--icon-color);'></ha-icon> ${r} / ${s} GB`
]]]
proximity: |
[[[
return `<ha-icon
icon="mdi:map-marker-distance"
style="width: 20px; height: 20px; color: var(--icon-color)">
</ha-icon> <span>\<span>${states['proximity.home'].state} Km</span></span>`
]]]
- type: custom:button-card
entity: person.sara
aspect_ratio: 1/1
name: Sara
show_entity_picture: true
show_name: true
double_tap_action:
action: call-service
confirmation:
text: Alarm will sound, OK?
service: script.find_my_phone2
state:
- value: not_home
styles:
card:
- background-color: '#404040'
custom_fields:
icon:
- border-color: '#B0B0B0'
- opacity: 30%
styles:
card:
- border-radius: 5%
- padding: 5%
- color: lightgray
- font-size: 11px
grid:
- grid-template-areas: '"icon status" "n network" "battery proximity"'
- grid-template-columns: 1fr 1fr
- grid-template-rows: 1fr min-content min-content min-content min-content
name:
- font-size: 16px
- justify-self: left
- padding-bottom: 5px
- justify-self: left
custom_fields:
icon:
- width: 120%
- pointer-events: none
- display: grid
- border: 3px inset
- border-color: |
[[[
var stav=states['person.sara'].state;
if (stav=='home') {
return `#77c66e`;
}
if ((stav=='home')|(stav=='maison_papy')) {
return `darkorange`;
}
if ((stav=='zzz')|(stav=='maison_papy')) {
return `deepskyblue`;
}
]]]
- border-radius: 100px
- margin: 0 0 0 0
- justify-self: left
- opacity: 1
status:
- align-self: start
- justify-self: end
- text-transform: capitalize
- color: lightgray
battery:
- justify-self: left
- font-size: 11px
- color: lightgray
- '--icon-color': |
[[[ var l = states['sensor.oppo_battery_level'].state;
if (l < 10) return "#e45649";
if (l < 20) return "#ff9050";
if (l < 30) return "#ffb040";
else return "#77c66e"
]]]
network:
- justify-self: end
- font-size: 11px
- color: lightgray
- '--icon-color': |
[[[ var n = states['sensor.oppo_network_type'].state;
if ((n=='cellular')|(n=='wifi')) return "#77c66e";
else return "grey"
]]]
proximity:
- justify-self: end
- font-size: 11px
- color: lightgray
- '--icon-color': |
[[[ var p = states['proximity.home'].state;
if (p > 1) return "#ffb040";
if (p > 20) return "#ff9050";
if (p > 100) return "#e45649";
else return "#77c66e"
]]]
custom_fields:
icon: >
[[[ return entity === undefined ? null : `<img
src="${states['person.sara'].attributes.entity_picture}"
width="100%">`; ]]]
status: |
[[[ var stav = states['person.sara'].state;
var doma = `<ha-icon icon="mdi:home" style="color: #77c66e;`
var produkce = `<ha-icon icon="mdi:city-variant-outline" style="color: deepskyblue;`
var volno = `<ha-icon icon="mdi:gymnastics" style="color: deepskyblue;`
var nasi = `<ha-icon icon="mdi:home-outline" style="color: darkorange;`
var pryc = `<ha-icon icon="mdi:home-export-outline" style="color: lightgray;width: 20px; height: 20px;"></ha-icon><span> Pryč</span>`
var solid = ` width: 20px; height: 20px;"></ha-icon><span> ${entity.state}</span>`
if (stav=='home') {
return doma+solid
}
if ((stav=='home')|(stav=='maison_papy')) {
return produkce+solid
}
if ((stav=='ddd')|(stav=='sss')) {
return volno+solid
}
if ((stav=='fff')|(stav=='eee')) {
return nasi+solid
} else {
return pryc
}
]]]
battery: |
[[[
var i = states['sensor.oppo_battery_level'].attributes.icon;
var b = states['sensor.oppo_battery_level'].state;
return `<ha-icon icon='${i}' style='width:20px; height: 20px; vertical-align:2px; color: var(--icon-color);'></ha-icon>${b}%`
]]]
network: |
[[[
var i = states['sensor.oppo_network_type'].attributes.icon;
var s = parseFloat(states['sensor.oppo_mobile_tx_gb'].state).toFixed(1);
var r = parseFloat(states['sensor.oppo_mobile_tx_gb'].state).toFixed(1);
return `<ha-icon icon='${i}' style='width:20px; height: 20px; vertical-align:2px; color: var(--icon-color);'></ha-icon> ${r} / ${s} GB`
]]]
proximity: |
[[[
return `<ha-icon
icon="mdi:map-marker-distance"
style="width: 20px; height: 20px; color: var(--icon-color)">
</ha-icon> <span>\<span>${states['proximity.home'].state} Km</span></span>`
]]]
- type: entities
show_header_toggle: false
entities:
- entity: input_boolean.alarmclock_wd_enabled
type: custom:multiple-entity-row
toggle: true
entities:
- entity: input_number.alarmclock_wd_hour
- entity: input_number.alarmclock_wd_minute
- square: false
columns: 2
type: grid
cards:
- type: custom:button-card
entity: sensor.poubelle_marron
aspect_ratio: 2/1
show_name: false
styles:
grid:
- grid-template-areas: '"i" "days"'
- grid-template-columns: 1fr
- grid-template-rows: 1fr 0.2fr
icon:
- color: '#6b4c22'
- width: 70%
custom_fields:
days:
- padding: 2px
custom_fields:
days: |
[[[
if (entity.state == 0) return "Collected today";
else if (entity.state == 1) return "Collected tomorrow";
else
return " " + entity.attributes['days'] + " jours";
]]]
- type: custom:button-card
entity: sensor.poubelle_jaune
aspect_ratio: 2/1
show_name: false
styles:
grid:
- grid-template-areas: '"i" "days"'
- grid-template-columns: 1fr
- grid-template-rows: 1fr 0.2fr
icon:
- color: '#dced1c'
- width: 70%
custom_fields:
days:
- padding: 2px
custom_fields:
days: |
[[[
if (entity.state == 0) return "Collected today";
else if (entity.state == 1) return "Collected tomorrow";
else
return " " + entity.attributes['days'] + " jours";
]]]
- type: vertical-stack
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Volets de la maison
multiline_secondary: true
secondary: >-
{% set all = expand('cover.volets_maison'|lower) -%} {% set
positions = all |
map(attribute='attributes.current_position')|list-%} {% set moving
= all | selectattr('state', 'in', ['open','closed'])|list|count
-%} {% set open = positions | reject("!=",100) |list |count -%}
{% set closed = positions | reject("!=",0) |list |count -%} {%
set other = positions|list|count - open - closed -%} Fermés = {{
closed }} / Partiels = {{ other }} / Ouverts = {{ open }}
icon: |
{% if is_state('cover.volets_maison', 'open') %}
mdi:window-shutter-open
{% else %}
mdi:window-shutter
{% endif %}
entity: cover.volets_maison
badge_icon: none
badge_color: transparent
icon_color: |
{% if is_state('cover.volets_maison','open') %}
green
{% else %}
blue
{% endif %}
tap_action:
action: navigate
navigation_path: /lovelace-light/volets
card_mod:
style: |
mushroom-badge-icon:after {
content: "{{ expand(states.cover.volets_maison) | selectattr( 'state', 'eq', 'open') | list | count }}";
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-green));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: 0;
width: 100%;
height: 100%;
font-size: 0.8em;
}
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
entity: cover.volets_maison
icon: mdi:arrow-up
primary_info: none
secondary_info: none
icon_color: disabled
card_mod:
style: |
ha-card {
--chip-background: rgba(var(--rgb-grey), 0.05);
}
tap_action:
action: call-service
service: cover.set_cover_position
service_data:
entity_id: cover.volets_maison
position: 100
- type: custom:mushroom-entity-card
entity: cover.volets_maison
icon: mdi:pause
primary_info: none
secondary_info: none
icon_color: disabled
card_mod:
style: |
.shape {
background-color: rgba(var(--rgb-grey), 0.01);
}
tap_action:
action: call-service
service: cover.stop_cover
service_data:
entity_id: cover.volets_maison
- type: custom:mushroom-entity-card
entity: cover.volets_maison
icon: mdi:arrow-down
primary_info: none
secondary_info: none
icon_color: disabled
card_mod:
style: |
ha-card {
--chip-background: rgba(var(--rgb-grey), 0.025);
}
tap_action:
action: call-service
service: cover.set_cover_position
service_data:
entity_id: cover.volets_maison
position: 0
- type: custom:mushroom-template-card
primary: Ouvrants
secondary: |
{% set all = expand('group.all_doors_sensor_entities')| list -%}
{% set closed1 = all | selectattr('state','eq','off')|list|count%}
{% set open1 = all | selectattr('state','eq','on')|list|count%}
Fermés : {{closed1}} / ouverts : {{open1}}
icon: |
{% if is_state('group.all_doors_sensor_entities', 'on') %}
mdi:door-open
{% else %}
mdi:door-closed
{% endif %}
icon_color: |
{% if is_state('group.all_doors_sensor_entities','on') %}
red
{% else %}
green
{% endif %}
entity: group.all_doors_sensor_entities
badge_icon: none
badge_color: transparent
tap_action:
action: navigate
navigation_path: /lovelace-light/securite
card_mod:
style: |
mushroom-badge-icon:after {
content: "{{ expand(states.group.all_doors_sensor_entities) | selectattr( 'state', 'eq', 'off') | list | count }}";
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-green));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: 0;
width: 100%;
height: 100%;
font-size: 0.8em;
}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Lumières Maison
secondary: |
{% set all = expand('group.all_lights')| list -%}
{% set closed1 = all | selectattr('state','eq','off')|list|count%}
{% set open1 = all | selectattr('state','eq','on')|list|count%}
Eteintes : {{closed1}} / allumées : {{open1}}
icon: mdi:lightbulb
icon_color: amber
entity: group.all_lights
badge_icon: none
badge_color: transparent
card_mod:
style: |
mushroom-badge-icon:after {
content: "{{ expand(states.group.all_lights) | selectattr( 'state', 'eq', 'on') | list | count }}";
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-orange));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: 0;
width: 100%;
height: 100%;
font-size: 0.8em;
}
- type: horizontal-stack
cards:
- type: custom:mushroom-light-card
entity: group.all_lights
name: Lumières Maison
use_light_color: true
show_brightness_control: true
show_color_temp_control: true
show_color_control: true
collapsible_controls: true
icon: hue:bulb-group
hold_action:
action: toggle
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
title: All Living Room Lights
content:
type: custom:auto-entities
card:
type: entities
filter:
include:
- group: group.all_lights
options:
type: custom:mushroom-light-card
show_brightness_control: true
use_light_color: true
show_color_control: true
show_color_temp_control: true
collapsible_controls: true
tap_action:
action: toggle
card_mod:
style: |
ha-card {
{% set r = state_attr(config.entity, 'rgb_color')[0] %}
{% set g = state_attr(config.entity, 'rgb_color')[1] %}
{% set b = state_attr(config.entity, 'rgb_color')[2] %}
{% if is_state(config.entity, 'on') %}
background: rgba({{r}}, {{g}}, {{b}},0.1);
--primary-text-color: rgb({{r}}, {{g}}, {{b}});
--secondary-text-color: rgba({{r}}, {{g}}, {{b}},0.5);
{% endif %}
}
ha-card {
padding: 8px 24px !important;
}
ha-card {
--badge-size: 0px;
}
ha-card {
background: none;
--ha-card-box-shadow: 0px;
}
exclude: []
sort:
method: friendly_name
card_mod:
style: |
ha-card {
{% set r = state_attr(config.entity, 'rgb_color')[0] %}
{% set g = state_attr(config.entity, 'rgb_color')[1] %}
{% set b = state_attr(config.entity, 'rgb_color')[2] %}
{% if is_state(config.entity, 'on') %}
background: rgba({{r}}, {{g}}, {{b}},0.1);
--primary-text-color: rgb({{r}}, {{g}}, {{b}});
--secondary-text-color: rgba({{r}}, {{g}}, {{b}},0.5);
{% endif %}
}
ha-card {
padding: px 24px !important;
}
ha-card {
--badge-size: 0px;
}
ha-card {
background: none;
--ha-card-box-shadow: 0px;
}
- type: horizontal-stack
cards:
- type: custom:button-card
entity: alarm_control_panel.maison
template: button_alarme
name: Alarme
- type: custom:button-card
template: button_porte
name: Porte
entity: binary_sensor.porte_entree
- type: custom:button-card
template: button_motion
name: Entrée
entity: binary_sensor.motion_sensor_158d00045a080e
- type: custom:button-card
template: button_motion
name: Salon
entity: binary_sensor.motion_sensor_158d000128cfbf
- type: custom:button-card
template: button_motion
name: Cuisine
entity: binary_sensor.motion_sensor_158d000466adff
- type: horizontal-stack
cards:
- template: button_raspberry
type: custom:decluttering-card
variables:
- entity: sensor.processor_use_percent
- icon: mdi:raspberry-pi
- name: VM Debian 11
- colorstyle: >-
[[[ if (entity.state == 'OL') return 'lime'; if (entity.state ==
'OB') return 'yellow'; if (entity.state == 'LB') return 'magenta';
if (entity.state == 'OB LB') return 'red'; if (entity.state == 'OL
LB') return 'cyan'; else return 'deepskyblue'; ]]]
- cpufield: >-
[[[ return `<ha-icon icon='mdi:server' style='width: 20px; height:
20px; color: deepskyblue;'></ha-icon> <span>CPU: <span
style='color:
var(--text-color-sensor);'>${states['sensor.processor_use_percent'].state}%</span></span>`
]]]
- ramfield: >-
[[[ return `<ha-icon icon='mdi:memory' style='width: 20px; height:
20px; color: deepskyblue;'></ha-icon> <span>RAM: <span
style='color:
var(--text-color-sensor);'>${states['sensor.memory_use_percent'].state}%</span></span>`
]]]
- sdfield: >-
[[[ return `<ha-icon icon='mdi:harddisk' style='width: 20px;
height: 20px; color: deepskyblue;'></ha-icon> <span>SSD: <span
style='color:
var(--text-color-sensor);'>${states['sensor.disk_use'].state}%</span></span>`
]]]
- cpustyle: >-
[[[ if (states['sensor.processor_use_percent'].state < 40) return
'lime'; if (states['sensor.processor_use_percent'].state >= 60 &&
states['sensor.processor_use_percent'].state < 80) return 'red';
else return 'orange'; ]]]
- ramstyle: >-
[[[ if (states['sensor.memory_use_percent'].state < 40) return
'lime'; if (states['sensor.memory_use_percent'].state >= 60 &&
states['sensor.memory_use_percent'].state < 80) return 'red'; else
return 'orange'; ]]]
- sdstyle: >-
[[[ if (states['sensor.disk_use_percent'].state < 40) return
'lime'; if (states['sensor.disk_use_percent'].state >= 60 &&
states['sensor.disk_use_percent'].state < 80) return 'red'; else
return 'orange'; ]]]
- type: custom:decluttering-card
template: button_hassos
- template: button_synology
type: custom:decluttering-card
variables:
- entity: sensor.ds_713_cpu_utilization_total
- icon: mdi:nas
- name: Synology
- colorstyle: >-
[[[ if (entity.state == 'OL') return 'lime'; if (entity.state ==
'OB') return 'yellow'; if (entity.state == 'LB') return 'magenta';
if (entity.state == 'OB LB') return 'red'; if (entity.state == 'OL
LB') return 'cyan'; else return 'deepskyblue'; ]]]
- tempfield: >-
[[[ return `<ha-icon icon='mdi:thermometer' style='width: 20px;
height: 20px; color: yellow;'></ha-icon> <span style='align:
left;'>${Math.round(states['sensor.ds_713_temperature'].state)}°C</span>`
]]]
- cpufield: >-
[[[ return `<ha-icon icon='mdi:server' style='width: 20px; height:
20px; color: deepskyblue;'></ha-icon> <span>CPU: <span
style='color:
var(--text-color-sensor);'>${states['sensor.ds_713_cpu_utilization_total'].state}%</span></span>`
]]]
- ramfield: >-
[[[ return `<ha-icon icon='mdi:memory' style='width: 20px; height:
20px; color: deepskyblue;'></ha-icon> <span>RAM: <span
style='color:
var(--text-color-sensor);'>${states['sensor.ds_713_memory_usage_real'].state}%</span></span>`
]]]
- sdfield: >-
[[[ return `<ha-icon icon='mdi:harddisk' style='width: 20px;
height: 20px; color: deepskyblue;'></ha-icon> <span>HDD: <span
style='color:
var(--text-color-sensor);'>${states['sensor.ds_713_volume_1_used_space'].state}%</span></span>`
]]]
- cpustyle: >-
[[[ if (states['sensor.ds_713_cpu_utilization_total'].state > 40)
return 'orange'; if
(states['sensor.ds_713_cpu_utilization_total'].state >= 60 &&
states['sensor.ds_713_cpu_utilization_total'].state < 80) return
'red'; else return 'lime'; ]]]
- ramstyle: >-
[[[ if (states['sensor.ds_713_memory_usage_real'].state > 40)
return 'orange'; if
(states['sensor.ds_713_memory_usage_real'].state >= 60 &&
states['sensor.ds_713_memory_usage_real'].state < 80) return
'red'; else return 'lime'; ]]]
- sdstyle: >-
[[[ if (states['sensor.ds_713_volume_1_used_space'].state > 50)
return 'orange'; if
(states['sensor.ds_713_volume_1_used_space'].state >= 60 &&
states['sensor.ds_713_volume_1_used_space'].state < 80) return
'red'; else return 'lime'; ]]]
card_mod:
style: |
ha-card {
padding: 2px;
background: rgba(var(--rgb-primary-text-color), 0.01);
}
Pour les lumières toujours le browser mod qui permet de controler les lumières individuellement.
Pour les ouvrants une sous vue :
type: custom:stack-in-card
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: back
- type: horizontal-stack
cards:
- type: custom:button-card
entity: binary_sensor.fenetre_salon
template:
- icon_info_bg
- ouverture_fenetre
name: Fenêtre Salon
- type: custom:button-card
entity: binary_sensor.porte_fenetre_salon
template:
- icon_info_bg
- ouverture
name: PF Salon
- type: horizontal-stack
cards:
- type: custom:button-card
entity: binary_sensor.porte_entree
template:
- icon_info_bg
- ouverture
name: Porte Entrée
- type: custom:button-card
entity: binary_sensor.door_window_sensor_158d0001b7ba8b
template:
- icon_info_bg
- ouverture
name: Porte Atelier
- type: horizontal-stack
cards:
- type: custom:button-card
entity: binary_sensor.fenetre_buanderie
template:
- icon_info_bg
- ouverture_fenetre
name: Fenêtre Buanderie
- type: custom:button-card
entity: binary_sensor.fenetre_bureau
template:
- icon_info_bg
- ouverture_fenetre
name: Fenêtre Bureau
- type: horizontal-stack
cards:
- type: custom:button-card
entity: binary_sensor.fenetre_cuisine
template:
- icon_info_bg
- ouverture_fenetre
name: Fenêtre Cuisine
- type: custom:button-card
entity: binary_sensor.porte_fenetre_cuisine
template:
- icon_info_bg
- ouverture
name: PF Cuisine
- type: horizontal-stack
cards:
- type: custom:button-card
entity: binary_sensor.fenetre_atelier
template:
- icon_info_bg
- ouverture_fenetre
name: Fenêtre Atelier
- type: custom:button-card
entity: binary_sensor.porte_fenetre_atelier
template:
- icon_info_bg
- ouverture
name: PF Atelier
- type: horizontal-stack
cards:
- type: custom:button-card
entity: binary_sensor.door_window_sensor_158d0004a00164
template:
- icon_info_bg
- ouverture_fenetre
name: Fenêtre Nael
- type: custom:button-card
entity: binary_sensor.porte_fenetre_sport
template:
- icon_info_bg
- ouverture
name: PF Sport
- type: horizontal-stack
cards:
- type: custom:button-card
entity: binary_sensor.door_window_sensor_158d00049ffd84
template:
- icon_info_bg
- ouverture_fenetre
name: Fenêtre Palier
- type: custom:button-card
entity: binary_sensor.door_window_sensor_158d00042318dc
template:
- icon_info_bg
- ouverture_fenetre
name: Fenêtre Invités
- type: horizontal-stack
cards:
- type: custom:button-card
entity: binary_sensor.door_window_sensor_158d0001b95837
template:
- icon_info_bg
- ouverture_fenetre
name: Fenêtre Parents
- type: custom:button-card
entity: binary_sensor.door_window_sensor_158d0001e42cb8
template:
- icon_info_bg
- ouverture_fenetre
name: Fenêtre SDB Parents
Idem pour les volets
type: custom:stack-in-card
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: back
- type: horizontal-stack
cards:
- type: custom:mushroom-cover-card
entity: cover.volet_bureau
- type: custom:mushroom-cover-card
entity: cover.volet_buanderie
- type: horizontal-stack
cards:
- type: custom:mushroom-cover-card
entity: cover.volet_cuisine
- type: custom:mushroom-cover-card
entity: cover.volet_pf_cuisine
- type: horizontal-stack
cards:
- type: custom:mushroom-cover-card
entity: cover.volet_salon
- type: custom:mushroom-cover-card
entity: cover.volet_baie
- type: horizontal-stack
cards:
- type: custom:mushroom-cover-card
entity: cover.volet_pf_salon
- type: custom:mushroom-cover-card
entity: cover.volet_atelier
- type: horizontal-stack
cards:
- type: custom:mushroom-cover-card
entity: cover.volet_pf_atelier
- type: custom:mushroom-cover-card
entity: cover.volet_sport
2 « J'aime »
Super 
Je suis dans la démarche de simplicité aussi avec Mushroom et je retrouve quelques visuels présents chez moi
Ensuite j’ai vue rapidement (je suis chez le kiné) une pastille supérieure à 10 même 15 sur ton screen. Ça m’intéresse grandement car je m’arrête à 10 avec les icônes mdi
Je vais regarder tes codes postés plus tard
Merci pour le partage
Avec le decluttering template c’est encore plus simple a l’écriture aussi
Vite fait car j’ai pas regardé très loin, mais ça passe par card_mod
badge_icon: none
badge_color: transparent
card_mod:
style: |
mushroom-badge-icon:after {
content: "{{ expand(states.group.all_doors_sensor_entities) | selectattr( 'state', 'eq', 'off') | list | count }}";
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-green));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: 0;
width: 100%;
height: 100%;
font-size: 0.8em;
}
2 « J'aime »
Mercy @Pulpy-Luke de ce guidage cela m’a fait la surprise à mon retour Kiné
test vite fait avec un groupe > à 10 entités
ne pas tenir compte de la ligne secondaire
Je vais piquer l’idée aussi
Qui est très bonne je trouve
Il faut que j’ajuste un peut la position du nombre à l’intérieur, j’ai déjà agrandi à 110% la pastille.
Changer la couleur car c’est un titre là etc… bref tout ce que j’adore pas du tout le design pour faire joli…
Cela m’amène encore sur d’autres choses à apprendre encore mais bon c’est pas fini ça
Si on apprend plus c’est que l’on ne vit plus vous avez 4 heures 
type: custom:mushroom-cover-card
entity: cover.volet_bureau
show_buttons_control: true
show_position_control: true
bonjour je souhaite que lorsque le volet est ouvert de 0 à 15% il le considère fermé comment dois-je faire ?
Je souhaiterais mettre une icone ouvert, fermé, partiellement ouvert en fonction de l’ouverture du volet, est-ce que quelqu’un sait comment faire ?
Salut
Pas si simple sauf à faire un volet virtuel et à gérer toi même une position recalculée.
Et puis c’est un tas d’ennui en prévision quand il sera à 14% demander à ha demain fermer un truc déjà fermé, ça va être fun.
A mon avis il faut abandonner l’idée.
Pour l’icone, tu peux te baser là dessus
type: custom:mushroom-template-card
primary: Volets de la maison
multiline_secondary: true
secondary: >-
{% set all = expand('cover.tous_les_volets'|lower) -%} {% set positions = all
| map(attribute='attributes.current_position')|list-%} {% set moving = all |
selectattr('state', 'in', ['opening','closing'])|list|count -%} {% set open =
positions | reject("!=",100) |list |count -%} {% set closed = positions |
reject("!=",15) |list |count -%} {% set other = positions|list|count - open -
closed - moving -%}Fermés = {{ closed }} / Partiels = {{ other }} / Ouverts =
{{ open }} {% if moving >0 -%} / Actifs ={{ moving }}{% endif %}
icon: mdi:window-shutter-open
icon_color: red
badge_icon: ''
layout: horizontal
fill_container: true
picture: ''
pour le groupe j’ai fais ca a 15 il considere le volet fermé en fait je voudrais faire pareil pour le volet individuel
Je reconnais bien le code, c’est le mien à l’origine
Bref, tu n’as qu’à faire ça avec l’icone, comme dans le lien cité précédemment :
100% => icone ouverte
<15% => icone fermée
sinon icone entreouverte
Oui mais je glisse ça ou? Je début et j ai encore du mal
Le code et la capture d’écran ne semble pas correspondre … Tu utilises quoi exactement ?
type: custom:mushroom-cover-card
entity: cover.volet_chambre
primary_info: none
tap_action:
action: more-info
c’est la partie de ma carte bureau volet
Avec cette carte, j’ai pas de solution facile. L’icone est personnalisable mais pas de façon dynamique (on obtient toujours une icone vide)
Là pour le coup j’ai pas d’idée
et du coup je pourrais faire ca avec quelle carte ?