Circling back to this topic. Has anyone experienced the Custom-Template-Card yaml posted for the gorgeous genmon card breaking home assistant add card function? On recent updates I’ve had to remove this because I’ve lost the function to use the add card gui. The Custom-Template-Card was breaking as of Core 2024.10.4.
type: custom:config-template-card
variables:
- states['sensor.genmon_version'].state
entities:
- null
card:
type: entities
show_header_toggle: "off"
style: |
.card-header {
padding: 0px 0px 0px 0px !important;
}
entities:
- type: section
label: ${ 'Generac Evolution - Pi 3 - Raspian - Genmon ' + vars[0] }
- type: custom:hui-element
card_type: vertical-stack
cards:
- type: horizontal-stack
cards:
- type: picture
style: |
ha-card {
--paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
--ha-card-background: "rgba(0, 0, 0, 0.0)";
--ha-card-box-shadow: 'none';
}
image: >-
https://genstarservice.com/wp-content/uploads/2024/01/generac-generator-transparent.png
- type: vertical-stack
cards:
- type: custom:button-card
layout: icon_name_state2nd
show_icon: true
show_state: true
styles:
grid:
- grid-template-columns: 50px auto
icon:
- padding: 0px 0px
- height: 20px
- width: 30px
card:
- "--ha-card-background": rgba(0, 0, 0, 0.0)
- "--ha-card-box-shadow": none
state:
- padding: 0px 10px
- justify-self: start
- font-family: Roboto, sans-serif
- font-size: 15px
name:
- padding: 0px 10px
- font-size: 15px
- justify-self: start
- color: var(--secondary-text-color)
entity: sensor.genmon_mon_uptime
name: Uptime
icon: mdi:clock-outline
- type: horizontal-stack
cards:
- type: custom:button-card
layout: icon_name_state2nd
show_icon: true
show_state: true
styles:
grid:
- grid-template-columns: 25px auto
icon:
- padding: 0px 0px
- height: 30px
- width: 30px
card:
- "--ha-card-background": rgba(0, 0, 0, 0.0)
- "--ha-card-box-shadow": none
state:
- padding: 0px 10px
- justify-self: start
- font-family: Roboto, sans-serif
- font-size: 15px
name:
- padding: 0px 10px
- justify-self: start
- color: var(--secondary-text-color)
entity: sensor.genmon_mon_cpu_temperature_raw
name: Temp
icon: mdi:thermometer
- type: custom:button-card
layout: icon_name_state2nd
show_icon: true
show_state: true
styles:
grid:
- grid-template-columns: 25px auto
icon:
- padding: 0px 0px
- height: 30px
- width: 30px
card:
- "--ha-card-background": rgba(0, 0, 0, 0.0)
- "--ha-card-box-shadow": none
state:
- padding: 0px 10px
- justify-self: start
- font-family: Roboto, sans-serif
- font-size: 15px
name:
- padding: 0px 10px
- justify-self: start
- color: var(--secondary-text-color)
- font-size: 13px
entity: sensor.genmon_mon_load
name: Pi CPU
icon: mdi:cpu-64-bit
- type: horizontal-stack
cards:
- type: custom:button-card
layout: icon_name_state2nd
show_icon: true
show_state: true
styles:
grid:
- grid-template-columns: 25px auto
icon:
- padding: 0px 0px
- height: 30px
- width: 30px
card:
- "--ha-card-background": rgba(0, 0, 0, 0.0)
- "--ha-card-box-shadow": none
state:
- padding: 0px 10px
- justify-self: start
- font-family: Roboto, sans-serif
- font-size: 15px
name:
- padding: 0px 10px
- justify-self: start
- color: var(--secondary-text-color)
- font-size: 13px
entity: sensor.genmon_wlan_signal_level
name: WiFi
icon: mdi:gauge
- type: custom:button-card
layout: icon_name_state2nd
show_icon: true
show_state: true
styles:
grid:
- grid-template-columns: 25px auto
icon:
- padding: 0px 0px
- height: 30px
- width: 30px
card:
- "--ha-card-background": rgba(0, 0, 0, 0.0)
- "--ha-card-box-shadow": none
state:
- padding: 0px 10px
- justify-self: start
- font-family: Roboto, sans-serif
- font-size: 15px
name:
- padding: 0px 10px
- justify-self: start
- color: var(--secondary-text-color)
entity: sensor.genmon_generator_battery_raw
name: Battery
icon: mdi:battery
- type: horizontal-stack
cards:
- type: custom:canvas-gauge-card
card_height: 100
entity: sensor.genmon_outage_utility_voltage
name: ""
gauge:
type: radial-gauge
title: Pepco
width: 100
height: 100
minValue: 0
maxValue: 280
startAngle: 40
ticksAngle: 280
valueBox: true
units: Vac
majorTicks:
- 0
- 28
- 56
- 84
- 112
- 140
- 168
- 196
- 224
- 252
- 280
minorTicks: 10
strokeTicks: true
highlights:
- from: 0
to: 218
color: rgba(234, 51, 36, .75)
- from: 218
to: 228
color: rgba(255, 255, 85, .75)
- from: 228
to: 252
color: rgba(104, 225, 67, .75)
- from: 252
to: 262
color: rgba(255, 255, 85, .75)
- from: 262
to: 280
color: rgba(234, 51, 36, .75)
borders: "no"
needleType: arrow
needleWidth: 4
needleCircleSize: 7
needleCircleOuter: true
needleCircleInner: false
animationDuration: 1500
animationRule: linear
valueBoxBorderRadius: 10
colorValueBoxRect: "#222"
colorValueBoxRectEnd: "#333"
valueDec: 0
valueInt: 0
- type: custom:canvas-gauge-card
card_height: 100
entity: sensor.genmon_generator_frequency
name: ""
gauge:
type: radial-gauge
title: Generator
width: 100
height: 100
minValue: 0
maxValue: 70
startAngle: 40
ticksAngle: 280
valueBox: true
units: Hz
majorTicks:
- 0
- 10
- 20
- 30
- 40
- 50
- 60
- 70
minorTicks: 10
strokeTicks: true
highlights:
- from: 0
to: 57
color: rgba(234, 51, 36, .75)
- from: 57
to: 58.5
color: rgba(255, 255, 85, .75)
- from: 58.5
to: 61.5
color: rgba(104, 225, 67, .75)
- from: 61.5
to: 63
color: rgba(255, 255, 85, .75)
- from: 63
to: 70
color: rgba(234, 51, 36, .75)
borders: "no"
needleType: arrow
needleWidth: 4
needleCircleSize: 7
needleCircleOuter: true
needleCircleInner: false
animationDuration: 1500
animationRule: linear
valueBoxBorderRadius: 10
colorValueBoxRect: "#222"
colorValueBoxRectEnd: "#333"
valueDec: 0
valueInt: 0
- type: custom:canvas-gauge-card
card_height: 100
entity: sensor.genmon_generator_output_voltage
name: ""
gauge:
type: radial-gauge
title: Generator
width: 100
height: 100
minValue: 0
maxValue: 280
startAngle: 40
ticksAngle: 280
valueBox: true
units: Vac
majorTicks:
- 0
- 28
- 56
- 84
- 112
- 140
- 168
- 196
- 224
- 252
- 280
minorTicks: 10
strokeTicks: true
highlights:
- from: 0
to: 218
color: rgba(234, 51, 36, .75)
- from: 218
to: 228
color: rgba(255, 255, 85, .75)
- from: 228
to: 252
color: rgba(104, 225, 67, .75)
- from: 252
to: 262
color: rgba(255, 255, 85, .75)
- from: 262
to: 280
color: rgba(234, 51, 36, .75)
borders: "no"
needleType: arrow
needleWidth: 4
needleCircleSize: 7
needleCircleOuter: true
needleCircleInner: false
animationDuration: 1500
animationRule: linear
valueBoxBorderRadius: 10
colorValueBoxRect: "#222"
colorValueBoxRectEnd: "#333"
valueDec: 0
valueInt: 0
- type: horizontal-stack
cards:
- type: custom:canvas-gauge-card
card_height: 100
entity: sensor.genmon_generator_output_power
name: ""
gauge:
type: radial-gauge
title: Generator
width: 100
height: 100
minValue: 0
maxValue: 23000
startAngle: 40
ticksAngle: 280
valueBox: true
units: kW
majorTicks:
- 0
- 3
- 6
- 9
- 12
- 15
- 18
- 20
- 23
minorTicks: 10
strokeTicks: true
highlights:
- from: 0
to: 15000
color: rgba(104, 225, 67, .75)
- from: 15000
to: 18500
color: rgba(255, 255, 85, .75)
- from: 18500
to: 23000
color: rgba(234, 51, 36, .75)
borders: "no"
needleType: arrow
needleWidth: 4
needleCircleSize: 7
needleCircleOuter: true
needleCircleInner: false
animationDuration: 1500
animationRule: linear
valueBoxBorderRadius: 10
colorValueBoxRect: "#222"
colorValueBoxRectEnd: "#333"
valueDec: 0
valueInt: 0
- type: custom:canvas-gauge-card
card_height: 100
entity: sensor.genmon_generator_rpm
name: ""
gauge:
type: radial-gauge
title: Generator
width: 100
height: 100
minValue: 0
maxValue: 4000
startAngle: 40
ticksAngle: 280
valueBox: true
units: RPM
majorTicks:
- 0
- ""
- ""
- ""
- ""
- 2000
- ""
- ""
- ""
- 3600
- 4000
minorTicks: 3
strokeTicks: true
highlights:
- from: 0
to: 3500
color: rgba(234, 51, 36, .75)
- from: 3500
to: 3550
color: rgba(255, 255, 85, .75)
- from: 3550
to: 3650
color: rgba(104, 225, 67, .75)
- from: 3650
to: 3750
color: rgba(255, 255, 85, .75)
- from: 3750
to: 4000
color: rgba(234, 51, 36, .75)
borders: "no"
needleType: arrow
needleWidth: 4
needleCircleSize: 7
needleCircleOuter: true
needleCircleInner: false
animationDuration: 1500
animationRule: linear
valueBoxBorderRadius: 10
colorValueBoxRect: "#222"
colorValueBoxRectEnd: "#333"
valueDec: 0
valueInt: 0
- type: custom:canvas-gauge-card
card_height: 100
entity: sensor.genmon_generator_battery_raw
name: ""
gauge:
type: radial-gauge
title: Generator
width: 100
height: 100
minValue: 0
maxValue: 16
startAngle: 40
ticksAngle: 280
valueBox: true
units: Volts
majorTicks:
- 1
- 2
- 3
- 4
- 5
- 8
- 10
- 11
- 13
- 14.2
- 16
minorTicks: 5
strokeTicks: true
highlights:
- from: 0
to: 11.6
color: rgba(234, 51, 36, .75)
- from: 11.6
to: 12.6
color: rgba(255, 255, 85, .75)
- from: 12.6
to: 14.5
color: rgba(104, 225, 67, .75)
- from: 14.5
to: 14.9
color: rgba(255, 255, 85, .75)
- from: 15
to: 16
color: rgba(234, 51, 36, .75)
borders: "no"
needleType: arrow
needleWidth: 4
needleCircleSize: 7
needleCircleOuter: true
needleCircleInner: false
animationDuration: 1500
animationRule: linear
valueBoxBorderRadius: 10
colorValueBoxRect: "#222"
colorValueBoxRectEnd: "#333"
valueDec: 0
valueInt: 0
- type: entities
entities:
- entity: sensor.genmon_generator_exercise_time
name: Exercise
icon: mdi:clock
- entity: sensor.genmon_generator_last_action
name: Last Action
icon: mdi:clipboard-edit-outline
- entity: sensor.genmon_generator_last_alarm_log
name: Last Alarm
icon: mdi:alarm-bell
- entity: sensor.genmon_outage_status
name: Last Outage
icon: mdi:power-plug-off
style: |
ha-card {
--paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
--ha-card-background: "rgba(0, 0, 0, 0.0)";
--paper-item-icon-color: 'var(--text-primary-color)';
--ha-card-box-shadow: 'none';
}
type or paste code here
Which looked like this:
BUT it has resulted in being unable to add cards like this:
Browser console logs confirmed the Config-Template-Card was breaking HA.