Karta samochodu

type: picture-elements
image: /local/kia.jpg
elements:
  - type: state-icon
    entity: sensor.sportage_last_updated_at
    style:
      right: 0
      bottom: 0px
      margin-bottom: 0px
      transform: initial
      font-size: 1em
      line-height: 2em
      '--paper-item-icon-color': white
  - type: state-label
    entity: sensor.sportage_last_updated_at
    style:
      transform: initial
      font-size: 1em
      line-height: 2em
      bottom: 0px
      right: 30px
      margin-bottom: 0px
      color: white
  - type: state-icon
    entity: device_tracker.sportage_location
    style:
      right: 0
      bottom: 0px
      margin-bottom: 48px
      transform: initial
      font-size: 1em
      line-height: 2em
      '--paper-item-icon-color': white
  - type: state-label
    entity: device_tracker.sportage_location
    style:
      transform: initial
      font-size: 1em
      line-height: 2em
      bottom: 0px
      right: 30px
      margin-bottom: 48px
      color: white
  - type: state-icon
    entity: sensor.sportage_odometer
    style:
      right: 0
      bottom: 0px
      margin-bottom: 24px
      transform: initial
      font-size: 1em
      line-height: 2em
      '--paper-item-icon-color': white
  - type: state-label
    entity: sensor.sportage_odometer
    style:
      transform: initial
      font-size: 1em
      line-height: 2em
      bottom: 0px
      right: 30px
      margin-bottom: 24px
      color: white
  - type: state-icon
    entity: lock.sportage_door_lock
    style:
      left: 0
      top: 0px
      margin-top: 0px
      transform: initial
      font-size: 1em
      line-height: 3em
      '--paper-item-icon-color': green
  - type: state-label
    entity: lock.sportage_door_lock
    title: lock.sportage_door_lock
    style:
      transform: initial
      font-size: 1em
      line-height: 2em
      top: 0px
      left: 30px
      margin-top: 0px
      color: green
  - type: state-icon
    entity: binary_sensor.sportage_front_right_door
    style:
      left: 0
      top: 0px
      margin-top: 24px
      transform: initial
      font-size: 1em
      line-height: 2em
      '--paper-item-icon-color': green
  - type: state-label
    entity: binary_sensor.sportage_front_right_door
    title: binary_sensor.sportage_front_right_door
    style:
      transform: initial
      font-size: 1em
      line-height: 2em
      top: 0px
      left: 30px
      margin-top: 24px
      color: green
  - type: state-icon
    entity: binary_sensor.sportage_back_left_door
    style:
      left: 0
      top: 0px
      margin-top: 48px
      transform: initial
      font-size: 1em
      line-height: 2em
      '--paper-item-icon-color': green
  - type: state-label
    entity: binary_sensor.sportage_back_left_door
    title: binary_sensor.sportage_back_left_door
    style:
      transform: initial
      font-size: 1em
      line-height: 2em
      top: 0px
      left: 30px
      margin-top: 48px
      color: green
  - type: state-icon
    entity: sensor.sportage_car_battery_level
    style:
      left: 0
      bottom: 0px
      margin-bottom: 0px
      transform: initial
      font-size: 1em
      line-height: 2em
      '--paper-item-icon-color': blue
  - type: state-label
    entity: sensor.sportage_car_battery_level
    title: sensor.sportage_car_battery_level
    prefix: 'Battery: '
    style:
      transform: initial
      font-size: 1em
      line-height: 2em
      bottom: 0px
      left: 30px
      margin-bottom: 0px
      color: white
  - type: state-icon
    entity: binary_sensor.sportage_trunk
    style:
      right: 0
      top: 0px
      margin-top: 0px
      transform: initial
      font-size: 1em
      line-height: 2em
      '--paper-item-icon-color': green
  - type: state-label
    entity: binary_sensor.sportage_trunk
    style:
      transform: initial
      font-size: 1em
      line-height: 2em
      top: 0px
      right: 30px
      margin-top: 0px
      color: green
  - type: state-icon
    entity: binary_sensor.sportage_tire_pressure_all
    style:
      right: 0
      top: 0px
      margin-top: 24px
      transform: initial
      font-size: 1em
      line-height: 2em
      '--paper-item-icon-color': green
  - type: state-label
    entity: binary_sensor.sportage_tire_pressure_all
    style:
      transform: initial
      font-size: 1em
      line-height: 2em
      top: 0px
      right: 30px
      margin-top: 24px
      color: green
  - type: custom:button-card
    icon: mdi:gas-station-outline
    color_type: icon
    entity: sensor.sportage_fuel_driving_range
    show_state: true
    show_name: false
    state:
      - value: 10
        operator: <
        color: '#FF0000'
      - value: 20
        operator: <=
        color: '#ff6600'
      - value: 30
        operator: <=
        color: '#ffcc00'
      - value: 40
        operator: <=
        color: '#FFFF00'
      - value: 50
        operator: <=
        color: '#ccff33'
      - value: 100
        operator: <=
        color: '#e1ff00'
      - value: 300
        operator: <=
        color: '#66ff33'
      - value: 600
        operator: <=
        color: '#0fff1f'
    styles:
      card:
        - width: 125px
        - height: 80px
        - background-color: rgba(0, 0, 0, .1)
      label:
        - font-color: '#ffee58'
      state:
        - color: white
        - transform: translate(20%, -70%) scale(0.8, 0.6)
      icon:
        - transform: translate(-60%, 20%) scale(0.7, 0.7)
        - animation: |
            [[[
              var blink=states['sensor.sportage_fuel_driving_range'].state;
              if (blink < '50' )  return 'blink 1s linear infinite'
            ]]]
    style:
      left: 11%
      top: 80%