Lovelace: Simple thermostat card

Sure. Here is all of my combined code.

type: custom:stack-in-card
card_mod:
  style: |
    ha-card { 
      --ha-card-background: {{ 'rgba(255, 255, 255, 0.85)' if is_state('climate.living_ecobee_app', 'heat_cool') else 'rgba(115, 115, 115, 0.25)' }};
      --primary-text-color: {{ 'rgb(0,0,0)' if is_state('climate.living_ecobee_app', 'heat_cool') else '#97989c' }};
      border-radius: 10px;
      border: none;
    }
cards:
  - type: custom:simple-thermostat
    entity: climate.living_ecobee_app
    header: false
    sensors:
      - entity: sensor.living_window
        name: Living
      - entity: sensor.bedroom_window
        name: Bedroom
      - entity: sensor.neenie_window
        name: Neenie
    hide:
      temperature: true
      state: true
    step_size: 1
    decimals: 0
    control:
      hvac:
        'off':
          name: false
          icon: mdi:power
        heat: false
        cool: false
        heat_cool:
          name: false
          icon: mdi:thermostat-auto
    #      icon_template: >-
    #        {% if is_state('sensor.living_ecobee_app_preset_mode', 'vacation') %}
    #          mdi:airplane
    #        {% else %}
    #          mdi:thermostat-auto
    #        {% endif %}
      preset:
        _hide_when_off: true
        Home:
          name: false
          icon: mdi:home
        Girls:
          name: false
          icon: mdi:human-female-female
        Sleep:
          name: false
          icon: mdi:sleep
        Away:
          name: false
          icon: mdi:home-export-outline
    layout:
      mode:
        icons: true
        headings: false
    fallback: 'Off'
    style: |
      ha-card { 
        --ha-card-background: {{ 'rgba(255, 255, 255, 0.85)' if is_state('climate.living_ecobee_app', 'heat_cool') else 'rgba(115, 115, 115, 0.25)' }};
        --primary-text-color: {{ 'rgb(0,0,0)' if is_state('climate.living_ecobee_app', 'heat_cool') else '#97989c' }};
        --st-mode-active-background: rgba(255, 255, 255, 0.85);
        --st-mode-active-color:
          {% set sensor = states('sensor.living_ecobee_app_hvac_action') %}
          {% if sensor == 'cooling' %}rgb(49,130,183)
          {% elif sensor == 'heating' %}rgb(255,0,0)
          {% else %}rgb(0,0,0)
          {% endif %};
        --st-mode-background: rgba(115, 115, 115, 0.25);
        --st-font-size-sensors: 14px;
        --st-spacing: 2px;
        border-radius: 10px;
        border: none;
      }
  - type: custom:mini-graph-card
    entities:
      - entity: sensor.inside_temperature
        name: Inside
        color: '#3182b7'
        show_fill: true
      - entity: sensor.steiger_temperature_feels_like
        name: Real Feel
        color: '#32a852'
        show_fill: false
      - entity: sensor.steiger_temperature
        name: Outside
        color: 'rgb(255,0,0)'
        show_fill: false
      - entity: sun.sun
        color: gray
        name: Sun
        show_legend: false
        show_line: false
        show_fill: true
        show_points: false
        y_axis: secondary
        points_per_hour: 1
    line_width: 1
    decimals: 0
    hour24: true
    hours_to_show: 48
    state_map:
      - value: above_horizon
        label: Day
      - value: below_horizon
        label: Night
    show:
      name: false
      state: false
      points: false
      icon: false
      extrema: false
      labels: false
      labels_secondary: false
    style: |
      ha-card { 
        --ha-card-background: {{ 'rgba(255, 255, 255, 0.85)' if is_state('climate.living_ecobee_app', 'heat_cool') else 'rgba(115, 115, 115, 0.25)' }};
        --primary-text-color: {{ 'rgb(0,0,0)' if is_state('climate.living_ecobee_app', 'heat_cool') else '#97989c' }};
        border-radius: 10px;
        border: none;
      }
      .graph__legend__item:nth-of-type(1) .ellipsis:after {
        content: ": {{states('sensor.inside_temperature')}}°F";
        color: {{ 'rgb(0,0,0)' if is_state('climate.living_ecobee_app', 'heat_cool') else '#97989c' }};
      }
      .graph__legend__item:nth-of-type(2) .ellipsis:after {
        content: ": {{states('sensor.steiger_temperature') }}°F";
        color: {{ 'rgb(0,0,0)' if is_state('climate.living_ecobee_app', 'heat_cool') else '#97989c' }};
      }
      .graph__legend__item:nth-of-type(3) .ellipsis:after {
        content: ": {{states('sensor.steiger_temperature_feels_like')}}°F";
        color: {{ 'rgb(0,0,0)' if is_state('climate.living_ecobee_app', 'heat_cool') else '#97989c' }};
      }
      .graph .graph__legend {
        font-size: 16px;
      }
  - type: weather-forecast
    show_current: false
    show_forecast: true
    name: Castle Shannon
    entity: weather.steiger
    style: |
      ha-card { 
        --ha-card-background: {{ 'rgba(255, 255, 255, 0.85)' if is_state('climate.living_ecobee_app', 'heat_cool') else 'rgba(115, 115, 115, 0.25)' }};
        --primary-text-color: {{ 'rgb(0,0,0)' if is_state('climate.living_ecobee_app', 'heat_cool') else '#97989c' }};
        border-radius: 10px;
        border: none;
      }

I have updated my graph to also includes the “feels like” outdoor temperature.

I use the weather.com integration from HACS for to get my outside temp, feels like temp, and weather forecast. I have multiple other sensors I have created from ecobee attributes using the attributes extractor integration from HACS.

The only item I still can’t get to work is the icon template I would like to use in the simple thermostat card. Unfortunately from what I have read that is not possible.

3 Likes