Hi,
I made a dashboard with mainly mushroom template-cards and i’m pleased with the result
Maybe this is usefull for others.
Mainpage
Subpage
Heating popup
kiosk_mode:
non_admin_settings:
hide_header: true
ignore_entity_settings: true
popup_cards:
group.l_keuken:
title: Keuken
card:
type: custom:vertical-stack-in-card
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
entity: group.l_keuken
secondary_info: state
double_tap_action:
action: none
name: Verlichting
icon: mdi:lightbulb-multiple
icon_color: amber
tap_action:
action: toggle
hold_action:
action: more-info
hide_icon: false
use_entity_picture: false
primary_info: name
- type: divider
- type: entities
entities:
- type: custom:mushroom-light-card
entity: light.keuken_spots
layout: horizontal
show_brightness_control: true
- type: custom:mushroom-light-card
entity: light.keuken_eiland
layout: horizontal
show_brightness_control: true
- type: custom:mushroom-light-card
entity: light.keuken_aanrecht
layout: horizontal
show_brightness_control: true
- type: divider
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: group.all_lights
icon_color: orange
icon: mdi:lightbulb-multiple
tap_action:
action: toggle
- type: entity
entity: cover.kitchen_shutter
alignment: start
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: light.keuken_aanrecht
icon: mdi:movie-open
tap_action:
action: toggle
hold_action:
action: none
double_tap_action:
action: none
content_info: none
alignment: end
views:
- theme: Backend-selected
title: Home
icon: mdi:home
type: sidebar
badges: []
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: action
icon: mdi:music-box-multiple
tap_action:
action: navigate
navigation_path: /media-dashboard/music
hold_action:
action: none
double_tap_action:
action: none
alignment: start
- type: custom:mushroom-chips-card
chips:
- type: action
icon: mdi:home-clock
tap_action:
action: fire-dom-event
browser_mod:
command: popup
deviceID: this
title: ' '
card:
type: custom:scheduler-card
include:
- climate
- cover
- light
- scene
exclude:
- light.4c3876d1_75a6d8a9
- light.browser_mod_08e6a88e_207667c2
- light.browser_mod_659c7175_fb37a0ec
- light.browser_mod_98a23227_a6edb32d
- light.browser_mod_bc1bd5a4_a156fb14
- light.browser_mod_bd8debd6_54097609
- light.browser_mod_c540c544_1f0ae337
- light.browser_mod_c7491a57_71323f73
- light.browser_mod_dc859bf7_e3a08c08
- light.browser_mod_f218b876_ee59b04b
- light.browser_mod_fa3760fc_81d94085
- type: weather
entity: weather.home_dv
show_conditions: false
show_temperature: true
- type: action
icon: mdi:information-outline
tap_action:
action: navigate
navigation_path: info
alignment: end
- type: custom:mushroom-template-card
primary: Welkom thuis, {{user}}
multiline_secondary: false
layout: vertical
fill_container: false
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: ''
secondary: ''
icon: mdi:lightbulb-group
layout: vertical
entity: group.all_lights
icon_color: |-
{% if is_state("group.all_lights", "on") %}
amber
{% endif %}
tap_action:
action: toggle
- type: custom:mushroom-template-card
primary: ''
secondary: ''
icon: mdi:blinds
layout: vertical
entity: cover.kitchen_shutter
icon_color: green
- type: custom:mushroom-template-card
primary: ''
secondary: ''
icon: mdi:radiator
layout: vertical
icon_color: red
- type: custom:mushroom-template-card
primary: ''
secondary: ''
icon: mdi:fan
layout: vertical
icon_color: |-
{% if is_state("group.all_lights", "on") %}
blue
{% endif %}
tap_action:
action: navigate
navigation_path: ventilatie
- type: custom:mushroom-template-card
primary: ''
secondary: ''
icon: mdi:shield
layout: vertical
icon_color: |
{% if is_state("group.all_lights", "on") %}
red
{% elif is_state("group.all_lights", "off") %}
green
{% else %}
orange
{% endif %}
tap_action:
action: navigate
navigation_path: beveiliging
- type: custom:vertical-stack-in-card
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Gelijkvloer
icon: mdi:home-floor-0
multiline_secondary: false
icon_color: blue
entity: group.l_keuken
tap_action:
action: more-info
- type: divider
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Hal
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:door-closed
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: custom:mushroom-template-card
primary: Toilet
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:toilet
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Salon
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:sofa
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: custom:mushroom-template-card
primary: Eetkamer
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:table-chair
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Keuken
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:knife
entity: group.l_keuken
icon_color: |-
{% if is_state('light.keuken_spots', 'on') %}
orange
{% endif %}
tap_action:
action: navigate
navigation_path: Keuken
hold_action:
action: toggle
double_tap_action:
action: more-info
- type: custom:mushroom-template-card
primary: Berging
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:washing-machine
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Bureau
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:desk
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: divider
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: group.all_lights
icon_color: orange
icon: mdi:lightbulb-multiple
tap_action:
action: toggle
- type: entity
entity: cover.kitchen_shutter
alignment: start
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: light.keuken_aanrecht
icon: mdi:movie-open
tap_action:
action: toggle
hold_action:
action: none
double_tap_action:
action: none
content_info: none
alignment: end
- type: custom:vertical-stack-in-card
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Verdiep
icon: mdi:home-floor-1
icon_color: blue
- type: divider
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Nachthal
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:door-closed
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
tap_action:
action: toggle
hold_action:
action: more-info
- type: custom:mushroom-template-card
primary: Badkamer
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:shower
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Master bedroom
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:bed
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: custom:mushroom-template-card
primary: Logeerkamer
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:bed
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Hobbykamer
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:palette
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: divider
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: group.all_lights
icon_color: orange
icon: mdi:lightbulb-multiple
tap_action:
action: toggle
alignment: start
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: light.keuken_aanrecht
icon: mdi:movie-open
tap_action:
action: toggle
hold_action:
action: none
double_tap_action:
action: none
content_info: none
alignment: end
- type: custom:vertical-stack-in-card
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Buiten
icon: mdi:tree
icon_color: blue
- type: divider
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Nachthal
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:door-closed
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
tap_action:
action: toggle
hold_action:
action: more-info
- type: custom:mushroom-template-card
primary: Badkamer
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:shower
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Master bedroom
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:bed
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: custom:mushroom-template-card
primary: Logeerkamer
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:bed
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: Hobbykamer
secondary: >-
{{ states("sensor.leefruimte_temperature") |round(1) }} °C/ {{
states("sensor.leefruimte_humidity") }} %
icon: mdi:palette
hold_action:
action: more-info
tap_action:
action: toggle
icon_color: |-
{% if is_state('group.l_keuken', 'on') %}
orange
{% endif %} ##
- type: divider
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: group.all_lights
icon_color: orange
icon: mdi:lightbulb-multiple
tap_action:
action: toggle
alignment: start
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: light.keuken_aanrecht
icon: mdi:movie-open
tap_action:
action: toggle
hold_action:
action: none
double_tap_action:
action: none
content_info: none
alignment: end
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: group.all_lights
icon_color: orange
icon: mdi:lightbulb-group
tap_action:
action: toggle
- type: action
icon_color: green
icon: mdi:blinds
- type: entity
entity: climate.leefruimte
icon_color: red
icon: mdi:radiator
tap_action:
action: fire-dom-event
browser_mod:
command: popup
deviceID: this
title: Verwarming
card:
type: thermostat
entity: climate.leefruimte
content_info: none
use_entity_picture: false
- type: action
icon_color: orange
icon: mdi:shield-home
alignment: center
- theme: Backend-selected
title: Keuken
path: Keuken
icon: mdi:knife
visible: []
type: sidebar
badges: []
cards:
- square: false
columns: 3
type: grid
cards:
- type: custom:mushroom-chips-card
chips:
- type: back
icon: mdi:arrow-left
- type: custom:mushroom-title-card
title: Keuken
alignment: center
- type: custom:mushroom-chips-card
chips:
- type: action
icon: mdi:home
tap_action:
action: navigate
navigation_path: Home
alignment: end
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: template
content: >-
{{ states.climate.leefruimte.attributes.current_temperature }}
°C
icon: mdi:thermometer
entity: climate.leefruimte
tap_action:
action: fire-dom-event
browser_mod:
command: popup
deviceID: this
title: Verwarming
card:
type: thermostat
entity: climate.leefruimte
- type: entity
entity: sensor.leefruimte_humidity
alignment: end
- type: custom:vertical-stack-in-card
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
entity: group.l_keuken
secondary_info: state
double_tap_action:
action: none
name: Verlichting
icon: mdi:lightbulb-multiple
icon_color: amber
tap_action:
action: toggle
hold_action:
action: more-info
hide_icon: false
use_entity_picture: false
primary_info: name
- type: divider
- type: entities
entities:
- type: custom:mushroom-light-card
entity: light.keuken_spots
layout: horizontal
show_brightness_control: true
- type: custom:mushroom-light-card
entity: light.keuken_eiland
layout: horizontal
show_brightness_control: true
- type: custom:mushroom-light-card
entity: light.keuken_aanrecht
layout: horizontal
show_brightness_control: true
- type: divider
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: light.keuken_aanrecht
icon: mdi:silverware-fork-knife
tap_action:
action: toggle
hold_action:
action: none
double_tap_action:
action: none
content_info: none
- type: entity
entity: scene.koken
tap_action:
action: call-service
service: scene.turn_on
service_data: {}
target:
entity_id: scene.koken
hold_action:
action: more-info
content_info: none
- type: entity
entity: light.keuken_aanrecht
icon: mdi:weather-night
tap_action:
action: toggle
hold_action:
action: none
double_tap_action:
action: none
content_info: none
alignment: center
- type: custom:mushroom-cover-card
entity: cover.kitchen_shutter
name: Screen Keuken
show_position_control: false
show_buttons_control: true
- title: Zonnewering
path: zonnewering
icon: mdi:blinds
visible: []
badges: []
cards: []
- title: Verwarming
path: verwarming
icon: mdi:radiator
visible: []
badges: []
cards: []
- theme: Backend-selected
title: Ventilatie
path: ventilatie
icon: mdi:fan
visible: []
badges: []
cards:
- square: false
columns: 3
type: grid
cards:
- type: custom:mushroom-chips-card
chips:
- type: back
icon: mdi:arrow-left
- type: custom:mushroom-title-card
title: Ventilatie
alignment: center
- type: custom:mushroom-chips-card
chips:
- type: action
icon: mdi:home
tap_action:
action: navigate
navigation_path: Home
alignment: end
- title: Beveiliging
path: beveiliging
icon: mdi:alarm-light
visible: []
badges: []
cards:
- square: false
columns: 3
type: grid
cards:
- type: custom:mushroom-chips-card
chips:
- type: back
icon: mdi:arrow-left
- type: custom:mushroom-title-card
title: Beveiliging
alignment: center
- type: custom:mushroom-chips-card
chips:
- type: action
icon: mdi:home
tap_action:
action: navigate
navigation_path: Home
alignment: end
- type: picture-glance
title: Kitchen
image: https://demo.home-assistant.io/stub_config/kitchen.png
entities:
- sensor.oneplus_a6013_battery_level
- sensor.oneplus_a6013_battery_temperature
- theme: Backend-selected
title: info
path: info
icon: mdi:information-outline
visible: []
badges: []
cards:
- square: false
columns: 3
type: grid
cards:
- type: custom:mushroom-chips-card
chips:
- type: back
icon: mdi:arrow-left
- type: custom:mushroom-title-card
title: Info
alignment: center
- type: custom:mushroom-chips-card
chips:
- type: action
icon: mdi:home
tap_action:
action: navigate
navigation_path: Home
alignment: end
Volumio integrated with webpage card
kiosk_mode:
non_admin_settings:
hide_header: true
ignore_entity_settings: true
views:
- theme: Backend-selected
title: Muziek
icon: mdi:music
path: music
type: sidebar
badges: []
cards:
- square: false
columns: 3
type: grid
cards:
- type: custom:mushroom-chips-card
chips:
- type: back
icon: mdi:arrow-left
- type: custom:mushroom-chips-card
chips:
- type: action
tap_action:
action: navigate
navigation_path: tv
icon: mdi:television
alignment: center
- type: custom:mushroom-chips-card
chips:
- type: action
icon: mdi:home
tap_action:
action: navigate
navigation_path: /lovelace-home/0
alignment: end
- square: false
columns: 1
type: grid
cards:
- type: iframe
url: http://volumio.local
aspect_ratio: 170%
