Vertical-stack-in-card

Configuration Frontend
1

hi, i’ve a problem with vertical-stack-in-card, i try to integrate bluiris and then i want to view my cams on ha, but i get this error:

Custom element doesn't exist: vertical-stack-in-card.
type: 'custom:vertical-stack-in-card'
cards:
  - type: horizontal-stack
    cards:
      - type: 'custom:vertical-stack-in-card'
        cards:
          - type: picture-entity
            entity: camera.all
            name: All
            show_state: false
      - type: 'custom:vertical-stack-in-card'
        cards:
          - type: picture-entity
            entity: camera.cycle
            name: Cycle
            show_state: false
  - type: entities
    title: Blue Iris
    show_header_toggle: false
    entities:
      - entity: switch.blueiris_alerts
        name: Arm / Disarm

  - url: /community_plugin/vertical-stack-in-card/vertical-stack-in-card.js?v=0.1.3
    type: module

where i do wrong?
thanks

2

Have the same problem.
Only started after upgrading to 0.107.

I have tried reverting back to 0.106 and the vertical-stack-in-card was working fine, therefore this should be definitely a problem with the new upgrade.

Hopefully someone will put some light on this.

3

after a blueiris component update, i’ve this situation:

Screenshot
Screenshot1584×227 14.7 KB

i’m very confused :slight_smile:

4

Hey,
Can I ask how did you install the vertical-stack-in-card, i.e via HACS or differently?

So far, I had it downloaded and installed from github as a custom component and started noticing the error after upgrade to 0.107.
After this issue, I have tried installing the same card via HACS and it looks like the error has disappeared.

5

Only from hacs :frowning:

6

You are right.
I found the card behave the same after restart. Ended up on downgrading HA to 0.106.6. All good now.

7

So do you think it’a custom card bug?

8

Possibly.
Looks like the custom card may need an update for HA 0.107.xxx.
Hopefully some HA guru will confirm this.

9

I’m new to Home Assistant and the corresponding terminology.

Getting the same error; i.e. “custom element doesn’t exist: vertical-stack-in-card”

When you say you have installed via HACS do you mean the “Home Assistant Community Add-ons” available in Supervisor | Add-On start

I can’t find anything called “vertical-stack-in-card”. Also there are only 44 community add-ons which seems a low number. Am I using a subset?

My installation runs on VirtualBox. I used the VMDX image from the Home assistant website.

Wondering…

10

Just a quick update that I found the answer. HACS was not installed and I had to install it manually from GutHub. All good now

11

All,

I’ve the same problem after upgrading to 2021.3.4. Tried to install it via HACS and locally, tested also all different versions how to reference to it via resources, but still get the error. Any ideas would be very much appreciated.

Thanks!

12

The same behaviour here with latest version and via HACS

2 Likes
13

Have recently updated this card to v0.4 and my card used to be completely transparent but now isn’t. Any idea what code I need to use now to make it transparent again? I believe this change happened between v 0.3.1 to v0.3.2 and above but not 100% sure. My code is:

type: custom:vertical-stack-in-card
style: |
  ha-card {
    box-shadow: none;
    background: none;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
  }
styles:
  card:
    - background: none
    - background-color: rgba(0,0,0,0)
cards:

I used to only use the following to make it transparent:

type: custom:vertical-stack-in-card
style: |
  ha-card {
    box-shadow: none;
    background: rgba(0,0,0,0);
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
  }
cards:
14

Did you find a solution?
I sat for hours trying to faciliate border-radius for custom:button-cards within a vertical-stack-in-card, but every time it gets overwritten to be 0px. No use trying with card_mod:… same result.
Annoying.

15

try this, thou i have this in my theme, but should work the same on the card

  ha-card-border-radius: "40px"
  ha-border-color: "#87BF50"
  ha-border: "solid 2px #87BF50"

backg

           card_mod:
              style: |
                ha-card {
                  color: #F7AA1C; border: solid 2px #87BF50; box-shadow: none;
                }

PS: sorry, just realized i used “plain” vertical-stack, but can’t see why they should “remove” default behavior

16

regarding background, as i have no pic-background i set

  ha-card-background: '#2E2E2E'
  card-background-color: 'var(--ha-card-background)'

… try with ‘transparent’ instead of ‘#color’

17

Thank you for your hints.
ha-card-border-radius works within the card_mod…statement, but ofc it styles the enclosing stack-in-card, not the button-card itself. A pity!

Using the plain/builtin vertical-stack I have no problem styling the button-cards, but then I can’t get rid of the gap betweeen the cards, especially if I switch some off (with display: none) - the buttons are gone but their padding/margin/whatever remains. Old/known vertical-stack problem and maybe the reason for developing the vertical-stack-in-card in the first place…

And I had no luck with the transparent background either. Maybe I should start anew, placing my buttins within a layout-card or whatnot…

18

hmmm, the “card-mod” doesn’t even “bite”, if you place it direct under " -type: custom:button-card " ? , but ur right, getting rit of “gaps” is a pain …
… keep searching in the forum, then you might get more ideas, and hints … and as you and benm7 above, don’t provide any example (pic) of what you are trying to accomplice, it’s hard to suggest anything ! … might even be a " custom:paper-buttons-row " you are looking for, or a mix/merge of multiple cards(cards within cards within cards), depending how you wanna design your View