I’m sorry if that came of aimed at you! It wasn’t! 
I took “person” as a search because I was looking for a person card (still am), and so I thought it might be a good idea to remind people of the thread search. That’s all!
1 Like
I too have been looking for ideas for a person card all over. One thing, I wanted to integrate a map but we don’t go out to work so that seemed redundant, so I can’t up with the idea to have a conditional map card if someone isn’t home. Beyond that, it all seems a bit lacking.
Please post if you are blessed with inspiration.
Interesting idea, that is my problem, too. My wife an me both do work-from-home, so a map is something I’d only occasionnaly need.
If I stumble upon something, I’ll let you know for sure! For now I’m trying to find a good generator for Memojis, still don’t own any Apple device. 
script.bathroom_fan_timer
script:
start_fantimer:
sequence:
- delay: "00:{{ states('input_number.toiletfan_input') | int }}:00"
- data:
entity_id: fan.toilet_fan
service: fan.turn_off
am I wrong? right?
Thanks a lot …
2 Likes
Are you asking about scripting? If so, this isn’t the topic, try searching the forum to see what questions people have asked before.
Best of 
1 Like
You are right, thanks again
1 Like
im trying to use your code to make a navigation bar but without any success with the dropdown menu
type: custom:stack-in-card
mode: horizontal
card_mod:
style: |
ha-card { border-radius: 50px;
background: rgb(45, 45, 45);}
:host {
position: sticky;
bottom: 5px;
cards:
- type: custom:layout-card
layout_type: grid
layout:
grid-template-columns: 60% 40%
grid-template-rows: auto
grid-template-areas: |
"eins1 zwei2"
cards:
- type: custom:stack-in-card
mode: horizontal
view_layout:
grid-area: eins1
card_mod:
style: |
ha-card { border-radius: 50px;
background: rgb(208, 208, 208);
box-shadow: none;
cards:
- type: custom:layout-card
layout_type: grid
layout:
grid-template-columns: 90% 10%
grid-template-rows: auto
grid-template-areas: |
"eins zwei"
card_mod:
style: |
ha-card {
background: rgb(208, 208, 208);
box-shadow: none;
cards:
- type: custom:mushroom-template-card
view_layout:
grid-area: eins
icon_color: black
icon: mdi:home
primary: TO CHANGE TO VIEW NAME
entity: input_select.select_option
tap_action:
action: toggle
hold_action:
action: more-info
card_mod:
style: |
ha-card {
background: rgb(208, 208, 208);
box-shadow: none;
--spacing: 8px;
--icon-size: 35px;
--primary-text-color: rgb(var(--rgb-black));
}
mushroom-shape-icon {
--shape-color: none !important;
}
- type: custom:mushroom-chips-card
view_layout:
grid-area: zwei
chips:
- type: template
card_mod:
style: |
ha-card {
position: absolute;
right: 0px;
top: 10px;
background: green;
box-shadow: none;
}
entity: input_select.menu
double_tap_action:
action: none
icon_color: white
icon: mdi:chevron-up
tap_action:
action: more-info
hold_action:
action: more-info
- type: custom:stack-in-card
mode: horizontal
view_layout:
grid-area: zwei2
card_mod:
style: |
ha-card { border-radius: 50px;
background: rgb(45, 45, 45);
box-shadow: none;}
cards:
- type: custom:mushroom-entity-card
tap_action:
action: navigate
navigation_path: home
entity: person.eduardo_martins
layout: horizontal
primary_info: none
secondary_info: none
icon_color: blue
icon: mdi:home
- type: custom:mushroom-entity-card
entity: alarm_control_panel.alarmo
layout: horizontal
primary_info: none
secondary_info: none
icon_color: green
icon: mdi:shield-home
- type: custom:mushroom-entity-card
tap_action:
action: navigate
navigation_path: Garagem
entity: input_button.kameras
layout: horizontal
primary_info: none
secondary_info: none
icon_color: blue
icon: mdi:video
Hi. I’m having problems with aligning my chips at the bottom of my card. They are aligning to the left of the card and I’d like them more centered. Please see attached picture and code for clarification. Any idea what I can try to resolve? I’ve tried changing the “alignment” on both chips.
type: custom:stack-in-card
mode: vertical
cards:
- type: custom:mushroom-person-card
entity: person.eric
use_entity_picture: true
hide_name: true
hide_state: true
layout: vertical
tap_action:
action: more-info
browser_mod:
command: popup
deviceID: eric_pc
title: Eric
card:
type: custom:mod-card
style: |
ha-card {
padding-right: 45px;
padding-left: 45px;
padding-bottom: 45px;
}
- type: custom:mushroom-chips-card
style: |
ha-card {
--chip-box-shadow: none;
--chip-background: none;
--chip-spacing: none;
--chip-height: 33px
}
chips:
- type: entity
entity: sensor.eric_iphone_zone_distance
icon_color: blue
icon: mdi:navigation-variant-outline
card_mod:
style: |
ha-card {
box-shadow: 0px 0px;
}
alignment: center
- type: entity
entity: sensor.erics_iphone_battery_level
icon_color: blue
card_mod:
style: |
ha-card {
box-shadow: 0px 0px;
}
alignment: center
1 Like
Here you have corrected
type: custom:stack-in-card
mode: vertical
cards:
- type: custom:mushroom-person-card
entity: person.eric
use_entity_picture: true
hide_name: true
hide_state: true
layout: vertical
tap_action:
action: more-info
browser_mod:
command: popup
deviceID: eric_pc
title: Eric
card:
type: custom:mod-card
style: |
ha-card {
padding-right: 45px;
padding-left: 45px;
padding-bottom: 45px;
}
- type: custom:mushroom-chips-card
card_mod:
style: |
ha-card {
--chip-font-size: 0.25em;
--chip-icon-size: 0.5em;
--chip-border-width: 0;
--chip-box-shadow: none;
--chip-background: none;
--chip-border: none;
--chip-spacing: none;
--chip-font-weight: normal;
}
alignment: center
chips:
- type: entity
entity: sensor.eric_iphone_zone_distance
icon_color: blue
icon: mdi:navigation-variant-outline
card_mod:
style: |
ha-card {
box-shadow: 0px 0px;
}
- type: entity
entity: sensor.erics_iphone_battery_level
icon_color: blue
card_mod:
style: |
ha-card {
box-shadow: 0px 0px;
}
1 Like
That fixed it!! Thank you so much. I see the changes you made, but would you mind explaining what it did? Thank you!!
Any recommendation how to have distinct colors for background vs the cards?
what device does this fan switch control?
Hi danwooller,
thanks, found the wrong bracket!
But this also changes the icon and the shape. Looks then like that:
Is there a way without resize the icon?
Thanks!
- type: custom:mushroom-chips-card
chips:
- type: template
entity: cover.screenlinks
icon: |-
{{ iif(is_state(entity, 'open'), 'mdi:blinds-open', 'mdi:roller-shade-closed') }}
icon_color: |-
{{ iif(is_state(entity, 'open'), 'white', 'grey') }}
How can I set the position of the cover to 80 when opening ?
You have to put @ in front of their name so they get a notification.
Try
card_mod:
style:
mushroom-shape-icon$: |
.shape {
width: calc(var(--icon-size) * 2) !important;
}
.: |
ha-card {
# margin-top: -12px;
--icon-border-radius: 12px;
#--icon-size: 50px;
#margin-top: -12px;
#margin-left: -52px;
}
I have been trying to create a heating card for each room using some of the great examples in here. I have gotten this far, but am stuck on how to close the gaps between the cards, and also how to make the font size of the temperature and when the automation was last triggered
type: custom:stack-in-card
mode: horizontal
cards:
- type: custom:stack-in-card
cards:
- type: custom:mushroom-climate-card
entity: climate.living_room_radiator
show_temperature_control: false
layout: vertical
name: Living Room
icon: mdi:sofa
primary_info: none
secondary_info: none
double_tap_action:
action: more-info
- type: custom:mushroom-chips-card
chips:
- type: template
icon: ''
icon_color: ''
content: >-
{{ states('sensor.living_room_temperature_sensor_temperature')
}}°C
- type: entity
entity: automation.trv_valve_living_room_radiator
content_info: last-updated
icon: ''
use_entity_picture: false
icon_color: red
alignment: center
- type: custom:stack-in-card
cards:
- type: custom:mushroom-climate-card
entity: climate.living_room_radiator
show_temperature_control: true
layout: vertical
name: Living Room
icon_type: none
primary_info: none
secondary_info: none
double_tap_action:
action: more-info
- type: custom:mushroom-chips-card
chips:
- type: template
icon: mdi:pipe-valve
icon_color: blue
content: '{{ states(''sensor.living_room_trv_battery_level'') }}'
- type: template
icon: mdi:battery
icon_color: green
content: '{{ states(''sensor.living_room_temperature_sensor_battery'') }}%'
- type: template
icon: mdi:battery-bluetooth
icon_color: green
content: '{{ states(''sensor.living_room_trv_battery_level'') }}%'
alignment: center
3 Likes
Im not the best person for that, but essentially it creates a new group and it calls card mod to implement the styles
Not an answer to your question but I have been using this same room card config and it causes my tablet to lag or become unresponsive after a few mins. Works great on phone and PC, have you experienced the same issue?
Here is how I make my light flash if a light is on.
card_mod:
style:
mushroom-shape-icon$: |
.shape {
{% if is_state(config.entity, 'on') %}
{% if state_attr(config.entity, 'rgb_color') == none %}
--icon-color: rgb(255,190,137) !important;
--shape-color: rgb(255,190,137, 0.2 ) !important;
--icon-animation: illumination 1s infinite;
}
@keyframes illumination {
0%, 100% { clip-path: inset(0 0 0 0); }
80% { clip-path: polygon(0% 99%, 20% 55%, 22% 37%, 39% 20%, 61% 21%, 77% 35%, 79% 57%, 99% 100%); }
}
{% else %}
{% set r = state_attr(config.entity, 'rgb_color')[0] %}
{% set g = state_attr(config.entity, 'rgb_color')[1] %}
{% set b = state_attr(config.entity, 'rgb_color')[2] %}
--icon-color: rgb( {{r}}, {{g}}, {{b}} ) !important;
--shape-color: rgba( {{r}}, {{g}}, {{b}}, 0.2 ) !important;
{% endif %}
{% endif %}
Here is a link to my discussion form on my issue if anyone can help.
1 Like
Good evening, tell me how to make the icon blink when the motion sensor detects
type: custom:mushroom-template-card
icon: none
icon_color: blue
primary: Зал
secondary: |-
{% set temperature = "sensor.ms_zal_temperature" %}
{% set humidity = "sensor.ms_zal_humidity" %}
{{ states(temperature) | round(1) }}°c
{{ states(humidity) | round(1) }}%
card_mod:
style:
mushroom-shape-icon$: |
.shape:after {
font-size: 21px;
content: '📺';
animation: boing 3s ease infinite;
transform-origin: 50% 90%;
}
ha-icon {
width: 0px !important;
}
@keyframes boing {
0% { transform: scale3d(1, 1, 1); }
7% { transform: scale3d(1.25, 0.75, 1); }
10% { transform: scale3d(0.75, 1.25, 1); }
12% { transform: scale3d(1.15, 0.85, 1); }
16% { transform: scale3d(0.95, 1.05, 1); }
19% { transform: scale3d(1.05, 0.95, 1); }
25% { transform: scale3d(1, 1, 1); }
}
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
title: HTML content
content:
type: entities
entities:
- entity: automation.distantsiia_test
- entity: automation.zavesti_dvigatel_mazda_v_3_00
- entity: automation.zavesti_dvigatel_mazda_v_6_00
- entity: switch.kalitka_relay2
name: Открытие ворот
icon: mdi:garage
- entity: sensor.time_to_work
title: Автомобиль
show_header_toggle: false
state_color: true