I have put together a mini climate card YAML for this integration which tries to roughly map the functionality of the Wundasmart App displays for each zone. Hope it’s useful as I couldn’t find anything similar: the mini-climate-card documentation isn’t the easiest to follow!
type: custom:mini-climate
entity: climate.master_bedroom
name: Master Bedroom
#
# Mini Climate Card set up for a Wundasmart climate entity.
# Requires card-mod integration from HACS
# force icon to be specific colour.
#
card_mod:
style: |
ha-icon {
color: white !important;
}
icon: mdi:bed-king
hide_current_temperature: true
#
# Set step increments for target temp
#
target_temperature:
step: 0.5
value:
style: |
(value) => (value > 30 ? { color: 'red'} : { color: 'green'})
#
# Display only the target temperature
#
secondary_info:
hide: true
#
# Hide the three-dots menu in the default card
#
toggle:
hide: true
#
# Set the indicator for heating status from Wundasmart
#
hvac_mode:
#
# white for off, orange for heating, gray for idle
#
style: |-
(value, entity) => {
if (value === 'off') return { color: 'white !important' };
if (entity.attributes?.hvac_action === 'heating') return { color: 'orange !important' };
return { color: 'gray !important' };
}
hide: false
#
# set icon for each mode, heating, idle and off
#
source:
"off":
icon: mdi:power
name: "off"
auto:
icon: mdi:fire
name: auto
heat:
icon: mdi:fire
name: heating
#
# Indicators: preset mode, humidity, temp and battery
# - temp at the end to keep data in multiple cards aligned as the mini climate card
# presents integer temps as 23 rather than 23.0
# - Battery indicator is hidden unless battery is below 30%
# - Preset modes map to Wundasmart modes, and hand for manual mode set
# Any temp manually set to be the same as a preset mode temp will show as if the preset is operating
#
indicators:
preset:
icon:
#
# preset mode returns null if manual mode is set
# Hand returned for manual settings, circle for anything else
#
template: |
(value) => (!value || value === '')
? 'mdi:hand-back-right-outline'
: 'mdi:circle-outline'
#
# Set colours for each mode, value == '' sets manual mode colour
#
style: |
(value) => {
if (!value || value == '') {
return { color: 'white' };
} else if (value === 'reduced') {
return { color: 'dodgerblue' };
} else if (value === 'eco') {
return { color: 'green' };
} else {
return { color: 'red' };
}
}
#
# click on circle brings up main thermostat window
#
tap_action:
action: more-info
entity: climate.master_bedroom
#
# Do not display text for the preset mode, just the icon
#
value:
style: |
() => ({display: 'none'})
source:
attribute: preset_mode
#
# Show humidity with colours above/below thresholds and
# history graph if clicked on
#
humidity:
icon:
template: () => 'mdi:water-percent'
#
# Colour the icon above and below thresholds
#
style: |
(value) => {
if (value > 80) {
return { color: 'CadetBlue' }; // Above high threshold
} else if (value > 40) {
return { color: 'white' }; // Below low threshold
} else {
return { color: 'red' }; // Within the normal range
}
}
value:
#
# colour the humidity data above and below thresholds
#
style: |
(value) => {
if (value > 80) {
return { color: 'CadetBlue' }; // Above high threshold
} else if (value > 40) {
return { color: 'white' }; // Below low threshold
} else {
return { color: 'red' }; // Within the normal range
}
}
#
# Click on the humidity gives history graph
#
tap_action:
action: more-info
entity: sensor.master_bedroom_humidity
unit: "%"
#
# round to nearest integer %
#
round: 0
source:
entity: sensor.master_bedroom_humidity
#
# Show temperature with colours above/below thresholds and
# history graph if clicked on
#
temperature2:
icon:
template: () => 'mdi:thermometer'
#
# Colour the icon above and below thresholds
#
style: |
(value) => {
if (value > 27) {
return { color: 'red' }; // Above high threshold
} else if (value < 4) {
return { color: 'CadetBlue' }; // Below low threshold
} else {
return { color: 'white' }; // Within the normal range
}
}
value:
#
# colour the temperature data above and below thresholds
#
style: |
(value) => {
if (value > 27) {
return { color: 'red' }; // Above high threshold
} else if (value < 4) {
return { color: 'CadetBlue' }; // Below low threshold
} else {
return { color: 'white' }; // Within the normal range
}
}
#
# Click on temperature gives temperature graph
#
tap_action:
action: more-info
entity: sensor.master_bedroom_temperature
unit: C
#
# Show to 1 decimal place, but the card logic will always show X.0 as
# an integer without any decimal places.
#
round: 1
source:
entity: sensor.master_bedroom_temperature
#
# Show battery if it is below 30%, with different colours
# between 20-30% and below 20%. Hide indicator if battery >30%
#
battery:
hide: |
(value) => value > 30
icon:
#
# Choose 20% battery icon above 20% otherwise 10% icon
#
template: |
(value) => (value > 20)
? 'mdi:battery-20'
: 'mdi:battery-10'
style: |
#
# Show icon orange above 20%, red below 20%
#
(value) => {
if (value < 20) {
return { color: 'red' }; // Above high threshold
} else {
return { color: 'orange' }; // Below low threshold
}
}
value:
#
# colour the battery data as for the icon
#
style: |
(value) => {
if (value < 20) {
return { color: 'red' }; // Above high threshold
} else {
return { color: 'orange' }; // Below low threshold
}
}
unit: "%"
#
# Round to nearest integer %
#
round: 0
source:
entity: sensor.master_bedroom_battery_level
