Elep

<?php
namespace calmorCore\Widgets;

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Typography;
use Elementor\Group_Control_Text_Shadow;
// Exit if accessed directly
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}
/**
 * Text Typing Effect
 *
 * Elementor widget for text typing effect.
 *
 * @since 1.7.0
 */
class calmor_video extends Widget_Base {

public function get_name() {
        return 'calmor-video';
    }

public function get_title() {
        return __( 'Calmer Video', 'calmor-core' );
    }

public function get_icon() {
        return 'eicon-device-desktop';
    }

public function get_categories() {
        return [ 'calmor-elements' ];
    }

protected function register_controls() {

// ------------------------------ Title ------------------------------
     $this->start_controls_section(
        'video_section',
        [
            'label' => __( 'video Conent', 'calmor-core' ),
        ]
    );

$this->add_control(
        'video__url',
        [
            'label' => esc_html__( 'video URL', 'calmor-core' ),
            'type' => Controls_Manager::TEXT,
            'label_block' => true,
            'default' => '#',
        ]
    );

$this->add_control(
        'video_image',
        [
            'label' => esc_html__( 'Video Feature', 'calmor-core' ),
            'type' => \Elementor\Controls_Manager::MEDIA,
            'default' => [
                'url' => \Elementor\Utils::get_placeholder_image_src(),
            ],
        ]
    );

$this->end_controls_section();
}

protected function render() {
$settings = $this->get_settings();
?>
 
 <section class="video_popup">
        <div class="popup_container" style="background-image: url('<?php echo $settings['video_image']['url'];  ?>'); background-size: cover;  background-repeat: no-repeat;">
            <a href="<?php echo $settings['video__url'];  ?>" class="popup_btn"><i class="fa-solid fa-play"></i></a>
        </div>
    </section>
       
<?php
 }  
}