Custom element doesn’t exist: hui-vertical-stack-card

Configuration Frontend
1

Hello,

I want to add the possibility to change the color of the icons depending on the state of an entity and for that I have installed custom-iu, but when I install it, the card I was designing fails and gives me an error:

Custom element doesn’t exist: hui-vertical-stack-card

My card is:

 type: custom:hui-vertical-stack-card
cards:
  - type: custom:hui-horizontal-stack-card
    cards:
      - type: custom:mushroom-entity-card
        entity: sensor.salon_temp
        name: Salón
        icon_type: none
        fill_container: false
        tap_action:
          action: navigate
          navigation_path: SALON
        card_mod:
          style: |
            ha-card {
              background-color: rgba(0,0,0,0);
              box-shadow: none;
              border-style: hidden;
            }
      - type: custom:mushroom-chips-card
        chips:
          - type: entity
            entity: switch.suelo_salon
            content_info: state
            use_entity_picture: false
            hold_action:
              action: none
            double_tap_action:
              action: none
            icon: mdi:heating-coil
            icon_color: >-
              {% if is_state('switch.modo','Calor') %}red{% else %}blue{% endif
              %}
            tap_action:
              action: toggle
        alignment: end
  - type: custom:mushroom-number-card
    entity: number.set_salon_temp
    name: Consigna
    icon: mdi:thermometer
    display_mode: slider
    card_mod:
      style: |
        ha-card {
          background-color: rgba(0,0,0,0);
          box-shadow: none;
          border-style: hidden;
        }
  - graph: line
    type: sensor
    entity: sensor.salon_temp
    detail: 1
    name: Temperatura
    card_mod:
      style: |
        ha-card {
          background-color: rgba(0,0,0,0);
          box-shadow: none;
          border-style: hidden;
        }
2

This code is ancient.
Google hui-element.

3

maybe also change title, because this has nothing to do with custom-ui…

4

Thanks, I will google what you tell me.

I am learning how to customize the cards.

5

You are probably right, but it was when installing custom-ui that the custom card failed me, but yes, the title is probably not correct.

Thanks

6

Title changed, :wink:

7

thx :wink:
if you need help on custom-ui, let me know!
Ive updated it, and released some more up to date plugins, links in that readme

8

Thank you very much, honestly I am a bit lost and I want to learn.

I’m going to google for a while to look for info.

9

These “type: custom:hui-vertical-stack-card” are only needed in places where you need to have a simple vertical/horizontal stack - but cannot place it since it is not accepted by a card where you want to place this stack.
Examples:

type: entities
entities:
  - sun.sun
  - type: vertical-stack
    cards:
      ...

type: picture-elements
elements:
  - type: horizontal-stack
    cards:
      ...

In both cases you cannot place a standard horiz/vertical stack.

A workaround - use a custom hui-element:

type: entities
entities:
  - sun.sun
  - type: custom:hui-element
    card_type: vertical-stack
    cards:
      ...

type: picture-elements
elements:
  - type: custom:hui-element
    card_type: horizontal-stack
    cards:
      ...

And those “type: custom:hui-vertical-stack-card” were a “part” of hui-element but were deprecated a long time ago.

10

Thanks for the clarification