6c6268a08e
Co-authored-by: Franck Nijhof <frenck@frenck.nl> Co-authored-by: Franck Nijhof <git@frenck.dev> fixes undefined
1.9 KiB
type, title, sidebar_label, description
| type | title | sidebar_label | description |
|---|---|---|---|
| card | Vertical Stack Card | Vertical Stack | The Vertical Stack card allows you to group multiple cards so they always sit in the same column. |
The Vertical Stack card allows you to group multiple cards so they always sit in the same column.
To add the Vertical Stack card to your user interface, click the menu (three dots at the top right of the screen) and then Edit Dashboard. Click the Add Card button in the bottom right corner and select from the card picker.
YAML Configuration
The following YAML options are available when you use YAML mode or just prefer to use YAML in the Code Editor in the UI.
{% configuration %}
type:
required: true
description: "vertical-stack"
type: string
title:
required: false
description: Title of stack.
type: string
cards:
required: true
description: List of cards.
type: list
{% endconfiguration %}
Examples
Basic example:
type: vertical-stack
title: Backyard
cards:
- type: picture-entity
entity: camera.demo_camera
show_info: false
- type: entities
entities:
- binary_sensor.movement_backyard
Picture and entities-card in a stack.
Combination of vertical and horizontal stack card:
type: vertical-stack
cards:
- type: picture-entity
entity: group.all_lights
image: /local/house.png
- type: horizontal-stack
cards:
- type: picture-entity
entity: light.ceiling_lights
image: /local/bed_1.png
- type: picture-entity
entity: light.bed_light
image: /local/bed_2.png
Create a grid layout using vertical and horizontal stack.