Voici une piste :
type: entities
entities:
- entity: input_number.hacf_0_1
- entity: input_number.hacf_0_1
type: 'custom:multiple-entity-row'
name: Mesures de l'eau
icon: 'mdi:chart-bell-curve'
show_state: false
entities:
- entity: input_number.hacf_0_1
name: Temp.
- entity: input_number.hacf_0_1
name: pH
- entity: input_number.hacf_0_1
name: RedOx
- entity: input_number.hacf_0_1
name: Sel
style: |
hui-generic-entity-row > div > div:nth-child(1) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: blue;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: green;
{% endif %}
}
hui-generic-entity-row > div > div:nth-child(2) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: red;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: orange;
{% endif %}
}
hui-generic-entity-row > div > div:nth-child(3) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: yellow;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: pink;
{% endif %}
}
hui-generic-entity-row > div > div:nth-child(4) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: magenta;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: turquoise;
{% endif %}
}
Et en piochant par-ci par-là des animations :
type: entities
entities:
- entity: input_number.hacf_0_1
- entity: input_number.hacf_0_1
type: 'custom:multiple-entity-row'
name: Mesures de l'eau
icon: 'mdi:chart-bell-curve'
show_state: false
entities:
- entity: input_number.hacf_0_1
name: Temp.
- entity: input_number.hacf_0_1
name: pH
- entity: input_number.hacf_0_1
name: RedOx
- entity: input_number.hacf_0_1
name: Sel
style: |
hui-generic-entity-row > div > div:nth-child(1) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: blue;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: green;
{% endif %}
}
hui-generic-entity-row > div > div:nth-child(2) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: red;
border-radius: 50%;
box-shadow: rgb(250 57 57 / 60%) 0px 0px 0px 0px, rgb(250 57 57 / 60%) 0px 0px 0px 6px inset;
animation: baignade_interdite 1s ease infinite;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: orange;
animation: baignade_dangereuse 1s ease infinite;
{% endif %}
}
hui-generic-entity-row > div > div:nth-child(3) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: yellow;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: pink;
{% endif %}
}
hui-generic-entity-row > div > div:nth-child(4) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: magenta;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: turquoise;
{% endif %}
}
@keyframes baignade_interdite {
25% {
transform: scale(1.3);
}
100% {
box-shadow: 0 0 0 10px rgba(128, 0, 128, 0), 0 0 0 99px rgba(128, 0, 128, 0) inset;
transform: scale(1)
}
}
@keyframes baignade_dangereuse {
0%, 50%, 100% {
transform: scale(1);
}
25%,75% {
transform: scale(1.2);
}
}
Edit: Et enfin avec le changement de la taille de l’information secondaire :
type: entities
entities:
- entity: input_number.hacf_0_1
- entity: input_number.hacf_0_1
type: 'custom:multiple-entity-row'
name: Mesures de l'eau
icon: 'mdi:chart-bell-curve'
show_state: false
secondary_info:
name: false
entity: input_boolean.hacf
entities:
- entity: input_number.hacf_0_1
name: Temp.
- entity: input_number.hacf_0_1
name: pH
- entity: input_number.hacf_0_1
name: RedOx
- entity: input_number.hacf_0_1
name: Sel
style:
hui-generic-entity-row:
$: |
.secondary {
font-size: 10px;
line-height: initial;
}
.: |
hui-generic-entity-row > div > div:nth-child(1) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: blue;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: green;
{% endif %}
}
hui-generic-entity-row > div > div:nth-child(2) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: red;
border-radius: 50%;
box-shadow: rgb(250 57 57 / 60%) 0px 0px 0px 0px, rgb(250 57 57 / 60%) 0px 0px 0px 6px inset;
animation: baignade_interdite 1s ease infinite;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: orange;
animation: baignade_dangereuse 1s ease infinite;
{% endif %}
}
hui-generic-entity-row > div > div:nth-child(3) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: yellow;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: pink;
{% endif %}
}
hui-generic-entity-row > div > div:nth-child(4) > div{
{% set ph = states('input_number.hacf_0_1')|float %}
{% if ph < 6.6 or ph > 8.4 %}
color: magenta;
{% elif (ph > 6.5 and ph < 7.3) or (ph > 7.5 and ph < 8.5) %}
color: turquoise;
{% endif %}
}
@keyframes baignade_interdite {
25% {
transform: scale(1.3);
}
100% {
box-shadow: 0 0 0 10px rgba(128, 0, 128, 0), 0 0 0 99px rgba(128, 0, 128, 0) inset;
transform: scale(1)
}
}
@keyframes baignade_dangereuse {
0%, 50%, 100% {
transform: scale(1);
}
25%,75% {
transform: scale(1.2);
}
}
En espérant que ça te plaise 