Custom Lovelace Card - Homekit style card

Hi,
Van you share more of you config with the homekit card config?

What do you mean with html tag? Can you share an example with html tag?

Sure. Here ist the complete card. I think I fixed the error but now I have a blank screen. I think the “buttons” are not loading.

                  - title: Haus
                    entities:
                      - entity: lock.haustur
                        popup:
                          type: custom:switch-popup-card
                          noActiveState: '-'
                          entity_value_path: state
                          entities:
                            - entity: lock.haustur
                          buttons:
                            - icon: "mdi:lock-open"
                              value: "unlocked"
                              name: "öffnen"
                              color: "#FFF"
                              icon_color: "rgba(255,255,255,1)"
                              service: lock.unlock
                              service_data:
                              entity_id: lock.haustur
                            - icon: "mdi:lock"
                              value: "locked"
                              name: "schließen"
                              color: "#FFF"
                              icon_color: "rgba(255,255,255,1)"
                              service: lock.lock
                              service_data:
                              entity_id: lock.haustur

Just looked again on the example code and tried it on my installation with my Nuki Lock.

This one is working for me:

                      - entity: lock.dahoam
                        popup:
                          type: 'custom:switch-popup-card'
                          noActiveState: '-'
                          entity_value_path: state
                          entities:
                            - lock.dahoam
                          buttons:
                            - icon: 'mdi:lock-open'
                              value: unlocked
                              name: Open
                              color: '#FFF'
                              icon_color: 'rgba(255,255,255,1)'
                              service: lock.unlock
                              service_data: null
                              entity_id: this
                            - icon: 'mdi:lock'
                              value: locked
                              name: Dicht
                              color: '#FFF'
                              icon_color: 'rgba(255,255,255,1)'
                              service: lock.lock
                              service_data: null
                              entity_id: this
                        icon: 'mdi:door'
                        name: HaustĂŒr
                        offIcon: 'mdi:door-open'
                        offState:
                          - unlocked

and i also had that issue with the blank screen, but in chrome dev tools i saw that the card couldn’t be loaded. Seems that HACS had issues to add the module to the Lovelace ressources, had to reinstall it

Ahhh found the problem. The solution is to add “null” in the service_data line. Your code worked 1:1 to me now. Thank You!

                              service_data: null

Hi, did groups functionality get added as I’m struggling to make this work?

Is it possible to remove all this wasted space normally used for text at the bottom of the radar map card? every card with a camera or a photo has nearly half its space being whitespace and makes the row nearly twice as big as needed:

Hey @DBuit Did you manage to find out if it’s possible to add wider/higher tiles, why the hold action in my example is not working and if we can align tiles more (see example i am replying on)?

Please let me know if I can help you with explaining better,
Thanks for your great work

Hi @DBuit, I created a media tile. I would like to be able to change the image and use the entity_picture attribute image. Is this possible?

When putting the light card in a popup on a swipe card, it works flawlessly on my mobile device. However, in chrome on the desktop, I loose ability to move the slider 

Anyone experenced the same issue ?

Nice design of the popup. Could you please share your config?

Hi guys,

i have some great news! I became a father this week :baby:
I won’t be able to work on my cards. If you have any request for cool new stuff or have a bug please add an issue on github https://github.com/DBuit/Homekit-panel-card

6 Likes

First of all, congratulations to you. I hope your child and wife/girlfriend are healthy. Enjoy it!
Secondly: The card popup is not working anymore since the new home assistant version. Can you take a look at it? An issue has already been placed on github

Gratz man! Being a father i know how awesome that is.

Congrats
Nice

Congratulations, hopefully everything is fine with the child and wife :slight_smile: Almost a year ago (2 days left) on the hottest day in the Netherlands i became also a father, one of the greatest things in life!

Congrats dad.

Can anyone help with the conditionalClass
 I would like to turn the button red if my light becomes unavailable and am having trouble getting it to work
 what would I put in the VAR line to get the state of my light?

Hello,

Thanks everyone.

Just for people who are using popups in the card. This is build with the use of card-tools.
And with version 0.103 everything about the popup changed so the card-tools and browser-mod is not working.

I know browser-mod got a fix released but the card-tools not yet. when this is available i will update the card so it keeps working.

Hi,

You could do something like this:

conditionalClass: >
      [[[
        if (states['light.beganegrond'].state == 'unavailable')
          return "redtile";
        else
          return "";
      ]]]

And you need to add some css style for the redtile class in the style configuration of the card.

1 Like