Files
.devcontainer
.github
.vscode
plugins
sass
source
.well-known
_dashboards
alarm-panel.markdown
area.markdown
button.markdown
calendar.markdown
conditional.markdown
energy.markdown
entities.markdown
entity-filter.markdown
entity.markdown
gauge.markdown
glance.markdown
grid.markdown
history-graph.markdown
horizontal-stack.markdown
humidifier.markdown
iframe.markdown
light.markdown
logbook.markdown
map.markdown
markdown.markdown
masonry.markdown
media-control.markdown
panel.markdown
picture-elements.markdown
picture-entity.markdown
picture-glance.markdown
picture.markdown
plant-status.markdown
sensor.markdown
shopping-list.markdown
sidebar.markdown
statistic.markdown
statistics-graph.markdown
thermostat.markdown
tile.markdown
vertical-stack.markdown
weather-forecast.markdown
_data
_docs
_examples
_faq
_includes
_integrations
_layouts
_posts
addons
android
assets
blog
blue
blueprints
changelogs
cloud
code_of_conduct
common-tasks
conference
dashboards
developers
docs
examples
faq
font
getting-started
green
help
home-energy-management
images
installation
integrations
ios
javascripts
more-info
privacy
security
skyconnect
state-of-the-open-home
static
stylesheets
tag
tos
voice_control
yellow
404.html
CNAME
_headers
_redirects
atom.xml
favicon.png
googlef4f3693c209fe788.html
index.html
integrations.json
robots.txt
service_worker.js
version.json
.editorconfig
.gitattributes
.gitignore
.markdownlint.json
.nvmrc
.powrc
.remarkignore
.remarkrc.js
.ruby-version
.textlintrc.json
CLA.md
CODEOWNERS
CODE_OF_CONDUCT.md
Dockerfile
Gemfile
Gemfile.lock
LICENSE.md
README.md
Rakefile
_config.yml
config.rb
config.ru
package-lock.json
package.json
home-assistant.io/source/_dashboards/conditional.markdown
c0ffeeca7 473d9d3fae Dashboards: apply sentence style caps ()
* Dashboards: apply sentence-style capitalization

* Apply sentence-style capitalization, apply reuse

* Apply suggestions from code review

Co-authored-by: Joakim Sørensen <joasoe@gmail.com>

* Apply suggestions from code review

* Add substep on dashboard control

* Remove code fence from title

- to focus on the topic of the content, rather than the code itself

* Apply suggestions from code review

Co-authored-by: Joakim Sørensen <joasoe@gmail.com>

---------

Co-authored-by: Joakim Sørensen <joasoe@gmail.com>
2023-11-18 11:47:45 +01:00

3.6 KiB

type, title, sidebar_label, description
type title sidebar_label description
card Conditional Card Conditional The Conditional card displays another card based on conditions.

The conditional card displays another card based on conditions.

Note: if there are multiple conditions there will be treated as an 'and' condition. This means that for the card to show, all conditions must be met.

{% include dashboard/edit_dashboard.md %} Note that while editing the dashboard, the card will always be shown, so be sure to exit editing mode to test the conditions.

Most options for this card can be configured via the user interface.

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: conditional type: string conditions: required: true description: List of conditions to check. See available conditions. type: list card: required: true description: Card to display if all conditions match. type: map {% endconfiguration %}

Examples

type: conditional
conditions:
  - condition: state
    entity: light.bed_light
    state: "on"
  - condition: state
    entity: light.bed_light
    state_not: "off"
  - condition: user
    users:
      - 581fca7fdc014b8b894519cc531f9a04
card:
  type: entities
  entities:
    - device_tracker.demo_paulus
    - cover.kitchen_window
    - group.kitchen
    - lock.kitchen_door
    - light.bed_light

Card conditions

State

condition: "state"
entity: climate.thermostat
state: heat
condition: "state"
entity: climate.thermostat
state_not: "off"

Tests if an entity has a specified state.

{% configuration %} condition: required: true description: "state" type: string entity: required: true description: Entity ID. type: string state: required: false description: Entity state is equal to this value. Can contain an array of states.* type: [list, string] state_not: required: false description: Entity state is unequal to this value. Can contain an array of states.* type: [list, string] {% endconfiguration %}

*one is required (state or state_not)

Numeric state

Tests if an entity state matches the thresholds.

condition: "numeric_state"
entity: sensor.outside_temperature
above: 10
below: 20

{% configuration %} condition: required: true description: "numeric_state" type: string entity: required: true description: Entity ID. type: string above: required: false description: Entity state is above this value.* type: string below: required: false description: Entity state is below to this value.* type: string {% endconfiguration %}

*at least one is required (above or below)

Screen

Specify the visibility of the card per screen size. Some screen size presets are available in the UI but you can use any CSS media query you want in YAML.

condition: screen
media_query: "(min-width: 1280px)"

{% configuration %} condition: required: true description: "screen" type: string media_query: required: true description: Media query to check which screen size are allowed to display the card. type: string {% endconfiguration %}

User

Specify the visibility of the card per user.

condition: "user"
users:
  - 581fca7fdc014b8b894519cc531f9a04

{% configuration %} condition: required: true description: "user" type: string users: required: true description: User ID that can see the card (unique hex value found on the Users configuration page). type: list {% endconfiguration %}