add_control(
'colors_normal',
array(
'label' => esc_html__( 'Color', 'bella-beauty' ),
'type' => Controls_Manager::COLOR,
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'colors_normal' ) . ': {{VALUE}};',
),
)
);
$this->add_control(
'colors_hover',
array(
'label' => esc_html__( 'Hover', 'bella-beauty' ),
'type' => Controls_Manager::COLOR,
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'colors_hover' ) . ': {{VALUE}};',
),
'separator' => 'after',
)
);
$this->add_control(
'notice',
array(
'raw' => sprintf(
'%1$s %2$s',
__( 'Please note:', 'bella-beauty' ),
__( 'The settings below will be applied to the links inside paragraphs only.', 'bella-beauty' )
),
'type' => Controls_Manager::RAW_HTML,
'content_classes' => 'elementor-panel-alert elementor-panel-alert-info',
'render_type' => 'ui',
)
);
$typo_weight_options = [
'' => esc_html__( 'Default', 'bella-beauty' ),
];
foreach ( array_merge( [ 'normal', 'bold' ], range( 100, 900, 100 ) ) as $weight ) {
$typo_weight_options[ $weight ] = ucfirst( $weight );
}
$this->add_control(
'font_weight',
array(
'label' => esc_html__( 'Font Weight', 'bella-beauty' ),
'type' => Controls_Manager::SELECT,
'options' => $typo_weight_options,
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'font_weight' ) . ': {{VALUE}};',
),
)
);
$this->add_control(
'font_style',
array(
'label' => esc_html__( 'Font Style', 'bella-beauty' ),
'type' => Controls_Manager::SELECT,
'options' => array(
'' => esc_html__( 'Default', 'bella-beauty' ),
'normal' => _x( 'Normal', 'Typography Control', 'bella-beauty' ),
'italic' => _x( 'Italic', 'Typography Control', 'bella-beauty' ),
'oblique' => _x( 'Oblique', 'Typography Control', 'bella-beauty' ),
),
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'font_style' ) . ': {{VALUE}};',
),
)
);
$this->add_responsive_control(
'letter_spacing',
array(
'label' => _x( 'Letter Spacing', 'Typography Control', 'bella-beauty' ),
'type' => Controls_Manager::SLIDER,
'range' => array(
'px' => array(
'min' => -5,
'max' => 10,
'step' => 0.1,
),
),
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'letter_spacing' ) . ': {{SIZE}}{{UNIT}};',
),
)
);
$this->add_responsive_control(
'word_spacing',
array(
'label' => _x( 'Word Spacing', 'Typography Control', 'bella-beauty' ),
'type' => Controls_Manager::SLIDER,
'range' => array(
'px' => array(
'min' => -5,
'max' => 10,
'step' => 0.1,
),
),
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'word_spacing' ) . ': {{SIZE}}{{UNIT}};',
),
)
);
$this->add_control(
'text_decoration_heading_control',
array(
'label' => esc_html__( 'Text Decoration', 'bella-beauty' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
)
);
$this->add_control(
'text_decoration_line',
array(
'label' => esc_html__( 'Type', 'bella-beauty' ),
'type' => Controls_Manager::SELECT,
'options' => array(
'' => _x( 'None', 'Typography Control', 'bella-beauty' ),
'underline' => _x( 'Underline', 'Typography Control', 'bella-beauty' ),
'overline' => _x( 'Overline', 'Typography Control', 'bella-beauty' ),
'line-through' => _x( 'Line Through', 'Typography Control', 'bella-beauty' ),
'underline overline' => _x( 'Underline, Overline', 'Typography Control', 'bella-beauty' ),
),
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'text_decoration_line' ) . ': {{VALUE}};',
),
)
);
$this->add_control(
'text_decoration_colors_normal',
array(
'label' => esc_html__( 'Color', 'bella-beauty' ),
'type' => Controls_Manager::COLOR,
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'text_decoration_colors_normal' ) . ': {{VALUE}};',
),
'condition' => array(
$this->get_control_id_parameter( '', 'text_decoration_line!' ) => '',
),
)
);
$this->add_control(
'text_decoration_colors_hover',
array(
'label' => esc_html__( 'Hover', 'bella-beauty' ),
'type' => Controls_Manager::COLOR,
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'text_decoration_colors_hover' ) . ': {{VALUE}};',
),
'condition' => array(
$this->get_control_id_parameter( '', 'text_decoration_line!' ) => '',
),
)
);
$this->add_control(
'text_decoration_style',
array(
'label' => esc_html__( 'Style', 'bella-beauty' ),
'type' => Controls_Manager::SELECT,
'options' => array(
'' => _x( 'Solid', 'Typography Control', 'bella-beauty' ),
'double' => _x( 'Double', 'Typography Control', 'bella-beauty' ),
'dotted' => _x( 'Dotted', 'Typography Control', 'bella-beauty' ),
'dashed' => _x( 'Dashed', 'Typography Control', 'bella-beauty' ),
'wavy' => _x( 'Wavy', 'Typography Control', 'bella-beauty' ),
),
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'text_decoration_style' ) . ': {{VALUE}};',
),
'condition' => array(
$this->get_control_id_parameter( '', 'text_decoration_line!' ) => '',
),
)
);
$this->add_responsive_control(
'text_decoration_thickness',
array(
'label' => _x( 'Thickness', 'Typography Control', 'bella-beauty' ),
'type' => Controls_Manager::SLIDER,
'size_units' => array( 'px', 'em' ),
'range' => array(
'px' => array(
'min' => 1,
'max' => 50,
'step' => 1,
),
'em' => array(
'min' => 0.1,
'max' => 1,
'step' => 0.1,
),
),
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'text_decoration_thickness' ) . ': {{SIZE}}{{UNIT}};',
),
'condition' => array(
$this->get_control_id_parameter( '', 'text_decoration_line!' ) => '',
),
)
);
$this->add_control(
'text_underline_position',
array(
'label' => esc_html__( 'Underline Position', 'bella-beauty' ),
'type' => Controls_Manager::SELECT,
'options' => array(
'' => _x( 'Auto', 'Typography Control', 'bella-beauty' ),
'under' => _x( 'Under', 'Typography Control', 'bella-beauty' ),
'from-font' => _x( 'From Font', 'Typography Control', 'bella-beauty' ),
),
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'text_underline_position' ) . ': {{VALUE}};',
),
'condition' => array(
$this->get_control_id_parameter( '', 'text_decoration_line' ) => array(
'underline',
'underline overline',
),
),
)
);
$this->add_responsive_control(
'text_underline_offset',
array(
'label' => _x( 'Underline Offset', 'Typography Control', 'bella-beauty' ),
'type' => Controls_Manager::SLIDER,
'size_units' => array( 'px', 'em' ),
'range' => array(
'px' => array(
'min' => -50,
'max' => 50,
'step' => 1,
),
'em' => array(
'min' => -1,
'max' => 1,
'step' => 0.05,
),
),
'dynamic' => array(),
'selectors' => array(
':root' => '--' . $this->get_control_prefix_parameter( '', 'text_underline_offset' ) . ': {{SIZE}}{{UNIT}};',
),
'condition' => array(
$this->get_control_id_parameter( '', 'text_decoration_line' ) => array(
'underline',
'underline overline',
),
),
)
);
}
}