search

DBuit / light-popup-card

Lovelace card to use as custom pop-up for light in homekit style
168 stars 38 forks source link

How do I configure this with the homekit panel card mod? #88

Closed Markobu98 closed 2 years ago

Markobu98 commented 2 years ago

Hey,

This might seem like a stupid question but how does a lovelace ui yaml look like that has set up the homekit panel card mod and the light popup card mod together. So far I have just set up the homekit panel card mod and my yaml looks like this:

`  - theme: Backend-selected
    icon: mdi:sofa
    path: wohnzimmer
    type: custom:horizontal-layout
    layout:
    width: 300
    max_cols: 3
    badges: []
    cards:
      - type: custom:homekit-card
        enableColumns: true
        statePositionTop: true
        titleColor: '#FFF'
        style: |
          :host {
            --tile-background: rgba(255, 255, 255, 0.8);
            --tile-border-radius: 12px;
            --tile-width: 100px;
            --tile-height: 100px;
            --tile-on-background: rgba(255, 255, 255, 1);

            --tile-name-text-color: rgba(0, 0, 0, 0.4);
            --tile-on-name-text-color: rgba(0, 0, 0, 1);

            --tile-state-text-color: rgba(0, 0, 0, 0.4);
            --tile-on-state-text-color: rgba(0, 0, 0, 1);

            --tile-state-changed-text-color: rgb(134, 134, 134);
            --tile-unavailable-state-text-color: rgba(255, 0, 0, 1);

            --tile-value-text-color: rgba(255, 0, 0, 1);

            --tile-icon-color: rgba(0, 0, 0, 0.3);
            --tile-on-icon-color: #f7d959;

            --tile-width-mobile: 90px;
            --tile-height-mobile: 90px;

            --min-header-height: 150px;

            --tile-icon-size: 30px;

            --tile-image-radius: 100%

            --slider-width: 120px;
            --slider-height: 120px;
          }
        rows:
          - row: 1
            columns:
              - column: 1
                tileOnRow: 4
                entities:
                  - title: Lichter
                    entities:
                      - entity: light.light_bars
                      - entity: light.kugel
                      - entity: light.schuhschrank`

And the ui looks like this: image

But if I hold the button it just brings up the default more info of ha. How do I set this up so that the hold action will bring up the light popup card?