search

custom-cards / decluttering-card

🧹 Declutter your lovelace configuration with the help of this card
MIT License
370 stars 30 forks source link

box-shadow on the wrong div when using the card? #3

Closed chenchen119 closed 5 years ago

chenchen119 commented 5 years ago

I am having a weird problem where using the decluttering card with vertical-stack-in-card would not show the standard box-shadow that comes with every card on the UI.

image

Example below:

  - type: 'custom:vertical-stack-in-card'
    cards:
      - type: horizontal-stack
        cards:
          - type: 'custom:button-card'
            entity: light.home_theatre
            icon: 'mdi:movie-roll'
            name: Pot lights
            layout: icon_name
            styles:
              card:
                - height: 88px
                - width: 180px
              name:
                - font-size: 15px
                - font-weight: bold
                - text-transform: uppercase
          - type: entities
            entities:
              - type: 'custom:slider-entity-row'
                entity: light.home_theatre
                icon: 'mdi:lamp'
                full_row: true
                hide_state: true
  - type: 'custom:decluttering-card'
    template: dimmer_button_slider
    variables:
      - entity: light.home_theatre
      - icon: movie-roll
      - name: Pot lights

The decluttering_card_template:

decluttering_templates:
  dimmer_button_slider:
    type: 'custom:vertical-stack-in-card'
    cards:
      - type: horizontal-stack
        cards:
          - type: 'custom:button-card'
            entity: '[[entity]]'
            icon: 'mdi:[[icon]]'
            name: '[[name]]'
            layout: icon_name
            styles:
              card:
                - height: 88px
                - width: 180px
              name:
                - font-size: 15px
                - font-weight: bold
                - text-transform: uppercase
          - type: entities
            entities:
              - type: 'custom:slider-entity-row'
                entity: '[[entity]]'
                icon: 'mdi:[[icon]]'
                full_row: true
                hide_state: true

Tested it with button-card and works fine. When I did a dev inspect, it seems the box-shadow is set on a lower div.. that is as much I can check..

Just tested on 0.2.0 as well.

RomRider commented 5 years ago

I issued a PR today to vertical-stack-in-card for weird problems when used with decluttering-card. It's not part of a release yet as I don't control the repository over there but it has been merged in the master branch.

Could you please try to replace the vertical-stack-in-card file you have with the one from the master branch? Don't forget to clear your cache :)

chenchen119 commented 5 years ago

I issued a PR today to vertical-stack-in-card for weird problems when used with decluttering-card. It's not part of a release yet as I don't control the repository over there but it has been merged in the master branch.

Could you please try to replace the vertical-stack-in-card file you have with the one from the master branch? Don't forget to clear your cache :)

Yes, added your one liner to the card and that did it :)

RomRider commented 5 years ago

Amazing :)