Simple Air Comfort card

FINALLY V5.0 SIMPLE AIR COMFORT CARD

  1. Paste the following code into your lovelace dashboard view
  2. Only thing that needs to be changed is the word living_room to suit your needs, also add your temperature and humidity sensors.
  3. Any sensors that start with sensor.sac are calculated in the Macro.
SIMPLE AIR COMFORT CARD YAML
                  - type: picture-elements
                    image: >-
                      local/community/simple-air-comfort-card/sac_background_overlay.svg
                    card_mod:
                      style: |
                        ha-card {
                          --ha-card-background: {{states('sensor.sac_temperature_colour_living_room')}}
                          --ha-card-border-width: 0px !important;
                          --ha-card-border-radius: 5px !important;
                          --box-shadow: none !important;
                        }
                    elements:
                      - type: custom:button-card
                        name: Card Title
                        label: Living Room
                        show_name: false
                        show_label: true
                        style:
                          left: 50%
                          top: 5%
                          width: 100%
                          transform: translate(-50%, -50%) scale(0.7, 0.7)
                        styles:
                          card:
                            - background: transparent
                            - border-color: transparent
                          label:
                            - color: silver
                      - type: custom:button-card
                        name: Text Dew Point Comfort - Living Room
                        entity: sensor.sac_text_dewpoint_comfort_living_room
                        label: >-
                          configuration.yaml template text sensor, calculated
                          from sac_macro.jinja
                        show_state: true
                        show_name: false
                        show_label: false
                        show_icon: false
                        style:
                          right: '-50%'
                          top: 14%
                          width: 100%
                          transform: translate(-50%, -50%) scale(0.95, 0.95)
                        styles:
                          card:
                            - background: transparent
                            - border-color: transparent
                          state:
                            - font-weight: bold
                      - type: custom:button-card
                        name: Sensor 1 - Dewpoint - Living Room
                        entity: sensor.dewpoint_living_room
                        label: >-
                          configuration.yaml template dewpoint sensor,
                          calculated from sac_macro.jinja
                        icon: mdi:water-thermometer-outline
                        show_state: true
                        show_name: false
                        show_icon: true
                        show_label: false
                        style:
                          left: 20%
                          top: 25%
                          width: 50%
                          transform: translate(-50%, -50%) scale(0.6, 0.6)
                        styles:
                          card:
                            - background: transparent
                            - border-color: transparent
                          icon:
                            - color: auto
                      - type: custom:button-card
                        name: Sensor 2 - Feels Like - Living Room
                        entity: sensor.living_room_feels_like_temperature
                        icon: tc:thermal-perception-alternative
                        show_state: true
                        show_name: false
                        show_icon: true
                        style:
                          left: 80%
                          top: 25%
                          width: 50%
                          transform: translate(-50%, -50%) scale(0.6, 0.6)
                        styles:
                          card:
                            - background: transparent
                            - border-color: transparent
                          icon:
                            - color: auto
                      - type: custom:button-card
                        name: Sensor 3 - Temperature - Living Room
                        entity: sensor.air_conditioning_temperature
                        show_state: true
                        show_name: false
                        show_icon: true
                        style:
                          left: 20%
                          top: 75%
                          width: 50%
                          transform: translate(-50%, -50%) scale(0.8, 0.8)
                        styles:
                          card:
                            - background: transparent
                            - border-color: transparent
                          icon:
                            - color: auto
                      - type: custom:button-card
                        name: Sensor 4 - Humidity - Living Room
                        entity: sensor.air_conditioning_humidity
                        show_state: true
                        show_name: false
                        show_icon: true
                        style:
                          left: 80%
                          top: 75%
                          width: 50%
                          transform: translate(-50%, -50%) scale(0.8, 0.8)
                        styles:
                          card:
                            - background: transparent
                            - border-color: transparent
                          icon:
                            - color: auto
                      - type: custom:button-card
                        name: Text Temperature Comfort Sensor 3 - Living Room
                        entity: sensor.sac_text_temperature_comfort_living_room
                        label: >-
                          configuration.yaml template text sensor, calculated
                          from sac_macro.jinja
                        show_state: true
                        show_name: false
                        show_label: false
                        show_icon: false
                        style:
                          left: 20%
                          top: 92%
                          width: 50%
                          transform: translate(-50%, -50%) scale(0.9, 0.9)
                        styles:
                          card:
                            - background: transparent
                            - border-color: transparent
                      - type: custom:button-card
                        name: Text Humidity Comfort Sensor 4 - Living Room
                        entity: sensor.sac_text_humidity_comfort_living_room
                        label: >-
                          configuration.yaml template text sensor, calculated
                          from sac_macro.jinja
                        show_state: true
                        show_name: false
                        show_label: false
                        show_icon: false
                        style:
                          left: 80%
                          top: 92%
                          width: 50%
                          transform: translate(-50%, -50%) scale(0.9, 0.9)
                        styles:
                          card:
                            - background: transparent
                            - border-color: transparent
                      - type: custom:button-card
                        name: Outer Ring Limits
                        show_name: false
                        show_icon: false
                        aspect_ratio: 1/1
                        style:
                          right: 4.5%
                          top: 50%
                          height: 45%
                          width: 45%
                        styles:
                          card:
                            - border-radius: 50%
                            - border-width: 2.5px
                            - border-color: rgba(255,255,255,1)
                        card_mod:
                          style: |
                            ha-card {
                              --ha-card-background: {{states('sensor.sac_dewpoint_colour_living_room')}}
                            }
                      - type: custom:button-card
                        name: Inner Circle Comfort Zone
                        show_name: false
                        show_icon: false
                        aspect_ratio: 1/1
                        style:
                          right: 28.5%
                          top: 50%
                          height: 21%
                          width: 21%
                        styles:
                          card:
                            - border-radius: 50%
                            - border-width: 0px
                        card_mod:
                          style: |
                            ha-card {
                              --ha-card-background: {{states('sensor.sac_inner_circle_alert_colour_living_room')}}
                            }
                      - type: custom:button-card
                        name: Floating Circle
                        icon: mdi:circle
                        show_name: false
                        show_icon: true
                        style:
                          width: 10%
                          height: 10%
                          transform: translate(-50%, -50%)
                        styles:
                          card:
                            - background: transparent
                            - border-color: transparent
                        card_mod:
                          style: |
                            :host {
                              {% from 'sac_macros.jinja' import card_mod_floating_circle_movement_and_color %}
                              {{ card_mod_floating_circle_movement_and_color('sensor.air_conditioning_humidity', 'sensor.air_conditioning_temperature') }}
                            }
                      - type: custom:button-card
                        label: Warm
                        show_label: true
                        style:
                          right: 0%
                          top: 22%
                          width: 50%
                          transform: translate(-50%, -50%) scale(0.7, 0.7)
                        styles:
                          label:
                            - color: grey
                          card:
                            - background: transparent
                            - border-color: transparent
                      - type: custom:button-card
                        label: Cold
                        show_label: true
                        style:
                          right: 0%
                          top: 79%
                          width: 50%
                          transform: translate(-50%, -50%) scale(0.7, 0.7)
                        styles:
                          label:
                            - color: grey
                          card:
                            - background: transparent
                            - border-color: transparent
                      - type: custom:button-card
                        label: Dry
                        show_label: true
                        style:
                          left: 22%
                          top: 50%
                          width: 20%
                          transform: translate(-50%, -50%) scale(0.7, 0.7)
                        styles:
                          label:
                            - color: grey
                            - writing-mode: vertical-rl
                            - transform: rotate(180deg)
                          card:
                            - background: transparent
                            - border-color: transparent
                      - type: custom:button-card
                        label: Humid
                        show_label: true
                        style:
                          left: 79%
                          top: 50%
                          width: 20%
                          transform: translate(-50%, -50%) scale(0.7, 0.7)
                        styles:
                          label:
                            - color: grey
                            - writing-mode: vertical-rl
                          card:
                            - background: transparent
                            - border-color: transparent
1 Like