From 4c0d2624d7012f8786c097ad3a06c4bf46d6e9b0 Mon Sep 17 00:00:00 2001
From: Fabian Affolter
- Only entities that have latitude and longitude attributes will be displayed on the map + Only entities that have latitude and longitude attributes will be displayed on the map.
- ## {% linkable_title Examples %} ```yaml diff --git a/source/_lovelace/markdown.markdown b/source/_lovelace/markdown.markdown index 2aa621424af..de239baa5ce 100644 --- a/source/_lovelace/markdown.markdown +++ b/source/_lovelace/markdown.markdown @@ -17,8 +17,6 @@ Markdown card is used to render [markdown](http://commonmark.org/help/). Screenshot of the markdown card. -## {% linkable_title Options %} - {% configuration %} type: required: true @@ -26,11 +24,11 @@ type: type: string content: required: true - description: Content to render as [markdown](http://commonmark.org/help/). + description: "Content to render as [markdown](http://commonmark.org/help/)." type: string title: required: false - description: Card title + description: The card title. type: string default: none {% endconfiguration %} diff --git a/source/_lovelace/media-control.markdown b/source/_lovelace/media-control.markdown index 25d870b4f1c..313d7492227 100644 --- a/source/_lovelace/media-control.markdown +++ b/source/_lovelace/media-control.markdown @@ -17,8 +17,6 @@ The media control card is used to display [Media Player](/components/#search/med Screenshot of the media player control card. -## {% linkable_title Options %} - {% configuration %} type: required: true @@ -26,7 +24,7 @@ type: type: string entity: required: true - description: "Entity id of `media_player` domain" + description: "A media player `entity_id`." type: string {% endconfiguration %} diff --git a/source/_lovelace/picture-elements.markdown b/source/_lovelace/picture-elements.markdown index d7f6c8c2caf..d923415e177 100644 --- a/source/_lovelace/picture-elements.markdown +++ b/source/_lovelace/picture-elements.markdown @@ -12,7 +12,7 @@ footer: true Picture elements card is one of the most versatile type of cards. -The cards allows you to position icons or text and even services! on an image based on coordinates. Imagine floor plan, imagine [picture-glance](/lovelace/picture-glance/) with no restrictions! +The cards allows you to position icons or text and even services! On an image based on coordinates. Imagine floor plan, imagine [picture-glance](/lovelace/picture-glance/) with no restrictions! You can customize tap action and even icon color. @@ -21,8 +21,6 @@ You can customize tap action and even icon color. Screenshot of the picture elements card. -## {% linkable_title Options %} - {% configuration %} type: required: true @@ -30,7 +28,7 @@ type: type: string image: required: true - description: URL of an image + description: The URL of an image. type: string elements: required: true @@ -40,132 +38,178 @@ title: required: false description: Card title type: string - default: none {% endconfiguration %} -Element types: +Different `elements` types: {% configuration %} -type: +elements: required: true - description: navigation - type: string -navigation_path: - required: true - description: navigation_path of URL to navigate to - type: string -icon: - required: false - description: Icon - type: string - default: none + description: List of elements + type: list + keys: + type: + required: true + description: navigation + type: string + navigation_path: + required: true + description: "The `navigation_path` of URL to navigate to." + type: string + icon: + required: false + description: Icon + type: string {% endconfiguration %} {% configuration %} -type: +elements: required: true - description: state-badge - type: string -entity: - required: true - description: Entity id - type: string -style: - required: true - description: See "Style options" - type: object + description: List of elements + type: list + keys: + type: + required: true + description: state-badge + type: string + entity: + required: true + description: Entity id + type: string + style: + required: true + description: See "Style options" + type: object {% endconfiguration %} {% configuration %} -type: +elements: required: true - description: state-icon - type: string -entity: - required: true - description: Entity id - type: string -style: - required: true - description: See "Style options" - type: object -tap_action: - required: false - description: "Set to `toggle` to change state" - type: string - default: more-info + description: List of elements + type: list + keys: + type: + required: true + description: state-icon + type: string + entity: + required: true + description: The entity id to use. + type: string + style: + required: true + description: Additional style options to use. + type: list + keys: + left: + required: true + description: Position from left, "25%". + type: string + top: + required: true + description: Position from top, "50%". + type: string + ...: + required: inherit + description: ... + type: string + "--paper-item-icon-color": + required: inherit + description: "Badge-icon off-color, `green`" + type: string + tap_action: + required: false + description: "Set to `toggle` to change state" + type: string + default: more-info + tap_action: {% endconfiguration %} {% configuration %} -type: +elements: required: true - description: state-label - type: string -entity: - required: true - description: Entity id - type: string -style: - required: true - description: See "Style options" - type: object + description: List of elements + type: list + keys: + type: + required: true + description: state-label + type: string + entity: + required: true + description: Entity id + type: string + style: + required: true + description: Additional style options to use. + type: list + keys: + left: + required: true + description: Position from left, "25%". + type: string + top: + required: true + description: Position from top, "50%". + type: string + ...: + required: inherit + description: ... + type: string + "--paper-item-icon-color": + required: inherit + description: "Badge-icon off-color, `green`" + type: string {% endconfiguration %} {% configuration %} -type: +elements: required: true - description: service-button - type: string -service: - required: true - description: light.turn_on - type: string -service_data: - required: false - description: "See `service_data` object structure." - type: object - default: none -style: - required: true - description: See "Style options" - type: object -title: - required: false - description: Button label - type: string - default: none -{% endconfiguration %} - -`service_data` object structure - -{% configuration %} -entity_id: - required: true - description: light.floor - type: string -{% endconfiguration %} - -Style options (CSS): - -{% configuration %} -left: - required: true - description: Position from left, "25%" - type: string -top: - required: true - description: Position from top, "50%" - type: string -...: - required: inherit - description: ... - type: string - default: none -"--paper-item-icon-color": - required: inherit - description: "Badge-icon off-color, `green`" - type: string - default: none + description: List of elements + type: list + keys: + type: + required: true + description: service-button + type: string + service: + required: true + description: light.turn_on + type: string + service_data: + required: false + description: The service data to use." + type: list + keys: + entity_id: + required: true + description: light.floor + type: string + style: + required: true + description: Additional style options to use. + type: object + keys: + left: + required: true + description: Position from left, "25%". + type: string + top: + required: true + description: Position from top, "50%". + type: string + ...: + required: inherit + description: ... + type: string + "--paper-item-icon-color": + required: inherit + description: "Badge-icon off-color, `green`" + type: string + title: + required: false + description: Button label + type: string {% endconfiguration %} ## {% linkable_title Example %} diff --git a/source/_lovelace/picture-entity.markdown b/source/_lovelace/picture-entity.markdown index 021efd490ce..b45c475f334 100644 --- a/source/_lovelace/picture-entity.markdown +++ b/source/_lovelace/picture-entity.markdown @@ -21,8 +21,6 @@ You can also use `camera` domain entities to use that as `camera_image`. Screenshot of the picture entity card. -{% linkable_title Options %} - {% configuration %} type: required: true @@ -30,11 +28,11 @@ type: type: string entity: required: true - description: Entity id to control via picture. + description: "An `entity_id` to control via picture." type: string camera_image: required: false - description: "Camera domain entity_id 'camera.demo_camera'" + description: "Camera `entity_id` to use." type: string default: None image: @@ -46,55 +44,47 @@ state_image: required: false description: "See `state_image` object structure." type: object - default: None + keys: + "on": + required: true + description: URL of an image used for on state. + type: string + "off": + required: true + description: URL of an image used for off state. + type: string + default: None + home: + required: false + description: URL of an image used for home state. + type: string + not_home: + required: false + description: URL of an image used for not_home state. + type: string + default: None + any: + required: false + description: Any state that is supported by the entity works. + type: object name: required: false - description: Custom name for entity + description: Custom name for entity. type: string default: None show_info: required: false - description: Set to false to hide infobar + description: Set to false to hide infobar. type: boolean - default: True + default: true tap_action: required: false - description: "Set to `toggle` for turning entity on/off without opening a dialog" + description: "Set to `toggle` for turning entity on/off without opening a dialog." type: string default: dialog {% endconfiguration %} -`state_image` object structure - -{% configuration %} -"on": - required: true - description: URL of an image used for on state. - type: string - default: None -"off": - required: true - description: URL of an image used for off state. - type: string - default: None -home: - required: false - description: URL of an image used for home state. - type: string - default: None -not_home: - required: false - description: URL of an image used for not_home state. - type: string - default: None -any: - required: false - description: Any state that is supported by the entity works - type: object - default: None -{% endconfiguration %} - -{% linkable_title Examples %} +## {% linkable_title Examples %} Basic example: diff --git a/source/_lovelace/picture-glance.markdown b/source/_lovelace/picture-glance.markdown index 293258bb7fd..b141f1c0eae 100644 --- a/source/_lovelace/picture-glance.markdown +++ b/source/_lovelace/picture-glance.markdown @@ -23,28 +23,65 @@ Picture glance supports a display of maximum 10 items. Screenshot of the picture glance card. -## {% linkable_title Options %} - -| Name | Type | Default | Description -| ---- | ---- | ------- | ----------- -| type | string | **Required** | `picture-glance` -| image | string | **Required** | URL of an image -| entities | list | **Required** | Entity id's -| navigation_path | string | Optional | Path of URL to use in navigation -| camera_image | string | Optional | camera domain entity_id 'camera.demo_camera' -| state_image | object | Optional| See `state_image` object structure. -| entity | list | Optional | An entity to use for state_image state. -| title | string | Optional | Card title. - -`state_image` object structure - -| Name | Type | Default | Description -| ---- | ---- | ------- | ----------- -| on | string | Optional | URL of an image used for on state. -| off | string | Optional | URL of an image used for off state. -| home | string | Optional | URL of an image used for home state. -| not_home | string | Optional | URL of an image used for not_home state. -| ... | string | Optional | Any state that is supported by the entity works. +{% configuration %} +type: + required: true + description: picture-glance + type: string +image: + required: true + description: The URL of an image. + type: string +navigation_path: + required: false + description: Path of URL to use in navigation. + type: string +entities: + required: true + description: A list of entity IDs. + type: list +navigation_path: + required: false + description: Path of URL to use in navigation. + type: string +camera_image: + required: false + description: The entity ID of a camera. + type: string +state_image: + required: false + description: Path of URL to use in navigation. + type: list + keys: + "on": + type: string + required: false + description: URL of an image used for on state. + "off": + type: string + required: false + description: URL of an image used for off state. + home: + type: string + required: false + description: URL of an image used for home state. + not_home: + type: string + required: false + description: URL of an image used for not_home state. + ANYTHING: + type: string + required: false + description: Any state that is supported by the entity works. +entity: + required: false + description: "An entity to use for state_image state." + type: list +title: + required: false + description: The card title. + type: string +{% endconfiguration %} ## {% linkable_title Examples %} diff --git a/source/_lovelace/picture.markdown b/source/_lovelace/picture.markdown index bccf0d9b237..73f4e6896e1 100644 --- a/source/_lovelace/picture.markdown +++ b/source/_lovelace/picture.markdown @@ -17,8 +17,6 @@ A very simple card that allows you to set an image to use for navigation to vari Screenshot of the picture card. -## {% linkable_title Options %} - {% configuration %} type: required: true @@ -26,32 +24,25 @@ type: type: string image: required: true - description: URL of an image + description: The URL of an image. type: string navigation_path: required: false - description: Path of URL to navigate to + description: Path of URL to navigate to. type: string - default: None service: required: false - description: "`light.toggle`" + description: The service to call. type: string - default: None service_data: required: false - description: See service_data object + description: The service data. type: object - default: None -{% endconfiguration %} - -`service_data` object structure - -{% configuration %} -entity_id: - required: true - description: light.floor - type: string + keys: + entity_id: + required: true + description: The ID of the entity to use. + type: string {% endconfiguration %} ## {% linkable_title Examples %} diff --git a/source/_lovelace/plant-status.markdown b/source/_lovelace/plant-status.markdown index 5ceb73e8b3a..09be25d0332 100644 --- a/source/_lovelace/plant-status.markdown +++ b/source/_lovelace/plant-status.markdown @@ -17,8 +17,6 @@ A card for all the lovely botanists out there. Screenshot of the plant status card. -## {% linkable_title Options %} - {% configuration %} type: required: true @@ -33,6 +31,7 @@ entity: ## {% linkable_title Example %} ```yaml +cards: - type: plant-status entity: plant.bonsai ``` diff --git a/source/_lovelace/vertical-stack.markdown b/source/_lovelace/vertical-stack.markdown index 164bc5681b8..49349d51c9e 100644 --- a/source/_lovelace/vertical-stack.markdown +++ b/source/_lovelace/vertical-stack.markdown @@ -23,6 +23,19 @@ cards: required: true description: List of cards type: list + keys: + type: + required: true + description: The type of the card to stack. + type: string + entity: + required: true + description: "An `entity_id` to use in the frontend." + type: string + image: + required: true + description: The URL to an image. + type: string {% endconfiguration %} ## {% linkable_title Example %} diff --git a/source/_lovelace/weather-forecast.markdown b/source/_lovelace/weather-forecast.markdown index eb6b490db3a..b92588bd2c2 100644 --- a/source/_lovelace/weather-forecast.markdown +++ b/source/_lovelace/weather-forecast.markdown @@ -17,8 +17,6 @@ The weather forecast is a card to display the weather. Very useful to include on Screenshot of the weather card. -{% linkable_title Options %} - {% configuration %} type: required: true @@ -26,7 +24,7 @@ type: type: string entity: required: true - description: "Entity id of `weather` domain" + description: "The `entity_id` of the `weather` platform to use." type: string {% endconfiguration %} diff --git a/source/lovelace/views.markdown b/source/lovelace/views.markdown index 653911fe25e..8c741d1f083 100644 --- a/source/lovelace/views.markdown +++ b/source/lovelace/views.markdown @@ -9,7 +9,7 @@ sharing: true footer: true --- -These are exactly as before, tab views with icons or text that help you manage large dashboards with many entities. The views have now deep links like `/lovelace/0`. You can also assign your own [custom ids](/lovelace/views/#custom-id). +These are exactly as before, tab views with icons or text that help you manage large dashboards with many entities. The views have now deep-links like `/lovelace/0`. You can also assign your own [custom IDs](/lovelace/views/#custom-id). - Using custom id in view, for [nicer navigation paths](/lovelace/views/#custom-id) in URLs. - Using [icons](/lovelace/views/#icons) instead of text. @@ -36,51 +36,46 @@ You can use icons instead of text for your view tabs. The title in the example w ```yaml views: -- icon: mdi:settings - title: Debugging + - icon: mdi:settings + title: Debugging ``` ## {% linkable_title Panel view %} -This type of view uses the first card in the `cards` array to expand it to occupy the complete view space, similar to panels. One very good practical use will be for floor plan type of cards. +This type of view uses the first card in the `cards` list to expand it to ocuppy the complete view space, similar to panels. One very good practical use will be for floor plan type of cards. ### {% linkable_title Example %} ```yaml views: -- icon: mdi:settings - id: debug - title: Floorplan - panel: true - cards: - - type: picture-elements - image: /local/floorplans/main.jpg - elements: - - type: state-icon - tap_action: toggle - entity: light.ceiling_lights - style: - top: 47% - left: 42% + - icon: mdi:settings + id: debug + title: Floorplan + panel: true + cards: + - type: picture-elements + image: /local/floorplans/main.jpg + elements: + - type: state-icon + tap_action: toggle + entity: light.ceiling_lights ``` ## {% linkable_title Themes %} -You can also set a [theme](/frontend/#themes) per view. - -> Theme is currently only partially usable (font color works) +You can also set a [theme](/frontend/#themes) per view. Theme is currently only partially usable (font color works). ```yaml views: -- icon: mdi:heart - id: debug - title: Home - theme: dark-mode + - icon: mdi:heart + id: debug + title: Home + theme: dark-mode ``` ## {% linkable_title Custom ID %} -You can now assign a custom id to a view, for nicer navigation paths in URLs. This id allows you to deep-link navigation to this view from cards that allow `navigation_path`. +You can now assign a custom ID to a view, for nicer navigation paths in URLs. This id allows you to deep-link navigation to this view from cards that allow `navigation_path`. ### {% linkable_title Example %} @@ -88,8 +83,8 @@ View: ```yaml views: -- icon: mdi:settings - id: debugging + - icon: mdi:settings + id: debugging ``` Picture card: