Thought I would also contribute with something small. Not as impressive as what some of the others here but a contribution nonetheless.
The GUI for Sunsynk System Mode, or lack thereof, has really been annoying me, so I put this together. It needed to be easy to read to quickly understand what's going on, and also easy for the wife to change if needed.
It requires the lovelace-layout-card to work. For my purposes, it's also a separate view.
views:
- theme: Backend-selected
title: Grid layout
type: custom:grid-layout
layout:
grid-template-columns: 3fr 2fr 2fr 3fr
grid-template-rows: auto
grid-template-areas: |
". header header ."
". system priority ."
". prog1 prog2 ."
". prog3 prog4 ."
". prog5 prog6 ."
mediaquery:
'(max-width: 800px)':
grid-template-columns: auto
grid-template-areas: |
"header"
"system"
"priority"
"prog1"
"prog2"
"prog3"
"prog4"
"prog5"
"prog6"
badges: []
cards:
- type: entities
entities:
- entity: select.system_mode
show_header_toggle: false
view_layout:
grid-area: system
- type: vertical-stack
cards:
- type: custom:mushroom-template-card
primary: Program 1
secondary: >-
{{ states("select.prog1_time") }} - {{ states("select.prog2_time")
}}
icon: mdi:timer
multiline_secondary: false
badge_icon: mdi:lightning-bolt
icon_color: blue
badge_color: green
fill_container: false
- type: horizontal-stack
cards:
- type: entities
entities:
- entity: select.prog1_time
- type: entities
entities:
- entity: select.prog1_charge
- type: entities
entities:
- type: custom:slider-entity-row
entity: number.prog1_power
name: Power
grow: true
- type: custom:slider-entity-row
entity: number.prog1_capacity
name: Battery SOC
view_layout:
grid-area: prog1
- type: vertical-stack
cards:
- type: custom:mushroom-template-card
primary: Program 2
secondary: >-
{{ states("select.prog2_time") }} - {{ states("select.prog3_time")
}}
icon: mdi:timer
multiline_secondary: false
badge_icon: mdi:lightning-bolt
icon_color: blue
badge_color: green
fill_container: false
- type: horizontal-stack
cards:
- type: entities
entities:
- entity: select.prog2_time
- type: entities
entities:
- entity: select.prog2_charge
- type: entities
entities:
- type: custom:slider-entity-row
entity: number.prog2_power
name: Power
grow: true
- type: custom:slider-entity-row
entity: number.prog2_capacity
name: Battery SOC
view_layout:
grid-area: prog2
- type: vertical-stack
cards:
- type: custom:mushroom-template-card
primary: Program 3
secondary: >-
{{ states("select.prog3_time") }} - {{ states("select.prog4_time")
}}
icon: mdi:timer
multiline_secondary: false
badge_icon: mdi:lightning-bolt
icon_color: blue
badge_color: green
fill_container: false
- type: horizontal-stack
cards:
- type: entities
entities:
- entity: select.prog3_time
- type: entities
entities:
- entity: select.prog3_charge
- type: entities
entities:
- type: custom:slider-entity-row
entity: number.prog3_power
name: Power
grow: true
- type: custom:slider-entity-row
entity: number.prog3_capacity
name: Battery SOC
view_layout:
grid-area: prog3
- type: vertical-stack
cards:
- type: custom:mushroom-template-card
primary: Program 4
secondary: >-
{{ states("select.prog4_time") }} - {{ states("select.prog5_time")
}}
icon: mdi:timer
multiline_secondary: false
badge_icon: mdi:lightning-bolt
icon_color: blue
badge_color: green
fill_container: false
- type: horizontal-stack
cards:
- type: entities
entities:
- entity: select.prog4_time
- type: entities
entities:
- entity: select.prog4_charge
- type: entities
entities:
- type: custom:slider-entity-row
entity: number.prog4_power
name: Power
grow: true
- type: custom:slider-entity-row
entity: number.prog4_capacity
name: Battery SOC
view_layout:
grid-area: prog4
- type: vertical-stack
cards:
- type: custom:mushroom-template-card
primary: Program 5
secondary: >-
{{ states("select.prog5_time") }} - {{ states("select.prog6_time")
}}
icon: mdi:timer
multiline_secondary: false
badge_icon: mdi:lightning-bolt
icon_color: blue
badge_color: green
fill_container: false
- type: horizontal-stack
cards:
- type: entities
entities:
- entity: select.prog5_time
- type: entities
entities:
- entity: select.prog5_charge
- type: entities
entities:
- type: custom:slider-entity-row
entity: number.prog5_power
name: Power
grow: true
- type: custom:slider-entity-row
entity: number.prog5_capacity
name: Battery SOC
view_layout:
grid-area: prog5
- type: vertical-stack
cards:
- type: custom:mushroom-template-card
primary: Program 6
secondary: >-
{{ states("select.prog6_time") }} - {{ states("select.prog1_time")
}}
icon: mdi:timer
multiline_secondary: false
badge_icon: mdi:lightning-bolt
icon_color: blue
badge_color: green
fill_container: false
- type: horizontal-stack
cards:
- type: entities
entities:
- entity: select.prog6_time
- type: entities
entities:
- entity: select.prog6_charge
- type: entities
entities:
- type: custom:slider-entity-row
entity: number.prog6_power
name: Power
grow: true
- type: custom:slider-entity-row
entity: number.prog6_capacity
name: Battery SOC
view_layout:
grid-area: prog6
- type: custom:mushroom-title-card
title: Sunsynk System Mode
alignment: center
view_layout:
grid-area: header
- type: entities
entities:
- entity: select.priority_mode
view_layout:
grid-area: priority