Issue with button-card and vertical-stack-in-card

I have a simple button-card inside a vertical-stack-in-card.
The button-card is quite simple.

   - type: custom:vertical-stack-in-card
     cards:  
       - type: horizontal-stack
         cards:
          - type: "custom:button-card"
            entity: input_boolean.xxxxx
            name: NIGHT
            template: button_scene   

Where the template just defines some styles.

     button_luci_scene:
       styles:
         card:
           - border-radius: 15px
       state:
           - value: 'on'
             styles:
               card:
                 - border: solid 2px var(--accent-color)
                 - box-shadow: 0px 0px 10px 1px var(--paper-item-icon-active-color)

The card works fine clicking on it.
The card doesn’t work when the input_boolean.xxxx is set to on and I open the page. In this case the card style is not applied.

Using the same card with the standard vertical-stack works fine in all cases.

   - type: vertical-stack  
     cards:  
       - type: horizontal-stack
         cards:
          - type: "custom:button-card"
            entity: input_boolean.xxxxx
            name: NIGHT
            template: button_scene

Here the difference:

Can the button-card work with the vertical-stack-in-card?

I personally avoid the vertical-in-stack card. Historically, it has had nothing but random problems. Why do you want to use the vertical-in-stack card? There are solutions that exist that essentially get you the same look without using the vertical-in-stack card.

@petro Thanks for the feedback.
Essentially I am using the vertical-stack-in-card to have that look.
Which are the alternatives? card-mod?

the alternative is to use an entities card and place custom: cards into the entities list. Then remove the shadow/background styling of the card placed into the entities list. This requires card mod, and you need to use all custom cards or hui elements (which are the non-custom cards, but with under the hood names that don’t make sense).

How can I use/replace the horizontal-stack in the entities card?

change the card type to custom:hui-horizontal-stack-card i believe

1 Like

if you check out my repo, I use it alot on my settings page. Also, the primary page too.

Thanks, it works.

1 Like