đź“ť 100% Templatable Lovelace Configurations

Share your Projects! Dashboards & Frontend
,
469

For displaying these “Excellent” etc words you may use 3 options:

  1. Create a template sensor (not a good thing if you are going to use these words in one place only) and display it in a separate column.
  2. Display these words in the "secondary-info" part (as I described above).
  3. Use this method to create something like this:
    image
    The idea is to display ANYTHING instead of some state.
    Look - this code is under "config-template-card" - but this does not need it since the templating is implemented by card-mod:
type: entities
entities:
  - type: 'custom:multiple-entity-row'
    style: |
      :host .entities-row div.entity:nth-child(1) div::before {
        color: orange;
        content: {%if is_state('sun.sun','above_horizon') -%} "Rise and shine\A" {%- else -%} "Sleep well\A" {%- endif %};
        line-height: var(--mdc-typography-body1-line-height, 1.5rem);
      }
      :host .entities-row div.entity:nth-child(1) div {
        color: transparent;
        line-height: 0px;
      }
    entity: sun.sun
    entities:
      - entity: sun.sun
        name: xxx
        styles:
          width: 60px
      - entity: sun.sun
        name: xxx
        styles:
          width: 60px
    unit: ''
    icon: ''
    toggle: false
    show_state: false
    state_header: ''
    state_color: false

Switching to decluttering is not related with “how to declare & use variables” - it is just about:

  1. Reduce number of lines.
  2. In case of need to change something - change it in the decluttering template only (the basis of using “function”, “procedure” etc in Programming).

I have already used it in the examples above, please check these lines:

        - entity: sun.sun
          name: xxx
          styles:
            width: 60px