ofekashery / vertical-stack-in-card

📐 Home Assistant Card: Group multiple cards into a single sleek card.
MIT License
896 stars 79 forks source link

Card border shown when conditional card is used #138

Open Kire88Visser opened 2 years ago

Kire88Visser commented 2 years ago

When using the conditional card the card that is displayed when the condition is true has a border around it (see below for the TV and fridge icons). 2022-11-05 13_44_29-New dashboard – Home Assistant

Also occasionally when loading the HA page the borders appear around all the cards that are within the vertical stack in card. Reloading often removes the borders again, but never for the conditional card.

SinisterMedusa commented 2 years ago

I’m having the same issues, more in general the borders are shown whenever the stack in card is nested inside any type of card. If you are using CARD_MOD you can manually solve the problem using the following card_mod style in the nested card:

type: custom:vertical-stack-in-card
card_mod:
  style: |
    ha-card {
      border: none;
    }
Tontze commented 1 year ago

This seems to be working if you dont have any themes enabled :/

In configuration window where theme does not apply : kuva

And in desktop after saving : kuva

alanmilinovic commented 1 year ago

I’m having the same issues, more in general the borders are shown whenever the stack in card is nested inside any type of card. If you are using CARD_MOD you can manually solve the problem using the following card_mod style in the nested card:

type: custom:vertical-stack-in-card
card_mod:
  style: |
    ha-card {
      border: none;
    }

Not working for me, as soon as sensor is updated, card is redrawn and border appears.

itspt1 commented 1 year ago

@Kire88Visser Hey, off-topic but, which weather card is that? It looks nice.

Kire88Visser commented 1 year ago

@itspt1 its the clock weather card: https://github.com/pkissling/clock-weather-card

bcutter commented 1 year ago

Can this be fixed in vertical-stack-in-card? Maybe by passing a config option borders: true|false ?

alanmilinovic commented 1 year ago

This is how I fixed it, but not by putting it on vertical-stack-in-card, I use it on cards that are having the actual border. I am not using card_mod and this is the only solution that worked for me.

style: |
    ha-card {
      border: 0px;
    }
tofrie commented 1 year ago

I have the same issue.. style won‘t work for me:

  - type: conditional
    conditions:
      - entity: sensor.time_to_new_fire_wood_living_room
        state_not: '0:00:00'
      - entity: sensor.phase_living_room
        state_not: Standby
    card:
      type: custom:mushroom-entity-card
      entity: sensor.time_to_new_fire_wood_living_room
      name: Zeit zum Nachlegen
      icon: mdi:clock-outline
      primary_info: state
      secondary_info: name
      style: |
        ha-card {
          border: 0px;
        }
tofrie commented 1 year ago

Looks like:

87C39A05-5F6F-4894-AAE7-01A67B9D5BBE

alanmilinovic commented 1 year ago

Looks like:

87C39A05-5F6F-4894-AAE7-01A67B9D5BBE

I also have it from time to time, for example when HA is warming after reboot. I just close HA and reopen it.

Also have you placed style on correct element? Have you cleared browser cache?

tofrie commented 1 year ago

I posted my code snippet above. The condition is part of vertical stack. The style is placed in the card with border. I tried different browser and HA App on iPhone.

alanmilinovic commented 1 year ago

I posted my code snippet above. The condition is part of vertical stack. The style is placed in the card with border. I tried different browser and HA App on iPhone.

Try to put it on vertical-stack-in-card then. I don't know, in my case it worked well.