Are they in the on state?
How snappy does the dropdown feel? I would expect it to be a bit laggy, but I suppose I could be surprised by how fast HA and LAN communication are.
I can say there is no lag. Menus quickly responds to open and close actions. As for the lights, I use local tuya and various other brands but there is no lag as well while turning on the lights.
Hey,
could you please share your code for printer ink levels tab?
thanks
Here you go:
type: custom:layout-card
layout_type: masonry
layout: {}
cards:
- type: custom:mushroom-title-card
title: ''
subtitle: Printers
- type: custom:stack-in-card
cards:
- type: custom:layout-card
layout_type: custom:grid-layout
layout:
grid-template-columns: auto 33px
margin: '-4px -4px -8px -4px'
cards:
- type: custom:mushroom-template-card
primary: Colour Printer
entity: binary_sensor.sarahs_printer_online
secondary: '{{ ''Online'' if is_state(entity, ''on'') else ''Offline'' }}'
icon: >-
{{ 'mdi:printer' if is_state(entity, 'on') else 'mdi:printer-off'
}}
icon_color: '{{ ''light-blue'' if is_state(entity, ''on'') else ''disabled'' }}'
tap_action:
action: none
hold_action:
action: none
card_mod:
style: |
ha-card {
background: none;
--ha-card-box-shadow: 0px;
}
- type: custom:mushroom-template-card
entity: input_boolean.sarahs_printer_dropdown
primary: ''
secondary: ''
icon: >-
{{ 'mdi:chevron-down' if is_state(entity, 'off') else
'mdi:chevron-up' }}
icon_color: disabled
hold_action:
action: none
card_mod:
style: |
ha-card {
align-items: flex-end;
background: none;
--ha-card-box-shadow: 0px;
}
mushroom-shape-icon {
--shape-color: none !important;
}
- type: conditional
conditions:
- entity: input_boolean.sarahs_printer_dropdown
state: 'on'
card:
type: custom:stack-in-card
cards:
- square: false
columns: 2
type: grid
cards:
- type: custom:mushroom-template-card
entity: sensor.sarahs_printer_status
primary: Status
secondary: >-
{% set status = states(entity) | int %} {% if status == 3
%}
Idle
{% elif status == 4 %}
Printing
{% elif status == 5 %}
Warmup
{% else %}
Unknown
{% endif %}
icon: mdi:printer
icon_color: >-
{% set status = states(entity) | int %} {% if status == 3
%}
disabled
{% elif status == 4 %}
light-blue
{% elif status == 5 %}
red
{% else %}
disabled
{% endif %}
tap_action:
action: none
hold_action:
action: none
- type: custom:mushroom-template-card
secondary: |-
{% set tray = states(entity) | int %}
{% if tray == -3 %}
Full
{% else %}
Empty
{% endif %}
primary: Tray 1
icon: >-
{{ 'mdi:tray-full' if states(entity) | int == -3 else
'mdi:tray' }}
entity: sensor.sarahs_printer_paper_tray
icon_color: >-
{{ 'light-blue' if states(entity) | int == -3 else
'disabled' }}
tap_action:
action: none
hold_action:
action: none
- type: custom:layout-card
layout_type: custom:grid-layout
layout:
grid-template-columns: 130px auto
margin: '-4px -4px -8px -4px'
cards:
- type: custom:stack-in-card
cards:
- type: custom:mushroom-entity-card
entity: sensor.sarahs_printer_cyan_toner
icon_color: cyan
tap_action:
action: none
hold_action:
action: none
primary_info: name
secondary_info: state
name: Cyan
card_mod:
style: |
ha-card {
margin-right: -8px;
}
- type: custom:mushroom-entity-card
entity: sensor.sarahs_printer_yellow_toner
icon_color: yellow
tap_action:
action: none
hold_action:
action: none
primary_info: name
secondary_info: state
name: Yellow
card_mod:
style: |
ha-card {
margin-top: -8px;
margin-right: -8px;
}
- type: custom:mushroom-entity-card
entity: sensor.sarahs_printer_magenta_toner
icon_color: purple
tap_action:
action: none
hold_action:
action: none
primary_info: name
secondary_info: state
name: Magenta
card_mod:
style: |
ha-card {
margin-top: -8px;
margin-right: -15px;
}
- type: custom:mushroom-entity-card
entity: sensor.sarahs_printer_black_toner
icon_color: black
tap_action:
action: none
hold_action:
action: none
primary_info: name
secondary_info: state
name: Black
card_mod:
style: |
ha-card {
margin-top: -8px;
margin-right: -8px;
}
card_mod:
style: |
ha-card {
background: none;
--ha-card-box-shadow: 0px;
}
- type: custom:apexcharts-card
header:
show: false
series:
- entity: sensor.sarahs_printer_cyan_toner
name: Cyan
color: rgb(7, 188, 211)
show:
legend_value: false
- entity: sensor.sarahs_printer_yellow_toner
name: Yellow
color: rgb(252, 233, 64)
show:
legend_value: false
- entity: sensor.sarahs_printer_magenta_toner
name: Magenta
color: rgb(157, 44, 176)
- entity: sensor.sarahs_printer_black_toner
name: Black
color: rgb(7, 7, 7)
chart_type: radialBar
apex_config:
legend:
show: false
chart:
height: 265px
card_mod:
style: |
ha-card {
background: none;
--ha-card-box-shadow: 0px;
}
card_mod:
style: |
ha-card {
height: 306px;
}
Printer info is obtained via SNMP. This is for a HP LaserJet, but other brands should be similar.
binary_sensor:
- platform: ping
host: 192.168.10.77
name: Sarahs Printer Online
count: 1
scan_interval: 60
sensor:
- platform: snmp
name: "Sarahs Printer Cyan Max"
host: 192.168.10.77
baseoid: 1.3.6.1.2.1.43.11.1.1.8.1.2
accept_errors: true
scan_interval: 86400
- platform: snmp
name: "Sarahs Printer Magenta Max"
host: 192.168.10.77
baseoid: 1.3.6.1.2.1.43.11.1.1.8.1.3
accept_errors: true
scan_interval: 86400
- platform: snmp
name: "Sarahs Printer Yellow Max"
host: 192.168.10.77
baseoid: 1.3.6.1.2.1.43.11.1.1.8.1.4
accept_errors: true
scan_interval: 86400
- platform: snmp
name: "Sarahs Printer Black Max"
host: 192.168.10.77
baseoid: 1.3.6.1.2.1.43.11.1.1.8.1.1
accept_errors: true
scan_interval: 86400
- platform: snmp
name: "Sarahs Printer Cyan Level"
host: 192.168.10.77
baseoid: 1.3.6.1.2.1.43.11.1.1.9.1.2
accept_errors: true
scan_interval: 86400
- platform: snmp
name: "Sarahs Printer Magenta Level"
host: 192.168.10.77
baseoid: 1.3.6.1.2.1.43.11.1.1.9.1.3
accept_errors: true
scan_interval: 86400
- platform: snmp
name: "Sarahs Printer Yellow Level"
host: 192.168.10.77
baseoid: 1.3.6.1.2.1.43.11.1.1.9.1.4
accept_errors: true
scan_interval: 86400
- platform: snmp
name: "Sarahs Printer Black Level"
host: 192.168.10.77
baseoid: 1.3.6.1.2.1.43.11.1.1.9.1.1
accept_errors: true
scan_interval: 86400
- platform: snmp
name: "Sarahs Printer Status"
host: 192.168.10.77
baseoid: 1.3.6.1.2.1.25.3.5.1.1.1
accept_errors: true
scan_interval: 10
icon: mdi:printer
- platform: snmp
name: "Sarahs Printer Paper Tray"
host: 192.168.10.77
baseoid: 1.3.6.1.2.1.43.8.2.1.10.1.2
accept_errors: true
scan_interval: 60
icon: mdi:tray-full
- platform: template
sensors:
sarahs_printer_cyan_toner:
friendly_name: "Sarah's Printer Cyan Toner"
value_template: >-
{{ ( states("sensor.sarahs_printer_cyan_level") | int / states("sensor.sarahs_printer_cyan_max") | int * 100 ) | round (0) }}
unit_of_measurement: '%'
icon_template: mdi:grain
- platform: template
sensors:
sarahs_printer_yellow_toner:
friendly_name: "Sarah's Printer Yellow Toner"
value_template: >-
{{ ( states("sensor.sarahs_printer_yellow_level") | int / states("sensor.sarahs_printer_yellow_max") | int * 100 ) | round (0) }}
unit_of_measurement: '%'
icon_template: mdi:grain
- platform: template
sensors:
sarahs_printer_magenta_toner:
friendly_name: "Sarah's Printer Magenta Toner"
value_template: >-
{{ ( states("sensor.sarahs_printer_magenta_level") | int / states("sensor.sarahs_printer_magenta_max") | int * 100 ) | round (0) }}
unit_of_measurement: '%'
icon_template: mdi:grain
- platform: template
sensors:
sarahs_printer_black_toner:
friendly_name: "Sarah's Printer Black Toner"
value_template: >-
{{ ( states("sensor.sarahs_printer_black_level") | int / states("sensor.sarahs_printer_black_max") | int * 100 ) | round (0) }}
unit_of_measurement: '%'
icon_template: mdi:grain
You could try setting the border radius like this:
:host {
--mush-icon-size: 100px;
height: 66px;
margin-left: -22px !important;
margin-top: -4px !important;
border-radius: var(--ha-card-border-radius);
}
You can set the --icon-symbol-size like this:
type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: ''
secondary: Scenes
icon: phu:scene-relax
layout: vertical
icon_color: blue
tap_action:
action: navigate
navigation_path: scenes
card_mod:
style: |
mushroom-shape-icon {
--shape-color: none !important;
--shape-color-disabled: none !important;}
ha-card {
background: transparent;
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-bottom: 2px;
--icon-symbol-size: 55px;
}
card_mod:
style: |
ha-card {
padding: 2px;
background: rgba(var(--rgb-primary-text-color), 0.01);
--ha-card-background: transparent;
}
That worked, thank you.
Do you know if it’s possible to do 2 actions in a mushroom card like this? I’m trying to use navigate inside of a pop-up card but the only way for it to work seamlessly is for the pop-up to be closed automatically otherwise the user has to do it. The way I did this didn’t work.
- type: custom:mushroom-template-card
primary: ''
secondary: Secure
icon: phu:reolink-842
layout: vertical
icon_color: red
tap_action:
- action: navigate
navigation_path: cameras
- action: fire-dom-event
browser_mod:
command: close_popup
deviceID:
- this
picture: local/icons/custom_icons/camera.svg
You can’t with entity card, use template card instead.
You could try using a script…
It’s possible to do navigate in a script? How does it know the device requesting that?
Hey John, try this:
type: custom:mushroom-template-card
layout: vertical
secondary: 'Battery: {{ state_attr(entity, "battery") }}%'
entity: lock.front_door_lock_2
primary: |
{% if is_state(entity, 'unlocked') %}
Door is Unlocked
{% else %}
Door is Locked
{% endif %}
icon_color: |
{% if is_state(entity, 'unlocked') %}
red
{% else %}
green
{% endif %}
icon: |
{% if is_state(entity, 'unlocked') %}
mdi:lock-open
{% else %}
mdi:lock
{% endif %}
card_mod:
style: |
ha-card {
background-color: {{ 'rgba(255, 255, 255, 0.1)' if is_state('lock.front_door_lock_2', 'unlocked') else 'rgba(147, 227, 215, 0.5)' }};
height:125px !important;
}
mushroom-shape-icon {
{{ 'animation: blink 1.3s ease-in-out infinite;' if is_state('lock.front_door_lock_2', 'unlocked') }}
}
@keyframes blink {
50% {opacity: 0.1;}
}
Yes that’s perfect!!! Thank you!!!
I love this mushroom card!!
Wow that looks beautiful! Do you have the full yaml shared anywhere? Particularly interest in the scenes bar, room card and detailed room view as those look spot on!
nice work!
Can you share your code from the temperature card?
Thanks
Is it possible to show conditional chips card for just given users? I have some conditional chips cards which shows if there is any HACS or HA update available, but I want to show it if a user with admin privilege is opened the HA front page, or if a given user opens it, but hide these chips when rest of my family open HA dashboard.
Scenes bar is part of my Welcome card, previously shared here:
Room card is shared here:
Temperature/Humidity card is shared here: