<?php
/**
* Class: Jet_Elements_Button
* Name: Button
* Slug: jet-button
*/
namespace Elementor;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Typography;
use Elementor\Repeater;
use Elementor\Scheme_Color;
use Elementor\Scheme_Typography;
use Elementor\Widget_Base;
use Elementor\Utils;
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
class Jet_Elements_Button extends Jet_Elements_Base {
public function get_name() {
return 'jet-button';
}
public function get_title() {
return esc_html__( 'Button', 'jet-elements' );
}
public function get_icon() {
return 'jet-elements-icon-button';
}
public function get_jet_help_url() {
return 'https://crocoblock.com/knowledge-base/articles/jetelements-button-widget-how-to-add-a-button-widget-to-your-website/';
}
public function get_categories() {
return array( 'cherry' );
}
protected function _register_controls() {
$css_scheme = apply_filters(
'jet-elements/button/css-scheme',
array(
'container' => '.jet-button__container',
'button' => '.jet-button__instance',
'plane_normal' => '.jet-button__plane-normal',
'plane_hover' => '.jet-button__plane-hover',
'state_normal' => '.jet-button__state-normal',
'state_hover' => '.jet-button__state-hover',
'icon_normal' => '.jet-button__state-normal .jet-button__icon',
'label_normal' => '.jet-button__state-normal .jet-button__label',
'icon_hover' => '.jet-button__state-hover .jet-button__icon',
'label_hover' => '.jet-button__state-hover .jet-button__label',
)
);
$this->start_controls_section(
'section_content',
array(
'label' => esc_html__( 'Content', 'jet-elements' ),
)
);
$this->start_controls_tabs( 'tabs_button_content' );
$this->start_controls_tab(
'tab_button_content_normal',
array(
'label' => esc_html__( 'Normal', 'jet-elements' ),
)
);
$this->_add_advanced_icon_control(
'button_icon_normal',
array(
'label' => esc_html__( 'Button Icon', 'jet-elements' ),
'type' => Controls_Manager::ICON,
'label_block' => true,
'file' => '',
)
);
$this->add_control(
'button_label_normal',
array(
'label' => esc_html__( 'Button Label Text', 'jet-elements' ),
'type' => Controls_Manager::TEXT,
'default' => esc_html__( 'Click Me', 'jet-elements' ),
'dynamic' => array( 'active' => true ),
)
);
$this->end_controls_tab();
$this->start_controls_tab(
'tab_button_content_hover',
array(
'label' => esc_html__( 'Hover', 'jet-elements' ),
)
);
$this->_add_advanced_icon_control(
'button_icon_hover',
array(
'label' => esc_html__( 'Button Icon', 'jet-elements' ),
'type' => Controls_Manager::ICON,
'label_block' => true,
'file' => '',
)
);
$this->add_control(
'button_label_hover',
array(
'label' => esc_html__( 'Button Label Text', 'jet-elements' ),
'type' => Controls_Manager::TEXT,
'default' => esc_html__( 'Go', 'jet-elements' ),
'dynamic' => array( 'active' => true ),
)
);
$this->end_controls_tab();
$this->end_controls_tabs();
$this->add_control(
'button_url',
array(
'label' => esc_html__( 'Button Link', 'jet-elements' ),
'type' => Controls_Manager::URL,
'placeholder' => 'http://your-link.com',
'default' => array(
'url' => '#',
),
'separator' => 'before',
'dynamic' => array( 'active' => true ),
)
);
$this->end_controls_section();
$this->start_controls_section(
'section_settings',
array(
'label' => esc_html__( 'Settings', 'jet-elements' ),
)
);
$effects = apply_filters(
'jet-elements/button/effects',
array(
'effect-0' => esc_html__( 'None', 'jet-elements' ),
'effect-1' => esc_html__( 'Fade', 'jet-elements' ),
'effect-2' => esc_html__( 'Up Slide', 'jet-elements' ),
'effect-3' => esc_html__( 'Down Slide', 'jet-elements' ),
'effect-4' => esc_html__( 'Right Slide', 'jet-elements' ),
'effect-5' => esc_html__( 'Left Slide', 'jet-elements' ),
'effect-6' => esc_html__( 'Up Scale', 'jet-elements' ),
'effect-7' => esc_html__( 'Down Scale', 'jet-elements' ),
'effect-8' => esc_html__( 'Top Diagonal Slide', 'jet-elements' ),
'effect-9' => esc_html__( 'Bottom Diagonal Slide', 'jet-elements' ),
'effect-10' => esc_html__( 'Right Rayen', 'jet-elements' ),
'effect-11' => esc_html__( 'Left Rayen', 'jet-elements' ),
)
);
$this->add_control(
'hover_effect',
array(
'label' => esc_html__( 'Hover Effect', 'jet-elements' ),
'type' => Controls_Manager::SELECT,
'default' => 'effect-0',
'options' => $effects,
)
);
$this->add_control(
'use_button_icon',
array(
'label' => esc_html__( 'Use Icon?', 'jet-elements' ),
'type' => Controls_Manager::SWITCHER,
'label_on' => esc_html__( 'Yes', 'jet-elements' ),
'label_off' => esc_html__( 'No', 'jet-elements' ),
'return_value' => 'yes',
'default' => 'yes',
)
);
$this->add_control(
'button_icon_position',
array(
'label' => esc_html__( 'Icon Position', 'jet-elements' ),
'type' => Controls_Manager::SELECT,
'options' => array(
'left' => esc_html__( 'Left', 'jet-elements' ),
'top' => esc_html__( 'Top', 'jet-elements' ),
'right' => esc_html__( 'Right', 'jet-elements' ),
'bottom' => esc_html__( 'Bottom', 'jet-elements' ),
),
'default' => 'left',
'render_type' => 'template',
'condition' => array(
'use_button_icon' => 'yes',
),
)
);
$this->end_controls_section();
/**
* General Style Section
*/
$this->_start_controls_section(
'section_button_general_style',
array(
'label' => esc_html__( 'General', 'jet-elements' ),
'tab' => Controls_Manager::TAB_STYLE,
'show_label' => false,
)
);
$this->_add_control(
'custom_size',
array(
'label' => esc_html__( 'Custom Size', 'jet-elements' ),
'type' => Controls_Manager::SWITCHER,
'label_on' => esc_html__( 'Yes', 'jet-elements' ),
'label_off' => esc_html__( 'No', 'jet-elements' ),
'return_value' => 'yes',
'default' => 'false',
),
100
);
$this->_add_responsive_control(
'button_custom_width',
array(
'label' => esc_html__( 'Custom Width', 'jet-elements' ),
'type' => Controls_Manager::SLIDER,
'size_units' => array(
'px', 'em', '%',
),
'range' => array(
'px' => array(
'min' => 40,
'max' => 1000,
),
'%' => array(
'min' => 0,
'max' => 100,
),
),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['button'] => 'width: {{SIZE}}{{UNIT}};',
),
'condition' => array(
'custom_size' => 'yes',
),
),
100
);
$this->_add_responsive_control(
'button_custom_height',
array(
'label' => esc_html__( 'Custom Height', 'jet-elements' ),
'type' => Controls_Manager::SLIDER,
'size_units' => array(
'px', 'em', '%',
),
'range' => array(
'px' => array(
'min' => 10,
'max' => 1000,
),
'%' => array(
'min' => 0,
'max' => 100,
),
),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['button'] => 'height: {{SIZE}}{{UNIT}};',
),
'condition' => array(
'custom_size' => 'yes',
),
),
100
);
$this->_add_responsive_control(
'button_content_alignment',
array(
'label' => esc_html__( 'Content Alignment', 'jet-elements' ),
'type' => Controls_Manager::CHOOSE,
'options' => array(
'flex-start' => array(
'title' => esc_html__( 'Start', 'jet-elements' ),
'icon' => ! is_rtl() ? 'eicon-h-align-left' : 'eicon-h-align-right',
),
'center' => array(
'title' => esc_html__( 'Center', 'jet-elements' ),
'icon' => 'eicon-h-align-center',
),
'flex-end' => array(
'title' => esc_html__( 'End', 'jet-elements' ),
'icon' => ! is_rtl() ? 'eicon-h-align-right' : 'eicon-h-align-left',
),
),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['state_normal'] => 'justify-content: {{VALUE}};',
'{{WRAPPER}} ' . $css_scheme['state_hover'] => 'justify-content: {{VALUE}};',
'{{WRAPPER}} ' . $css_scheme['button'] . '--icon-top ' . $css_scheme['state_normal'] => 'align-items: {{VALUE}}; justify-content: center;',
'{{WRAPPER}} ' . $css_scheme['button'] . '--icon-top ' . $css_scheme['state_hover'] => 'align-items: {{VALUE}}; justify-content: center;',
'{{WRAPPER}} ' . $css_scheme['button'] . '--icon-bottom ' . $css_scheme['state_normal'] => 'align-items: {{VALUE}}; justify-content: center;',
'{{WRAPPER}} ' . $css_scheme['button'] . '--icon-bottom ' . $css_scheme['state_hover'] => 'align-items: {{VALUE}}; justify-content: center;',
),
'condition' => array(
'custom_size' => 'yes',
),
'separator' => 'after',
),
100
);
$this->_add_responsive_control(
'button_alignment',
array(
'label' => esc_html__( 'Alignment', 'jet-elements' ),
'type' => Controls_Manager::CHOOSE,
'default' => 'flex-start',
'options' => array(
'flex-start' => array(
'title' => esc_html__( 'Start', 'jet-elements' ),
'icon' => ! is_rtl() ? 'eicon-h-align-left' : 'eicon-h-align-right',
),
'center' => array(
'title' => esc_html__( 'Center', 'jet-elements' ),
'icon' => 'eicon-h-align-center',
),
'flex-end' => array(
'title' => esc_html__( 'End', 'jet-elements' ),
'icon' => ! is_rtl() ? 'eicon-h-align-right' : 'eicon-h-align-left',
),
),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['container'] => 'justify-content: {{VALUE}};',
),
),
25
);
$this->_add_responsive_control(
'button_margin',
array(
'label' => __( 'Margin', 'jet-elements' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['button'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
),
50
);
$this->_start_controls_tabs( 'tabs_general_styles' );
$this->_start_controls_tab(
'tab_general_normal',
array(
'label' => esc_html__( 'Normal', 'jet-elements' ),
)
);
$this->_add_group_control(
Group_Control_Background::get_type(),
array(
'name' => 'normal_button_background',
'selector' => '{{WRAPPER}} ' . $css_scheme['button'],
),
25
);
$this->_add_group_control(
Group_Control_Border::get_type(),
array(
'name' => 'normal_border',
'label' => esc_html__( 'Border', 'jet-elements' ),
'placeholder' => '1px',
'default' => '1px',
'selector' => '{{WRAPPER}} ' . $css_scheme['button'],
),
75
);
$this->_add_responsive_control(
'normal_border_radius',
array(
'label' => __( 'Border Radius', 'jet-elements' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['button'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
),
75
);
$this->_add_group_control(
Group_Control_Box_Shadow::get_type(),
array(
'name' => 'normal_box_shadow',
'selector' => '{{WRAPPER}} ' . $css_scheme['button'],
),
100
);
$this->_end_controls_tab();
$this->_start_controls_tab(
'tab_general_hover',
array(
'label' => esc_html__( 'Hover', 'jet-elements' ),
)
);
$this->_add_group_control(
Group_Control_Background::get_type(),
array(
'name' => 'hover_button_background',
'selector' => '{{WRAPPER}} ' . $css_scheme['button'] . ':hover',
),
25
);
$this->_add_group_control(
Group_Control_Border::get_type(),
array(
'name' => 'hover_border',
'label' => esc_html__( 'Border', 'jet-elements' ),
'placeholder' => '1px',
'default' => '1px',
'selector' => '{{WRAPPER}} ' . $css_scheme['button'] . ':hover',
),
75
);
$this->_add_responsive_control(
'hover_border_radius',
array(
'label' => __( 'Border Radius', 'jet-elements' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['button'] . ':hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
),
75
);
$this->_add_group_control(
Group_Control_Box_Shadow::get_type(),
array(
'name' => 'hover_box_shadow',
'selector' => '{{WRAPPER}} ' . $css_scheme['button'] . ':hover',
),
100
);
$this->_end_controls_tab();
$this->_end_controls_tabs();
$this->_end_controls_section();
/**
* Plane Style Section
*/
$this->_start_controls_section(
'section_button_plane_style',
array(
'label' => esc_html__( 'Plane', 'jet-elements' ),
'tab' => Controls_Manager::TAB_STYLE,
'show_label' => false,
)
);
$this->_add_responsive_control(
'button_padding',
array(
'label' => __( 'Padding', 'jet-elements' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['state_normal'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
'{{WRAPPER}} ' . $css_scheme['state_hover'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
),
50
);
$this->_start_controls_tabs( 'tabs_plane_styles' );
$this->_start_controls_tab(
'tab_plane_normal',
array(
'label' => esc_html__( 'Normal', 'jet-elements' ),
)
);
$this->_add_group_control(
Group_Control_Background::get_type(),
array(
'name' => 'normal_plane_background',
'selector' => '{{WRAPPER}} ' . $css_scheme['plane_normal'],
'fields_options' => array(
'color' => array(
'scheme' => array(
'type' => Scheme_Color::get_type(),
'value' => Scheme_Color::COLOR_1,
),
),
),
),
25
);
$this->_add_group_control(
Group_Control_Border::get_type(),
array(
'name' => 'normal_plane_border',
'label' => esc_html__( 'Border', 'jet-elements' ),
'placeholder' => '1px',
'selector' => '{{WRAPPER}} ' . $css_scheme['plane_normal'],
),
50
);
$this->_add_responsive_control(
'normal_plane_border_radius',
array(
'label' => __( 'Border Radius', 'jet-elements' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['plane_normal'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
),
75
);
$this->_add_group_control(
Group_Control_Box_Shadow::get_type(),
array(
'name' => 'normal_plane_box_shadow',
'selector' => '{{WRAPPER}} ' . $css_scheme['plane_normal'],
),
100
);
$this->_end_controls_tab();
$this->_start_controls_tab(
'tab_plane_hover',
array(
'label' => esc_html__( 'Hover', 'jet-elements' ),
)
);
$this->_add_group_control(
Group_Control_Background::get_type(),
array(
'name' => 'plane_hover_background',
'selector' => '{{WRAPPER}} ' . $css_scheme['plane_hover'],
'fields_options' => array(
'color' => array(
'scheme' => array(
'type' => Scheme_Color::get_type(),
'value' => Scheme_Color::COLOR_2,
),
),
),
),
25
);
$this->_add_group_control(
Group_Control_Border::get_type(),
array(
'name' => 'plane_hover_border',
'label' => esc_html__( 'Border', 'jet-elements' ),
'placeholder' => '1px',
'default' => '1px',
'selector' => '{{WRAPPER}} ' . $css_scheme['plane_hover'],
),
50
);
$this->_add_responsive_control(
'plane_hover_border_radius',
array(
'label' => __( 'Border Radius', 'jet-elements' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['plane_hover'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
),
75
);
$this->_add_group_control(
Group_Control_Box_Shadow::get_type(),
array(
'name' => 'hover_plane_box_shadow',
'selector' => '{{WRAPPER}} ' . $css_scheme['plane_hover'],
),
100
);
$this->_end_controls_tab();
$this->_end_controls_tabs();
$this->_end_controls_section();
/**
* Icon Style Section
*/
$this->_start_controls_section(
'section_button_icon_style',
array(
'label' => esc_html__( 'Icon', 'jet-elements' ),
'tab' => Controls_Manager::TAB_STYLE,
'show_label' => false,
)
);
$this->_start_controls_tabs( 'tabs_icon_styles' );
$this->_start_controls_tab(
'tab_icon_normal',
array(
'label' => esc_html__( 'Normal', 'jet-elements' ),
)
);
$this->_add_control(
'normal_icon_color',
array(
'label' => esc_html__( 'Color', 'jet-elements' ),
'type' => Controls_Manager::COLOR,
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_normal'] => 'color: {{VALUE}}',
),
),
25
);
$this->_add_responsive_control(
'normal_icon_font_size',
array(
'label' => esc_html__( 'Font Size', 'jet-elements' ),
'type' => Controls_Manager::SLIDER,
'size_units' => array(
'px', 'em', 'rem',
),
'range' => array(
'px' => array(
'min' => 1,
'max' => 100,
),
),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_normal'] => 'font-size: {{SIZE}}{{UNIT}}',
),
),
25
);
$this->_add_responsive_control(
'normal_icon_box_width',
array(
'label' => esc_html__( 'Icon Box Width', 'jet-elements' ),
'type' => Controls_Manager::SLIDER,
'size_units' => array(
'px', 'em', '%',
),
'range' => array(
'px' => array(
'min' => 10,
'max' => 200,
),
),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_normal'] => 'width: {{SIZE}}{{UNIT}};',
),
),
100
);
$this->_add_responsive_control(
'normal_icon_box_height',
array(
'label' => esc_html__( 'Icon Box Height', 'jet-elements' ),
'type' => Controls_Manager::SLIDER,
'size_units' => array(
'px', 'em', '%',
),
'range' => array(
'px' => array(
'min' => 10,
'max' => 200,
),
),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_normal'] => 'height: {{SIZE}}{{UNIT}};',
),
),
100
);
$this->_add_control(
'normal_icon_box_color',
array(
'label' => esc_html__( 'Icon Box Color', 'jet-elements' ),
'type' => Controls_Manager::COLOR,
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_normal'] => 'background-color: {{VALUE}}',
),
),
100
);
$this->_add_responsive_control(
'normal_icon_margin',
array(
'label' => __( 'Margin', 'jet-elements' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_normal'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
),
25
);
$this->_add_group_control(
Group_Control_Border::get_type(),
array(
'name' => 'normal_icon_box_border',
'label' => esc_html__( 'Border', 'jet-elements' ),
'placeholder' => '1px',
'default' => '1px',
'selector' => '{{WRAPPER}} ' . $css_scheme['icon_normal'],
),
100
);
$this->_add_control(
'normal_icon_box_border_radius',
array(
'label' => esc_html__( 'Border Radius', 'jet-elements' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_normal'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
),
100
);
$this->_end_controls_tab();
$this->_start_controls_tab(
'tab_icon_hover',
array(
'label' => esc_html__( 'Hover', 'jet-elements' ),
)
);
$this->_add_control(
'hover_icon_color',
array(
'label' => esc_html__( 'Color', 'jet-elements' ),
'type' => Controls_Manager::COLOR,
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_hover'] => 'color: {{VALUE}}',
),
),
25
);
$this->_add_responsive_control(
'hover_icon_font_size',
array(
'label' => esc_html__( 'Font Size', 'jet-elements' ),
'type' => Controls_Manager::SLIDER,
'size_units' => array(
'px', 'em', 'rem',
),
'range' => array(
'px' => array(
'min' => 1,
'max' => 100,
),
),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_hover'] => 'font-size: {{SIZE}}{{UNIT}}',
),
),
25
);
$this->_add_responsive_control(
'hover_icon_box_width',
array(
'label' => esc_html__( 'Icon Box Width', 'jet-elements' ),
'type' => Controls_Manager::SLIDER,
'size_units' => array(
'px', 'em', '%',
),
'range' => array(
'px' => array(
'min' => 10,
'max' => 200,
),
),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_hover'] => 'width: {{SIZE}}{{UNIT}};',
),
),
100
);
$this->_add_responsive_control(
'hover_icon_box_height',
array(
'label' => esc_html__( 'Icon Box Height', 'jet-elements' ),
'type' => Controls_Manager::SLIDER,
'size_units' => array(
'px', 'em', '%',
),
'range' => array(
'px' => array(
'min' => 10,
'max' => 200,
),
),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_hover'] => 'height: {{SIZE}}{{UNIT}};',
),
),
100
);
$this->_add_control(
'hover_icon_box_color',
array(
'label' => esc_html__( 'Icon Box Color', 'jet-elements' ),
'type' => Controls_Manager::COLOR,
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_hover'] => 'background-color: {{VALUE}}',
),
),
100
);
$this->_add_responsive_control(
'hover_icon_margin',
array(
'label' => __( 'Margin', 'jet-elements' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_hover'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
),
25
);
$this->_add_group_control(
Group_Control_Border::get_type(),
array(
'name' => 'hover_icon_box_border',
'label' => esc_html__( 'Border', 'jet-elements' ),
'placeholder' => '1px',
'default' => '1px',
'selector' => '{{WRAPPER}} ' . $css_scheme['icon_hover'],
),
100
);
$this->_add_control(
'hover_icon_box_border_radius',
array(
'label' => esc_html__( 'Border Radius', 'jet-elements' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['icon_hover'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
),
100
);
$this->_end_controls_tab();
$this->_end_controls_tabs();
$this->_end_controls_section();
/**
* Label Style Section
*/
$this->_start_controls_section(
'section_button_label_style',
array(
'label' => esc_html__( 'Label', 'jet-elements' ),
'tab' => Controls_Manager::TAB_STYLE,
'show_label' => false,
)
);
$this->_add_responsive_control(
'label_text_alignment',
array(
'label' => esc_html__( 'Text Alignment', 'jet-elements' ),
'type' => Controls_Manager::CHOOSE,
'default' => 'left',
'options' => array(
'left' => array(
'title' => esc_html__( 'Left', 'jet-elements' ),
'icon' => 'eicon-text-align-left',
),
'center' => array(
'title' => esc_html__( 'Center', 'jet-elements' ),
'icon' => 'eicon-text-align-center',
),
'right' => array(
'title' => esc_html__( 'Right', 'jet-elements' ),
'icon' => 'eicon-text-align-right',
),
),
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['label_normal'] => 'text-align: {{VALUE}};',
'{{WRAPPER}} ' . $css_scheme['label_hover'] => 'text-align: {{VALUE}};',
),
),
25
);
$this->_add_responsive_control(
'label_margin',
array(
'label' => __( 'Margin', 'jet-elements' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'separator' => 'before',
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['label_normal'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
'{{WRAPPER}} ' . $css_scheme['label_hover'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
),
100
);
$this->_start_controls_tabs( 'tabs_label_styles' );
$this->_start_controls_tab(
'tab_label_normal',
array(
'label' => esc_html__( 'Normal', 'jet-elements' ),
)
);
$this->_add_control(
'normal_label_color',
array(
'label' => esc_html__( 'Color', 'jet-elements' ),
'type' => Controls_Manager::COLOR,
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['label_normal'] => 'color: {{VALUE}}',
),
),
25
);
$this->_add_group_control(
Group_Control_Typography::get_type(),
array(
'name' => 'normal_label_typography',
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
'selector' => '{{WRAPPER}} ' . $css_scheme['label_normal'],
),
50
);
$this->_end_controls_tab();
$this->_start_controls_tab(
'tab_label_hover',
array(
'label' => esc_html__( 'Hover', 'jet-elements' ),
)
);
$this->_add_control(
'hover_label_color',
array(
'label' => esc_html__( 'Color', 'jet-elements' ),
'type' => Controls_Manager::COLOR,
'selectors' => array(
'{{WRAPPER}} ' . $css_scheme['label_hover'] => 'color: {{VALUE}}',
),
),
25
);
$this->_add_group_control(
Group_Control_Typography::get_type(),
array(
'name' => 'hover_label_typography',
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
'selector' => '{{WRAPPER}} ' . $css_scheme['label_hover'],
),
50
);
$this->_end_controls_tab();
$this->_end_controls_tabs();
$this->_end_controls_section();
}
protected function render() {
$this->_context = 'render';
$settings = $this->get_settings_for_display();
$is_editor = jet_elements()->elementor()->editor->is_edit_mode();
if ( empty( $settings['button_url']['url'] ) && ! $is_editor ) {
return;
}
$this->_open_wrap();
include $this->_get_global_template( 'index' );
$this->_close_wrap();
}
}