Voilà mon code si utile :
type: custom:stack-in-card
mode: vertical
keep:
box_shadow: false
margin: false
border_radius: false
background: true
outer_padding: false
cards:
- type: custom:meteofrance-weather-card
entity: weather.forecast_maison
number_of_forecasts: '5'
current: true
details: false
alert_forecast: false
animated_icons: true
wind_forecast_icons: false
forecast: false
one_hour_forecast: false
card_mod:
style: |
ha-card {
background: SteelBlue;
border-radius: 0;
border: none;
}
- type: horizontal-stack
cards:
- type: custom:button-card
entity: sensor.netatmo_salon_pressure
name: Pression
units: mbar
show_icon: false
show_state: true
styles:
card:
- background: SteelBlue
- border-radius: 0
name:
- font-size: 14px
state:
- font-size: 22px
card_mod:
style: |
ha-card {
border: none;
}
- type: custom:button-card
entity: sensor.netatmo_jardin_temperature
name: Ressentie
show_icon: false
show_state: true
styles:
card:
- background: SteelBlue
- border-radius: 0
name:
- font-size: 14px
state:
- font-size: 22px
card_mod:
style: |
ha-card {
border: none;
}
- type: custom:button-card
entity: sensor.netatmo_jardin_humidity
name: Humidité
show_icon: false
show_state: true
styles:
card:
- background: SteelBlue
- border-radius: 0
name:
- font-size: 14px
state:
- font-size: 22px
card_mod:
style: |
ha-card {
border: none;
}
- type: vertical-stack
cards:
- type: custom:meteofrance-weather-card
entity: weather.forecast_maison
number_of_forecasts: '5'
current: false
alert_forecast: false
one_hour_forecast: false
forecast: true
wind_forecast_icons: false
details: false
card_mod:
style: |
ha-card {
background: SteelBlue;
border-radius: 0;
border: none;
}
.forecast ul.day .lowTemp {
color: WhiteSmoke !important;
}
- type: custom:mushroom-title-card
title: Netatmo Salon
alignment: center
title_tap_action:
action: none
subtitle_tap_action:
action: none
card_mod:
style: |
ha-card {
background: Snow;
border-radius: 0;
--primary-text-color: black;
border: none;
}
- type: horizontal-stack
cards:
- type: custom:flex-horseshoe-card
entities:
- entity: sensor.netatmo_salon_co2
attribute: temperature
icon: mdi:leaf
decimals: 0
area: qualité
show:
horseshoe_style: lineargradient
layout:
states:
- id: 0
entity_index: 0
xpos: 47
ypos: 67
styles:
- font-size: 3.3em;
- fill: SeaGreen;
icons:
- id: 0
entity_index: 0
xpos: 56
ypos: 40
align: end
styles:
- font-size: 1.1em;
- color: SeaGreen;
horseshoe_scale:
min: -10
max: 40
color_stops:
'10': SeaGreen
'18': SeaGreen
card_mod:
style: |
ha-card {
background: Snow;
border-radius: 0;
border:none;
}
- type: custom:button-card
entity: sensor.netatmo_salon_temperature
layout: icon_state
aspect_ratio: 1.045/1
icon: mdi:circle
color: SeaGreen
size: 20px
show_icon: true
show_state: true
show_name: false
units: °
styles:
card:
- background: Snow
- border-radius: 0
state:
- color: Teal
- font-size: 45px
- margin-left: '-30px'
- justify-self: start
- white-space: normal
card_mod:
style: |
ha-card {
border: none;
}
- type: horizontal-stack
cards:
- type: custom:button-card
entity: sensor.netatmo_salon_co2
layout: icon_name_state2nd
name: CO2
icon: mdi:circle
color: SeaGreen
size: 15px
units: ppm
show_icon: true
show_state: true
styles:
card:
- background: Snow
- border-radius: 0
name:
- font-size: 14px
- color: grey
- margin-left: '-20px'
state:
- font-size: 23px
- color: Teal
icon:
- left: 20px
card_mod:
style: |
ha-card {
border: none;
}
- type: custom:button-card
entity: sensor.netatmo_salon_noise
name: Silencieux
icon: mdi:circle
color: SeaGreen
size: 15px
units: dB
layout: icon_name_state2nd
show_icon: true
show_state: true
styles:
card:
- background: Snow
- border-radius: 0
name:
- font-size: 14px
- color: grey
- margin-left: '-20px'
state:
- font-size: 23px
- color: Teal
icon:
- left: 20px
card_mod:
style: |
ha-card {
border: none;
}
- type: custom:button-card
entity: sensor.netatmo_salon_humidity
name: Humidité
icon: mdi:circle
color: SeaGreen
size: 15px
layout: icon_name_state2nd
show_icon: true
show_state: true
styles:
card:
- background: Snow
- border-radius: 0
name:
- font-size: 14px
- color: grey
- margin-left: '-20px'
state:
- font-size: 23px
- color: Teal
icon:
- left: 20px
card_mod:
style: |
ha-card {
border: none;
}
card_mod:
style: |
ha-card {
background: Snow;
}