Thank you for the code, This is my issue,
type: custom:stack-in-card
cards:
- type: custom:layout-card
layout_type: masonry
layout: {}
cards:
- type: custom:mushroom-chips-card
chips: null
- type: custom:mushroom-chips-card
chips:
- type: menu
- type: alarm-control-panel
entity: alarm_control_panel.verisure_alarm
content_info: none
name: Alarm
- type: conditional
conditions:
- entity: group.lights_on_count
state: 'on'
chip:
type: template
icon: mdi:lightbulb-group
content: >-
{{ expand(states.group.lights_on_count) | selectattr( 'state',
'eq', 'on') | list | count }}
tap_action:
action: more-info
entity: group.lights_on_count
icon_color: amber
- type: template
entity: lock.hoveddor
icon: |-
{% set state=states(entity) %}
{% if state=='locked' %}
mdi:lock
{% elif state=='unlocked' %}
mdi:lock-open-variant
{% else %}
grey
{% endif %}
tap_action:
action: more-info
icon_color: |-
{% set state=states(entity) %}
{% if state=='locked' %}
green
{% elif state=='unlocked' %}
red
{% else %}
grey
{% endif %}
- type: template
entity: group.windows_open_count
content: >-
{{ expand(states.group.windows_open_count) | selectattr( 'state',
'eq', 'on') | list | count }}
icon: |-
{% set state=states(entity) %}
{% if state=='off' %}
mdi:window-closed-variant
{% elif state=='on' %}
mdi:window-open-variant
{% else %}
mdi:window-closed-variant
{% endif %}
icon_color: |-
{% set state=states(entity) %}
{% if state=='off' %}
green
{% elif state=='on' %}
red
{% else %}
grey
{% endif %}
tap_action:
action: more-info
- type: conditional
conditions:
- entity: group.doors_open_count
state: 'on'
chip:
type: template
icon_color: red
icon: mdi:door-open
content: >-
{{ expand(states.group.doors_open_count) | selectattr( 'state',
'eq', 'on') | list | count }}
tap_action:
action: more-info
entity: group.doors_open_count
- type: template
entity: sensor.tibber_stromlast_hjemmet
content: >-
{{(states('sensor.tibber_stromlast_hjemmet')|float *
1/1000)|round(1)}}KWh
chip:
icon: mdi:lightning-bolt
icon_color: orange
card_mod:
style: |
:host {
--ha-card-background: var(--card-background-color);
}
- type: action
icon: mdi:dots-vertical
tap_action:
action: navigate
navigation_path: >-
https://ckpungoon7m9o0jyv969gdclrygt68x1.ui.nabu.casa/lovelace-panel/hjem?edit=1
hold_action:
action: none
double_tap_action:
action: navigate
navigation_path: /lovelace-panel/hjem
icon_color: white
alignment: justify
card_mod:
style: |
:host {
--ha-card-background: rgba(var(--rgb-primary-text-color), 0.025);
}
ha-card {
--chip-spacing: 2px;
}
- type: custom:mushroom-chips-card
chips:
- type: conditional
conditions:
- entity: group.lights_on_count
state: 'on'
chip:
type: template
icon: mdi:lightbulb-group
content: >-
{{ expand(states.group.lights_on_count) | selectattr( 'state',
'eq', 'on') | list | count }}
tap_action:
action: more-info
entity: group.lights_on_count
icon_color: amber
- type: conditional
- type: custom:stack-in-card
mode: horizontal
cards:
- type: custom:stack-in-card
mode: vertical
cards:
- type: markdown
content: |-
{% set time = now().hour %}
{% if (time >= 18) %}
Hei, {{user}}
{% elif (time >= 12) %}
Hei, {{user}}
{% elif (time >= 5) %}
Hei, {{user}}
{% else %}
Hei, {{user}}!
{% endif %}
card_mod:
style: |
ha-markdown {
padding: 0 0 0 10px !important;
font-size: 28px !important;
font-weight: normal !important;
line-height: 1.2 !important;
}
ha-card {
background-color: #111111;
color: #e1e1e1;
box-shadow: 0px 0px;
}
- type: markdown
content: Idag er det **{{ now().strftime('%d %B, %Y') }}**
card_mod:
style: |
ha-markdown {
padding: 0 0 0 10px !important;
font-size: 14px !important;
font-weight: normal !important;
line-height: 1.4 !important;
}
ha-card {
background-color: #111111;
color: #9b9b9b;
box-shadow: 0px 0px;
}
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-primary-text-color), 0.0);
color: #e1e1e1;
box-shadow: 0px 0px;
width: 350px
}
- type: custom:mushroom-chips-card
chips:
- type: conditional
conditions:
- entity: person.charlotte
state: home
chip:
type: entity
entity: person.charlotte
content_info: nam
use_entity_picture: true
square: false
card_mod:
style: |
ha-card {
--chip-background: rgba(var(--rgb-state-person-home), 0.7);
margin-top: 5px;
margin-bottom: 0px;
--chip-border-radius: 50px;
}
- type: conditional
conditions:
- entity: person.charlotte
state_not: home
chip:
type: entity
entity: person.charlotte
content_info: none
use_entity_picture: true
square: false
card_mod:
style: |
ha-card {
{% if is_state('person.charlotte', 'not_home') %}
--chip-background: rgba(var(--rgb-state-person-not-home), 0.4);
{% elif is_state('person.cavidan', 'unknown') %}
--chip-background: rgba(var(--rgb-state-person-unknown), 0.4);
{% else %}
--chip-background: rgba(var(--rgb-state-person-zone), 0.4);
{% endif %}
margin-top: 5px;
margin-bottom: 0px;
}
alignement: end
card_mod:
style: |
ha-card {
background-color: none;
color: #9b9b9b;
box-shadow: 0px 0px;
margin-left: 100px
}
- type: custom:mushroom-chips-card
chips:
- type: conditional
conditions:
- entity: person.tommy
state: home
chip:
type: entity
entity: person.tommy
content_info: nam
use_entity_picture: true
card_mod:
style: |
ha-card {
--chip-background: rgba(var(--rgb-state-person-home), 0.7);
margin-top: 5px;
margin-bottom: 0px;
--chip-border-radius: 50px;
}
- type: conditional
conditions:
- entity: person.tommy
state_not: home
chip:
type: entity
entity: person.tommy
content_info: none
use_entity_picture: true
card_mod:
style: |
ha-card {
{% if is_state('person.berkan_sezer', 'not_home') %}
--chip-background: rgba(var(--rgb-state-person-not-home), 0.4);
{% elif is_state('person.berkan_sezer', 'unknown') %}
--chip-background: rgba(var(--rgb-state-person-unknown), 0.4);
{% else %}
--chip-background: rgba(var(--rgb-state-person-zone), 0.4);
{% endif %}
margin-top: 12px;
margin-bottom: 0px;
}
alignment: end
card_mod:
style: |
ha-card {
background-color: none;
color: #9b9b9b;
box-shadow: 0px 0px;
margin-right: 10px;
}
- type: custom:mushroom-chips-card
chips:
- type: conditional
conditions:
- entity: person.benjamin
state: home
chip:
type: entity
entity: person.benjamin
content_info: nam
use_entity_picture: true
card_mod:
style: |
ha-card {
--chip-background: rgba(var(--rgb-state-person-home), 0.7);
margin-top: 5px;
margin-bottom: 0px;
--chip-border-radius: 50px;
}
- type: conditional
conditions:
- entity: person.benjamin
state_not: home
chip:
type: entity
entity: person.benjamin
content_info: none
use_entity_picture: true
card_mod:
style: |
ha-card {
{% if is_state('person.benjamin', 'not_home') %}
--chip-background: rgba(var(--rgb-state-person-not-home), 0.4);
{% elif is_state('person.benjamin', 'unknown') %}
--chip-background: rgba(var(--rgb-state-person-unknown), 0.4);
{% else %}
--chip-background: rgba(var(--rgb-state-person-zone), 0.4);
{% endif %}
margin-top: 5px;
margin-bottom: 0px;
--chip-border-radius: 50px;
}
alignment: end
card_mod:
style: |
ha-card {
margin: -57px 75px 0 0
}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: ''
secondary: Hjem
icon: mdi:home
layout: vertical
icon_color: blue
tap_action:
action: navigate
navigation_path: /lovelace-panel/hjem
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-primary-text-color), 0.025);
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
margin-bottom: -10px;
}
- type: custom:mushroom-template-card
primary: ''
secondary: Lys
icon: mdi:lightbulb-group
icon_color: orange
layout: vertical
tap_action:
action: navigate
navigation_path: /lovelace-panel/lys
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-primary-text-color), 0.025);
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
margin-bottom: -10px;
}
- type: custom:mushroom-template-card
primary: ''
secondary: Alarm
icon: mdi:shield
icon_color: grey
layout: vertical
tap_action:
action: navigate
navigation_path: /lovelace-panel/alarm
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-primary-text-color), 0.025);
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
margin-bottom: -10px;
}
- type: custom:mushroom-template-card
primary: ''
secondary: Ungene
icon: mdi:face-man
icon_color: green
layout: vertical
tap_action:
action: navigate
navigation_path: /lovelace-panel/ungene
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-primary-text-color), 0.025);
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
margin-bottom: -10px;
}
- type: custom:mushroom-template-card
primary: ''
secondary: Rom
icon: mdi:sofa
layout: vertical
icon_color: brown
tap_action:
action: navigate
navigation_path: /lovelace-panel/rom
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-primary-text-color), 0.025);
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
margin-bottom: -10px;
}
- square: false
columns: 2
type: grid
cards:
- type: custom:mushroom-chips-card
chips:
- type: conditional
conditions:
- entity: input_boolean.boolean_dashboard_welcome_dropdown
state: 'off'
chip:
type: weather
entity: weather.hjem
show_conditions: true
show_temperature: true
- type: conditional
conditions:
- entity: input_boolean.boolean_dashboard_welcome_dropdown
state: 'off'
chip:
type: entity
entity: sensor.moon
icon_color: yellow
- type: conditional
conditions:
- entity: input_boolean.boolean_dashboard_welcome_dropdown
state: 'off'
chip:
type: template
content: '{{state_attr(entity, ''current_temperature'')}} °F'
entity: sensor.verisure_rv_stua_fukt
icon: mdi:home-thermometer
tap_action:
action: more-info
icon_color: |-
{% set state=states(entity) %}
{% if state=='cool' %}
blue
{% elif state=='heat' %}
red
{% else %}
grey
{% endif %}
card_mod:
style: |
ha-card {
--chip-box-shadow: none;
--chip-background: none;
--chip-spacing: 0px;
--chip-padding: 15px;
margin-left: -6px;
margin-bottom: -12px;
width: 400px
}
alignment: start
- type: custom:mushroom-chips-card
chips:
- type: template
icon: |-
{% if is_state(entity, 'off') %}
mdi:chevron-down
{% elif is_state(entity, 'on') %}
mdi:chevron-up
{% endif %}
tap_action:
action: toggle
entity: input_boolean.boolean_dashboard_welcome_dropdown
icon_color: disabled
card_mod:
style: |
ha-card {
--chip-box-shadow: none;
--chip-background: none;
--chip-spacing: 0px;
--chip-padding: 0px;
--chip-icon-size: 40px;
margin-right: -4px;
margin-bottom: -12px;
}
alignment: end
- type: conditional
conditions:
- entity: input_boolean.boolean_dashboard_welcome_dropdown
state: 'on'
card:
type: vertical-stack
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: ''
secondary: Stua
icon: mdi:television
layout: vertical
icon_color: brown
tap_action:
action: navigate
navigation_path: /lovelace-panel/stua
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-primary-text-color), 0.025);
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-top: -24px;
margin-bottom: 4px;
}
- type: custom:mushroom-template-card
primary: ''
secondary: Kjøkken
icon: mdi:silverware-variant
layout: vertical
icon_color: purple
tap_action:
action: navigate
navigation_path: /lovelace-panel/kjokken
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-primary-text-color), 0.025);
width: 66px;
border-radius: 30px;
margin-left: -5px;
margin-right: auto;
margin-top: -24px;
margin-bottom: 4px;
}
- type: custom:mushroom-template-card
primary: ''
secondary: Gang
icon: mdi:menu
layout: vertical
icon_color: cyan
tap_action:
action: navigate
navigation_path: /lovelace-panel/gang
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-primary-text-color), 0.025);
width: 66px;
border-radius: 30px;
margin-left: -10px;
margin-right: auto;
margin-top: -24px;
margin-bottom: 4px;
}
- type: custom:mushroom-template-card
primary: ''
secondary: Vaskerom
icon: mdi:washing-machine
layout: vertical
icon_color: pink
tap_action:
action: navigate
navigation_path: /lovelace-panel/vaskerom
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-primary-text-color), 0.025);
width: 66px;
border-radius: 30px;
margin-left: -15px;
margin-right: auto;
margin-top: -24px;
margin-bottom: 4px;
}
- type: custom:simple-weather-card
entity: ledig
name: ''
primary_info:
- wind_speed
- wind_bearing
- pressure
secondary_info:
- humidity
- precipitation_probability
- precipitation
card_mod:
style: |
ha-card {
box-shadow: none;
background: none;
padding: 0 28px 0 28px !important;
margin-left: 0px;
margin-right: 0px;
margin-top: 0;
margin-bottom: 0;
}
- type: grid
square: false
columns: 2
cards:
- type: custom:stack-in-card
mode: vertical
cards:
- type: custom:mushroom-template-card
primary: Autolys
secondary: null
icon: mdi:home-lightbulb-outline
icon_color: blue
card_mod:
style: |
ha-card {
padding-bottom: 0px !important;
}
- type: custom:stack-in-card
mode: horizontal
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
icon: mdi:party-popper
icon_color: grey
layout: vertical
secondary: Benjamin
tap_action:
action: call-service
service: scene.turn_on
service_data: {}
target:
entity_id: scene.party
card_mod:
style: |
ha-card {
box-shadow: none;
--card-secondary-font-size: 8px;
}
- type: custom:mushroom-template-card
icon: mdi:television
icon_color: grey
layout: vertical
secondary: Sebastian
tap_action:
action: call-service
service: scene.turn_on
service_data: {}
target:
entity_id: scene.chill
card_mod:
style: |
ha-card {
box-shadow: none;
--card-secondary-font-size: 8px;
}
- type: custom:mushroom-template-card
icon: mdi:stairs
icon_color: grey
layout: vertical
secondary: Lillestua
tap_action:
action: call-service
service: input_boolean.turn_on
service_data: {}
target:
entity_id: input_boolean.god_natt
card_mod:
style: |
ha-card {
box-shadow: none;
--card-secondary-font-size: 8px;
}
card_mod:
style: |
ha-card {
box-shadow: none;
}
card_mod:
style: |
ha-card {
padding: 2px;
background: #1a1a1a;
}
- type: custom:stack-in-card
mode: vertical
cards:
- type: custom:mushroom-template-card
primary: Scener
secondary: Alle
icon: mdi:home-lightbulb-outline
icon_color: blue
card_mod:
style: |
ha-card {
padding-bottom: 0px !important;
}
- type: custom:stack-in-card
mode: horizontal
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
icon: mdi:party-popper
icon_color: grey
layout: vertical
secondary: Party
tap_action:
action: call-service
service: scene.turn_on
service_data: {}
target:
entity_id: scene.party
card_mod:
style: |
ha-card {
box-shadow: none;
--card-secondary-font-size: 8px;
}
- type: custom:mushroom-template-card
icon: mdi:television
icon_color: grey
layout: vertical
secondary: Chill
tap_action:
action: call-service
service: scene.turn_on
service_data: {}
target:
entity_id: scene.chill
card_mod:
style: |
ha-card {
box-shadow: none;
--card-secondary-font-size: 8px;
}
- type: custom:mushroom-template-card
icon: mdi:weather-night
icon_color: grey
layout: vertical
secondary: God Natt
tap_action:
action: call-service
service: input_boolean.turn_on
service_data: {}
target:
entity_id: input_boolean.god_natt
card_mod:
style: |
ha-card {
box-shadow: none;
--card-secondary-font-size: 8px;
}
card_mod:
style: |
ha-card {
box-shadow: none;
}
card_mod:
style: |
ha-card {
padding: 2px;
background: #1a1a1a;
}