Mushroom Cards - Build a beautiful dashboard easily 🍄 (Part 1)

Yes this is definetly the problem.

Yes that looks like a 60 degree spike that changes the scale of the probe.

Try lower_bound and upper_bound to define the scale exactly.

I tried lower_bound and upper_bound but the line is still incorrect. Is there a way to delete the test setting (60 degrees) in the graph/for the records?.

I really don’t know how to do that :frowning: .

your only showing 24 hours, so it will start to be correct once time has past.

2 Likes

thank you very much :grinning:
it was the last thing that didn’t work on my desk dashboard now it’s finally aesthetically coherent

1 Like

How about showing it off here? :wink: :slight_smile:

I love this simple, compact, design! I’m trying to use your code but could use a little help on how you setup your input booleans and what your scenes do.

Figured out a way for you to do both.

You were on the right path with a script.
You need browser mod and the device needs to be registered with browser mod for this to work.

Test Card Config
type: custom:mushroom-template-card
primary: Hello, {{user}}
secondary: How are you?
icon: mdi:home
icon_color: |-
  {% if states('input_boolean.alarm_skip') == 'on' %}
    green
  {% else %}
  {% endif %}
tap_action:
  action: call-service
  service: script.test
  target: {}

Script Code (delay added to be able to see color change. Can be removed)
alias: Test
sequence:
  - service: input_boolean.toggle
    data: {}
    target:
      entity_id: input_boolean.alarm_skip
  - delay:
      hours: 0
      minutes: 0
      seconds: 5
      milliseconds: 0
  - service: browser_mod.navigate
    data:
      path: /lovelace/lounge
    target:
      device_id: c5b9282646c4fffe6d84ede882726e63
mode: single
1 Like

Not sure which input booleans you mean

  • input_boolean.vacuum_auto_start - helper to control automation/notifications I set for vacuum. On the card, it controls the icon color to display the current automation state on/off

  • input_boolean.vacuum_[room_name] - these are helpers to store preferences if the room should be cleaned or not with the “play-list” button. On the card, it controls the background color of the room button.

    • It is further utilized in a script that retrieves room settings for cleaning
Script
alias: Vacuum Selected Rooms
sequence:
  - service: vacuum.send_command
    data:
      command: app_segment_clean
      params:
        - segments: >-
            {%- set ns = namespace(ids=[]) %} {%- if
            is_state('input_boolean.vacuum_bathroom', 'on') %}
              {% set ns.ids = ns.ids + [24] %}
            {%- endif %} {%- if is_state('input_boolean.vacuum_bedroom', 'on')
            %}
              {% set ns.ids = ns.ids + [19] %}
            {%- endif %} {%- if is_state('input_boolean.vacuum_hallway', 'on')
            %}
              {% set ns.ids = ns.ids + [16] %}
            {%- endif %} {%- if is_state('input_boolean.vacuum_kitchen', 'on')
            %}
              {% set ns.ids = ns.ids + [22] %}
            {%- endif %} {%- if is_state('input_boolean.vacuum_living_room',
            'on') %}
              {% set ns.ids = ns.ids + [23] %}
            {%- endif %} {%- if is_state('input_boolean.vacuum_technical', 'on')
            %}
              {% set ns.ids = ns.ids + [18] %}
            {%- endif %} {%- if is_state('input_boolean.vacuum_toilet', 'on') %}
              {% set ns.ids = ns.ids + [17] %}
            {%- endif %} {%- if is_state('input_boolean.vacuum_veronika_room',
            'on') %}
              {% set ns.ids = ns.ids + [20] %}
            {%- endif %} {{ ns.ids }}
          repeat: "{{ states('input_number.vacuum_repeat_count') | int }}"
    target:
      entity_id: vacuum.roborock_s7_2
mode: single
icon: mdi:robot-vacuum

More details about how to retrieve room IDs here

In terms of scene.fan_20 , those are actually irrelevant. The entity card requires some entity to be set although I only need the entity (icon) to call a service. I didn’t find a better solution. Only note that if you use e.g., input_boolean for that, the icon on the card will gray out when input_boolean state is off.

There are still a few things on my vacuum card I want to tackle

  • hold_action on room buttons - this is supposed to initiate cleaning the selected room. The script I am calling includes a repeat parameter that should specify vacuum repeat count for which I am using input_number.vacuum_repeat_count. I however did not manage to retrieve its value with the template on the card. In other words, this doesn’t work on the card for action: call-service data param
    • repeat: "{{ states('input_number.vacuum_repeat_count') | int }}"
  • I thought about adding a badge to the “play-list” button to indicate how many rooms are selected
  • I want to remove the “pause” button and only display it instead of the “play” or “play-list” button depending on what is currently running
3 Likes

@spacekiek Or you could possibly use the input_number helper, set a range 0 to 100, and step size 20. Then the mushroom number card works as expected.

But you would need to figure out how to control your device with the helper.

2 Likes

Thank you so much, i will try it now

1 Like

Let me know how it goes! i like your nav bar a lot, so keen to see results :slight_smile:

1 Like

The code works great if I had to move between pages. But I should show a card via local_conditional_card when I tap on the icon and I would also like the shape to be colored to be sure of the touch.

you will need to have something that decides whether the icon is colored. that is what the input boolean is for. so then you just have a check to see if input boolean is on and if so color the icon.

not entirely sure what you mean by show a card via local_conditional_card. can you try and elaborate?

Vedi questo per local conditional card

the color resolves easily if you managed to get a status from the conditional card.

You are going to have to give me more details on exactly what you are trying to accomplish for me to help. based on your initial description i understood that what i provided solved your problem, as it navigates through multiple pages in lovelace + colors the icon.

You will need to explain the reason why you need the local conditional card.

I’ll explain better.

So, using the conditional card I linked before, it allows me to “simulate” navigation between pages but keeping the navigation bar at the bottom and the information card above.

If you see in the link I put above, those cards can appear and disappear by tapping on the icon and then deciding what to see from the popup menu of the navigation bar.

I hope I explained it well :frowning:

Ah i see. if you navigate with the normal lovelace navigation does the nav bar not stay? why do you need to simulate navigating between pages?

No, if you navigate between pages, it’s like going to a new dashboard with more tabs.

But you can make navigation work, except that when I have a certain tab shown, it highlights in the popup menu which tab I’m seeing.

Could you share your code for the top part of your dashboard with the users and weather info in it?

I’m trying to accomplish something similar without luck.

Thanks :wink:

1 Like