I have made few changes. Can you post your service calls?
1 Like
Nice so far. Thank you!
The tap actions weren’t working at all. I fixed it.
I also added a dropdown list to choose the desired “Favorite Mode”-Fanspeed. Unfortunately I did not found a way to set the current value in that input select list. This also need the vertical stack custom card.
Lovelace.ui:
Requires:
_
type: 'custom:vertical-stack-in-card'
cards:
- image: /local/purifier2.jpg
title: Vacuum
type: picture-elements
elements:
- type: state-icon
tap_action: fan.toggle
entity: fan.xiaomi_miio_device
style:
top: 15%
left: 74%
'--iron-icon-width': 40px
'--iron-icon-height': 40px
- type: icon
icon: 'mdi:water-percent'
tap_action: none
style:
top: 22%
left: 30%
'--iron-icon-width': 40px
'--iron-icon-height': 40px
- type: 'custom:circle-sensor-card'
entity: fan.xiaomi_miio_device
attribute: humidity
max: 100
min: 0
stroke_width: 10
gradient: true
units: '%'
show_card: false
font_style:
color: black
color_stops:
'0': '#FF0000'
'40': '#00FF00'
'70': '#00FF00'
'100': '#FF0000'
style:
top: 31%
left: 30%
width: 50px
height: 50px
- type: icon
icon: 'mdi:thermometer'
tap_action: none
style:
top: 22%
left: 42%
'--iron-icon-width': 40px
'--iron-icon-height': 40px
- type: 'custom:circle-sensor-card'
entity: fan.xiaomi_miio_device
attribute: temperature
max: 50
min: 0
stroke_width: 10
gradient: true
units: °C
show_card: false
font_style:
color: black
color_stops:
'0': '#FF0000'
'20': '#00FF00'
'26': '#00FF00'
'50': '#FF0000'
style:
top: 31%
left: 42%
width: 50px
height: 50px
- type: icon
icon: 'mdi:weather-windy'
tap_action: none
style:
top: 22%
left: 54%
'--iron-icon-width': 40px
'--iron-icon-height': 40px
- type: icon
icon: 'mdi:blackberry'
tap_action: none
style:
top: 22%
left: 54%
'--iron-icon-width': 20px
'--iron-icon-height': 20px
- type: 'custom:circle-sensor-card'
entity: fan.xiaomi_miio_device
attribute: aqi
max: 70
min: 0
stroke_width: 10
gradient: true
units: ''
show_card: false
font_style:
color: black
color_stops:
'0': '#00FF00'
'70': '#FF0000'
style:
top: 31%
left: 54%
width: 50px
height: 50px
- type: icon
icon: 'mdi:speedometer'
tap_action: none
style:
top: 22%
left: 66%
'--iron-icon-width': 40px
'--iron-icon-height': 40px
- type: 'custom:circle-sensor-card'
entity: fan.xiaomi_miio_device
attribute: motor_speed
max: 2000
min: 0
stroke_width: 10
gradient: true
units: ''
show_card: false
font_style:
color: black
color_stops:
'300': '#00FF00'
'5000': '#FF0000'
style:
top: 31%
left: 66%
width: 50px
height: 50px
- type: state-label
entity: sensor.purifier_fan_speed
style:
top: 15%
left: 23.5%
color: 'rgb(255, 255, 255)'
transform: 'translate(0%,-50%)'
pointer-events: none
text-shadow: 1px 1px black
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
border-left-style: solid
border-color: 'rgb(34, 154, 210)'
background-color: 'rgb(54, 65, 78)'
opacity: 0.8
- type: icon
icon: 'mdi:brightness-auto'
tap_action:
action: call-service
service: fan.set_speed
service_data:
entity_id: fan.xiaomi_miio_device
speed: Auto
style:
top: 40%
left: 42%
'--iron-icon-height': 30px
'--iron-icon-width': 30px
- type: icon
icon: 'mdi:power-sleep'
tap_action:
action: call-service
service: fan.set_speed
service_data:
entity_id: fan.xiaomi_miio_device
speed: Silent
style:
top: 40%
left: 50%
'--iron-icon-height': 30px
'--iron-icon-width': 30px
- type: icon
icon: 'mdi:account-heart'
tap_action:
action: call-service
service: fan.set_speed
service_data:
entity_id: fan.xiaomi_miio_device
speed: Favorite
style:
top: 40%
left: 57%
'--iron-icon-height': 30px
'--iron-icon-width': 30px
- entities:
- entity: input_select.purifier_fan
type: entities
purifier.yaml:
You can either put this all in your config files accordingly or just put it in a single file packages\purifier.yaml and add packages: !include_dir_named packages to “homeassistant:” in configuration.yaml
##
##XIAOMI PURIFIER CONFIG
########################################
fan:
- platform: xiaomi_miio
host: 192.168.0.38
token: !secret purifier_token
sensor:
- platform: template
sensors:
purifier_fan_speed:
value_template: "{{ states.fan.xiaomi_miio_device.attributes.speed }}"
purifier_temperature:
value_template: "{{ states.fan.xiaomi_miio_device.attributes.temperature }}"
purifier_humidity:
value_template: "{{ states.fan.xiaomi_miio_device.attributes.humidity }}"
purifier_aqi:
value_template: "{{ states.fan.xiaomi_miio_device.attributes.aqi }}"
purifier_favspeed:
value_template: "{{ states.fan.xiaomi_miio_device.attributes.favorite_level }}"
input_select:
purifier_fan:
icon: mdi:fan
name: Purifier Favorite Mode Fan Speed
# initial: "{{ states('fan.xiaomi_miio_device.attributes.favorite_level') }}" #does not work like that.
options:
- 0
- 2
- 4
- 6
- 8
- 10
- 12
- 14
automation:
- alias: Set Purifier Fan Speed
id: 'purifier_set_fan_speed'
trigger:
- platform: state
entity_id: input_select.purifier_fan
action:
- service: fan.xiaomi_miio_set_favorite_level
data_template:
entity_id: fan.xiaomi_miio_device
level: "{{ states('input_select.purifier_fan') }}"
##END XIAOMI PURIFIER CONFIG
##Dedi
1 Like
I’m almost giving up on this but…I like the card so:
“Custom element doesn’t exist: circle-sensor-card.”
-
I’ve done what I always do, git, RAW, new file, save.
-
I’ve done method wget and move as on the git page.
-
move to another directory…
put v2, v3, clear cache, another browser but nothing works
Anyone can tell me what can be wrong?
Care to share your config? 
You can finde sime card config here:
2 Likes
change kitchen_air_purifier with your entity_id of the fan/purifier
sensors.yaml:
- platform: template
sensors:
purifier_fan_mode:
friendly_name: "Mode"
value_template: "{{ states.fan.kitchen_air_purifier.attributes.speed }}"
purifier_fan_speed:
friendly_name: "Motor speed"
unit_of_measurement: 'rpm'
value_template: "{{ states.fan.kitchen_air_purifier.attributes.motor_speed }}"
purifier_temperature:
friendly_name: "Temperature"
unit_of_measurement: 'C°'
value_template: "{{ states.fan.kitchen_air_purifier.attributes.temperature }}"
purifier_humidity:
friendly_name: "Humidity"
unit_of_measurement: '%'
value_template: "{{ states.fan.kitchen_air_purifier.attributes.humidity }}"
purifier_aqi:
friendly_name: "Air Quality Index"
unit_of_measurement: 'aqi'
value_template: "{{ states.fan.kitchen_air_purifier.attributes.aqi }}"
purifier_favspeed:
friendly_name: "Favourite Level"
value_template: "{{ states.fan.kitchen_air_purifier.attributes.favorite_level }}"
purifier_filter_hours_used:
friendly_name: "Hours Used"
unit_of_measurement: 'h'
value_template: "{{ states.fan.kitchen_air_purifier.attributes.filter_hours_used }}"
purifier_filter_life_remaining:
friendly_name: "Filter"
unit_of_measurement: '%'
value_template: "{{ states.fan.kitchen_air_purifier.attributes.filter_life_remaining }}"
purifier_child_lock:
friendly_name: "Child Lock"
value_template: "{{ states.fan.kitchen_air_purifier.attributes.child_lock }}"
purifier_display:
friendly_name: "Display"
value_template: "{{ states.fan.kitchen_air_purifier.attributes.led }}"
purifier_button_pressed:
friendly_name: "Button Pressed"
value_template: "{{ states.fan.kitchen_air_purifier.attributes.button_pressed }}"
purifier_buzzer:
friendly_name: "Buzzer"
value_template: "{{ states.fan.kitchen_air_purifier.attributes.buzzer }}"
purifier_filter_type:
friendly_name: "Filter Type"
value_template: "{{ states.fan.kitchen_air_purifier.attributes.filter_type }}"
purifier_ligt_sensor:
friendly_name: "Light Sensor"
unit_of_measurement: 'lux'
value_template: "{{ states.fan.kitchen_air_purifier.attributes.illuminance }}"
Card:
card:
cards:
- elements:
- entity: sensor.purifier_filter_hours_used
prefix: 'Used: '
style:
background-color: 'rgba(0, 0, 0,.0)'
border-color: 'rgb(34, 154, 210,.0)'
border-left-style: solid
color: dodgerblue
font-size: 100%
font-weight: bold
left: 1.5%
opacity: 1
pointer-events: none
top: 5%
transform: 'translate(0%,-50%)'
type: state-label
- icon: 'mdi:water-percent'
style:
'--iron-icon-height': 20px
'--iron-icon-width': 20px
color: dodgerblue
left: 8%
position: absolute
top: 17%
tap_action: none
type: icon
- entity: sensor.purifier_humidity
fill: 'rgba(0,0,0,0.3)'
font_style:
color: white
gradient: true
max: 100
min: 0
show_card: null
stroke_width: 10
style:
height: 17%
left: 15%
top: 25%
width: 17%
type: 'custom:circle-sensor-card'
units: '%'
- icon: 'mdi:thermometer'
style:
'--iron-icon-height': 20px
'--iron-icon-width': 20px
color: dodgerblue
left: 7.5%
position: absolute
top: 37%
tap_action: none
type: icon
- entity: sensor.purifier_temperature
fill: 'rgba(0,0,0,0.3)'
font_style:
color: white
gradient: true
max: 50
min: 0
show_card: false
stroke_width: 10
style:
height: 17%
left: 15%
top: 45%
width: 17%
type: 'custom:circle-sensor-card'
units: °C
- icon: 'mdi:air-filter'
style:
'--iron-icon-height': 17px
'--iron-icon-width': 17px
color: dodgerblue
left: 8%
top: 56%
tap_action: none
type: icon
- entity: sensor.purifier_filter_life_remaining
fill: 'rgba(0,0,0,0.3)'
font_style:
color: white
gradient: true
max: 100
min: 0
show_card: false
stroke_width: 10
style:
height: 17%
left: 15%
top: 65%
width: 17%
type: 'custom:circle-sensor-card'
units: ''
- entity: sensor.purifier_aqi
fill: 'rgba(0,0,0,0.3)'
font_style:
color: white
gradient: true
max: 600
min: 0
show_card: false
stroke_width: 10
style:
height: 13%
left: 50%
top: 18.5%
width: 13%
type: 'custom:circle-sensor-card'
units: p
- icon: 'mdi:speedometer'
style:
'--iron-icon-height': 17px
'--iron-icon-width': 17px
color: dodgerblue
left: 8%
top: 76%
tap_action: none
type: icon
- entity: sensor.purifier_fan_speed
fill: 'rgba(0,0,0,0.3)'
font_style:
color: white
gradient: true
max: 1700
min: 0
show_card: false
stroke_width: 10
style:
height: 17%
left: 15%
top: 85%
width: 17%
type: 'custom:circle-sensor-card'
units: ''
- entity: sensor.purifier_fan_mode
max: 2000
min: 0
prefix: 'Mode: '
style:
background-color: 'rgba(0, 0, 0,.0)'
border-color: 'rgb(34, 154, 210,.0)'
border-left-style: solid
color: dodgerblue
font-size: 100%
font-weight: bold
opacity: 1
pointer-events: none
right: 1%
top: 1%
transform: none
type: state-label
- entity: fan.kitchen_air_purifier
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
margin-right: '-10%'
right: 17%
top: 17%
tap_action:
action: call-service
service: fan.toggle
service_data:
entity_id: fan.kitchen_air_purifier
type: state-icon
- icon: 'mdi:brightness-auto'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
right: 4%
top: 17%
tap_action:
action: call-service
service: fan.set_speed
service_data:
entity_id: fan.kitchen_air_purifier
speed: Auto
type: icon
- icon: 'mdi:power-sleep'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
margin-right: '-10%'
right: 22%
top: 34%
tap_action:
action: call-service
service: fan.set_speed
service_data:
entity_id: fan.kitchen_air_purifier
speed: Silent
type: icon
- icon: 'mdi:account-heart'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
right: 4%
top: 34%
tap_action:
action: call-service
service: fan.set_speed
service_data:
entity_id: fan.kitchen_air_purifier
speed: Favorite
type: icon
- icon: 'mdi:monitor'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
margin-right: '-10%'
right: 22%
top: 51%
tap_action:
action: call-service
service: fan.XIAOMI_MIIO_SET_LED_ON
service_data:
entity_id: fan.kitchen_air_purifier
type: icon
- icon: 'mdi:monitor-off'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
right: 3%
top: 51%
tap_action:
action: call-service
service: fan.XIAOMI_MIIO_SET_LED_OFF
service_data:
entity_id: fan.kitchen_air_purifier
type: icon
- icon: 'mdi:bell'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
margin-right: '-10%'
right: 22%
top: 68%
tap_action:
action: call-service
service: fan.XIAOMI_MIIO_SET_BUZZER_ON
service_data:
entity_id: fan.kitchen_air_purifier
type: icon
- icon: 'mdi:lock-alert'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
margin-right: '-10%'
right: 22%
top: 87%
tap_action:
action: call-service
service: fan.XIAOMI_MIIO_SET_CHILD_LOCK_ON
service_data:
entity_id: fan.kitchen_air_purifier
type: icon
- icon: 'mdi:bell-off-outline'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
right: 3%
top: 68%
tap_action:
action: call-service
service: fan.XIAOMI_MIIO_SET_BUZZER_OFF
service_data:
entity_id: fan.kitchen_air_purifier
type: icon
- icon: 'mdi:lock-open-outline'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
right: 3%
top: 87%
tap_action:
action: call-service
service: fan.XIAOMI_MIIO_SET_CHILD_LOCK_OFF
service_data:
entity_id: fan.kitchen_air_purifier
type: icon
image: /local/xiaomi-mi-air-purifier-2s.jpg
type: picture-elements
type: 'custom:vertical-stack-in-card'
style:
background-image: url("/local/xiaomi-mi-air-purifier-2s.jpg")
background-repeat: no-repeat
background-size: 100% 100%
height: 100%
position: relative
type: 'custom:card-modder'
Put the following background image in www directory.
Background image:
7 Likes
Hello and thanks
could you help
when i want to create card it write error : custom:card-modder doesnt exist…
i cant creat the card
thx
Download card-modder.js from here:
Then place it to your
www directory …Then add this to your LoveLace UI trough “Configure UI” and then “Raw config editor”:
resources:
- type: js
url: /local/card-modder.js?v=1
1 Like
ok i did this and it doesnt work!
could you explain a little
MB
Hello
I have exactly Same pb
M
Hello,
I have add this in my home assistant. it’s OK.
But the card-modder is deprecated ( source : https://github.com/thomasloven/lovelace-card-modder ), Do you plan to update ?
you can just use Card Mod https://github.com/thomasloven/lovelace-card-mod
it’s working fine for me.
It’s also available via HACS
1 Like
Would you mind sending your card config? It would save me some time. I couldn’t find the card in HACS anywhere.
Hi,
I have update HA to 0.110 version and i have this error on the card : Cannot read property ‘states’ of undefined
Hi all, I’ve updated the most recent card shown above with the new service calls and explicitly colored icons and no need for card modder. Haven’t tried it on .110, but works on .107. Just change fan.master_bedroom_air_purifier to your entitiy ID.
- type: picture-elements
image: /local/images/air_purifier.jpeg
elements:
- type: state-label
entity: sensor.master_bedroom_purifier_filter_hours_used
prefix: 'Used: '
style:
background-color: 'rgba(0, 0, 0,.0)'
border-color: 'rgb(34, 154, 210,.0)'
border-left-style: solid
color: dodgerblue
font-size: 100%
font-weight: bold
left: 1.5%
opacity: 1
pointer-events: none
top: 5%
transform: 'translate(0%,-50%)'
- type: icon
icon: 'mdi:water-percent'
style:
'--iron-icon-height': 20px
'--iron-icon-width': 20px
color: dodgerblue
left: 8%
position: absolute
top: 17%
tap_action: none
- type: custom:circle-sensor-card
units: '%'
entity: sensor.master_bedroom_purifier_humidity
fill: 'rgba(0,0,0,0.3)'
font_style:
color: white
gradient: true
max: 100
min: 0
show_card: null
stroke_width: 10
style:
height: 17%
left: 15%
top: 25%
width: 17%
- type: icon
icon: 'mdi:thermometer'
style:
'--iron-icon-height': 20px
'--iron-icon-width': 20px
color: dodgerblue
left: 7.5%
position: absolute
top: 37%
tap_action: none
- type: custom:circle-sensor-card
units: °C
entity: sensor.master_bedroom_purifier_temperature
fill: 'rgba(0,0,0,0.3)'
font_style:
color: white
gradient: true
max: 50
min: 0
show_card: false
stroke_width: 10
style:
height: 17%
left: 15%
top: 45%
width: 17%
- type: icon
icon: 'mdi:air-filter'
style:
'--iron-icon-height': 17px
'--iron-icon-width': 17px
color: dodgerblue
left: 8%
top: 56%
tap_action: none
- type: custom:circle-sensor-card
units: ''
entity: sensor.master_bedroom_purifier_filter_life_remaining
fill: 'rgba(0,0,0,0.3)'
font_style:
color: white
gradient: true
max: 100
min: 0
show_card: false
stroke_width: 10
style:
height: 17%
left: 15%
top: 65%
width: 17%
- type: custom:circle-sensor-card
units: p
entity: sensor.master_bedroom_purifier_aqi
fill: 'rgba(0,0,0,0.3)'
font_style:
color: white
gradient: true
max: 600
min: 0
show_card: false
stroke_width: 10
style:
height: 13%
left: 50%
top: 18.5%
width: 13%
- type: icon
tap_action: none
icon: 'mdi:speedometer'
style:
'--iron-icon-height': 17px
'--iron-icon-width': 17px
color: dodgerblue
left: 8%
top: 76%
- type: custom:circle-sensor-card
units: ''
entity: sensor.master_bedroom_purifier_fan_speed
fill: 'rgba(0,0,0,0.3)'
font_style:
color: white
gradient: true
max: 1700
min: 0
show_card: false
stroke_width: 10
style:
height: 17%
left: 15%
top: 85%
width: 17%
- type: state-label
entity: sensor.master_bedroom_purifier_fan_mode
max: 2000
min: 0
prefix: 'Mode: '
style:
background-color: 'rgba(0, 0, 0,.0)'
border-color: 'rgb(34, 154, 210,.0)'
border-left-style: solid
color: dodgerblue
font-size: 100%
font-weight: bold
opacity: 1
pointer-events: none
right: 1%
top: 1%
transform: none
- type: state-icon
entity: fan.master_bedroom_air_purifier
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
margin-right: '-10%'
'--paper-item-icon-color': black
'--paper-item-icon-active-color': dodgerblue
right: 18%
top: 17%
tap_action:
action: call-service
service: fan.toggle
service_data:
entity_id: fan.master_bedroom_air_purifier
- type: icon
icon: 'mdi:brightness-auto'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
color: black
right: 4%
top: 17%
tap_action:
action: call-service
service: fan.set_speed
service_data:
entity_id: fan.master_bedroom_air_purifier
speed: Auto
- type: icon
icon: 'mdi:power-sleep'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
margin-right: '-10%'
color: black
right: 22%
top: 34%
tap_action:
action: call-service
service: fan.set_speed
service_data:
entity_id: fan.master_bedroom_air_purifier
speed: Silent
- type: icon
icon: 'mdi:account-heart'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
color: black
right: 4%
top: 34%
tap_action:
action: call-service
service: fan.set_speed
service_data:
entity_id: fan.master_bedroom_air_purifier
speed: Favorite
- type: icon
icon: 'mdi:monitor'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
margin-right: '-10%'
color: black
right: 22%
top: 51%
tap_action:
action: call-service
service: xiaomi_miio.fan_set_led_on
service_data:
entity_id: fan.master_bedroom_air_purifier
- type: icon
icon: 'mdi:monitor-off'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
color: black
right: 3%
top: 51%
tap_action:
action: call-service
service: xiaomi_miio.fan_set_led_off
service_data:
entity_id: fan.master_bedroom_air_purifier
- type: icon
icon: 'mdi:bell'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
margin-right: '-10%'
color: black
right: 22%
top: 68%
tap_action:
action: call-service
service: xiaomi_miio.fan_set_buzzer_on
service_data:
entity_id: fan.master_bedroom_air_purifier
- type: icon
icon: 'mdi:lock-alert'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
margin-right: '-10%'
color: black
right: 22%
top: 87%
tap_action:
action: call-service
service: xiaomi_miio.fan_set_child_lock_on
service_data:
entity_id: fan.master_bedroom_air_purifier
- type: icon
icon: 'mdi:bell-off-outline'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
color: black
right: 3%
top: 68%
tap_action:
action: call-service
service: xiaomi_miio.fan_set_buzzer_off
service_data:
entity_id: fan.master_bedroom_air_purifier
- type: icon
icon: 'mdi:lock-open-outline'
style:
'--iron-icon-height': 22px
'--iron-icon-width': 22px
color: black
right: 3%
top: 87%
tap_action:
action: call-service
service: xiaomi_miio.fan_set_child_lock_off
service_data:
entity_id: fan.master_bedroom_air_purifier
1 Like
The “Cannot read property ‘states’ of undefined” is a problem as a result of the custom:circle-sensor-card issue with version 110
reported on github, although no activity with circle sensor card development for a couple of years, so it “may” not be fixed
for the moment i have commented out the circle-sensor-card entries and use “type: state-badge” unitll, and if this is resolved. Not as nice, however at least gets the picture-elements card loaded without the error
- type: state-badge
entity: sensor.airpurifier_lounge_motor_speed
title: Fan1
tap_action:
action: more-info
style:
top: 35%
left: 15%
height: 40%
transform: 'translate(-50%,-50%) scale(0.85,0.85)'
1 Like
@MaAamie I don’t know why this error appears. I have to dig some more, as I’m still on HA v0.94. Some breaking change probably (the main reason I stopped updating - tired of breaking changes).
May you post the entire card?
It could be very useful (and simpler)
Thank you in advance
using any of the examples above, replace the circle-sensor-card entries with state-badge
for example, i changed one of the entries as follows
previously using circle-sensor-card
- type: 'custom:circle-sensor-card'
entity: sensor.airpurifier_lounge_motor_speed
fill: 'rgba(0,0,0,0.3)'
font_style:
color: white
gradient: true
max: 350
min: 0
show_card: false
stroke_width: 10
stroke_color: '#ff03c9'
style:
top: 35%
left: 15%
height: 40%
width: 40%
font-size: 90%
changed to this
- type: state-badge
entity: sensor.airpurifier_lounge_motor_speed
title: Fan1
tap_action:
action: more-info
style:
top: 35%
left: 15%
height: 40%
transform: 'translate(-50%,-50%) scale(0.85,0.85)'
1 Like