Image ratio on featured image widget elementor

Image ratio on featured image widget elementor.php

<?php 


add_action( 'elementor/element/before_section_end', function( $element, $section_id, $args ) {
    /** @var \Elementor\Element_Base $element */
    if ('theme-post-featured-image' === $element->get_name()) {


   
        
        $element->add_control(
			'item_ratio',
			[
				'label' => __( 'Image Ratio', 'elementor-pro' ),
				'type' => \Elementor\Controls_Manager::SLIDER,
				'default' => [
					'size' => 0.66,
				],
				'tablet_default' => [
					'size' => '',
				],
				'mobile_default' => [
					'size' => 0.5,
				],
				'range' => [
					'px' => [
						'min' => 0.1,
						'max' => 2,
						'step' => 0.01,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .elementor-image' => 'padding-bottom: calc( {{SIZE}} * 100% );',
					'{{WRAPPER}}:after' => 'content: "{{SIZE}}"; position: absolute; color: transparent;',
				],
//				'condition' => [
//					$this->get_control_id( 'thumbnail!' ) => 'none',
//					$this->get_control_id( 'masonry' ) => '',
//				],
			]
		);
        
        
    }
}, 10, 3 );


?>

widget css:

.has-ratio .elementor-image{
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.has-ratio .elementor-image img{
height: auto;
    width: 100%;
 position: absolute;
    top: calc(50% + 1px);
    left: calc(50% + 1px);
    -webkit-transform: scale(1.01) translate(-50%,-50%);
    -ms-transform: scale(1.01) translate(-50%,-50%);
    transform: scale(1.01) translate(-50%,-50%);
}