1826 lines
56 KiB
PHP
1826 lines
56 KiB
PHP
<?php
|
|
/**
|
|
* Creative Elements - live Theme & Page Builder
|
|
*
|
|
* @author WebshopWorks, Elementor
|
|
* @copyright 2019-2022 WebshopWorks.com & Elementor.com
|
|
* @license https://www.gnu.org/licenses/gpl-3.0.html
|
|
*/
|
|
|
|
namespace CE;
|
|
|
|
defined('_PS_VERSION_') or exit;
|
|
|
|
use CE\CoreXDocumentTypesXPageBase as PageBase;
|
|
|
|
class CoreXKitsXDocumentsXKit extends PageBase
|
|
{
|
|
private $custom_colors_disabled;
|
|
private $typography_schemes_disabled;
|
|
|
|
public function __construct(array $data = [])
|
|
{
|
|
parent::__construct($data);
|
|
|
|
$this->custom_colors_disabled = \Configuration::get('elementor_disable_color_schemes');
|
|
$this->typography_schemes_disabled = \Configuration::get('elementor_disable_typography_schemes');
|
|
}
|
|
|
|
public static function isInitialDocument()
|
|
{
|
|
return \Tools::getValue('editor_post_id') === \Tools::getValue('initial_document_id', 0);
|
|
}
|
|
|
|
public function isEditableByCurrentUser()
|
|
{
|
|
return parent::isEditableByCurrentUser() && (
|
|
!is_admin() || \Profile::getProfileAccess(
|
|
\Context::getContext()->employee->id_profile,
|
|
\Tab::getIdFromClassName('AdminCEThemes')
|
|
)['edit'] === '1'
|
|
);
|
|
}
|
|
|
|
public static function getProperties()
|
|
{
|
|
$properties = parent::getProperties();
|
|
$uid = \Tools::getValue('uid');
|
|
|
|
$properties['has_elements'] = $uid && UId::TEMPLATE === UId::parse($uid)->id_type || self::isInitialDocument() || Helper::isAdminImport();
|
|
$properties['show_in_finder'] = false;
|
|
// $properties['show_on_admin_bar'] = false;
|
|
$properties['edit_capability'] = 'edit_theme_options';
|
|
$properties['support_kit'] = true;
|
|
|
|
return $properties;
|
|
}
|
|
|
|
public function getName()
|
|
{
|
|
return 'kit';
|
|
}
|
|
|
|
public static function getTitle()
|
|
{
|
|
return __('Theme Style');
|
|
}
|
|
|
|
protected function getHaveALookUrl()
|
|
{
|
|
return '';
|
|
}
|
|
|
|
public static function getEditorPanelConfig()
|
|
{
|
|
$config = parent::getEditorPanelConfig();
|
|
$config['default_route'] = 'panel/global/style';
|
|
|
|
return $config;
|
|
}
|
|
|
|
protected function getRemoteLibraryConfig()
|
|
{
|
|
$config = parent::getRemoteLibraryConfig();
|
|
|
|
$config['autoImportSettings'] = true;
|
|
$config['default_route'] = 'templates/blocks';
|
|
$config['category'] = 'style guide';
|
|
|
|
return $config;
|
|
}
|
|
|
|
public function getExitToDashboardUrl()
|
|
{
|
|
$uid = uidval($this->getMainId());
|
|
$url = \Context::getContext()->link->getAdminLink('AdminCEThemes') . '&' . http_build_query([
|
|
'id_ce_template' => $uid->id,
|
|
'updatece_template' => 1,
|
|
]);
|
|
$url = apply_filters('elementor/document/urls/exit_to_dashboard', $url, $this);
|
|
|
|
return $url;
|
|
}
|
|
|
|
public function getCssWrapperSelector()
|
|
{
|
|
return 'body.ce-kit-' . substr($this->getMainId(), 0, -6);
|
|
}
|
|
|
|
/**
|
|
* @since 2.0.0
|
|
*/
|
|
protected function _registerControls()
|
|
{
|
|
$this->registerDocumentControls();
|
|
|
|
$this->addTypographySection();
|
|
$this->addButtonsSection();
|
|
$this->addIconsSection();
|
|
$this->addImagesSection();
|
|
$this->addFormFieldsSection();
|
|
$this->addBodySection();
|
|
$this->addLayoutSection();
|
|
$this->addBreadcrumbSection();
|
|
$this->addPageTitleSection();
|
|
$this->addLightboxSection();
|
|
|
|
Plugin::$instance->controls_manager->addCustomCssControls($this, ControlsManager::TAB_STYLE);
|
|
}
|
|
|
|
// protected function getPostStatuses()
|
|
|
|
private function addSchemesNotice()
|
|
{
|
|
// Get the current section config (array - section id and tab) to use for creating a unique control ID and name
|
|
$current_section = $this->getCurrentSection();
|
|
|
|
if (!$this->custom_colors_disabled || !$this->typography_schemes_disabled) {
|
|
$this->addControl(
|
|
$current_section['section'] . '_schemes_notice',
|
|
[
|
|
'name' => $current_section['section'] . '_schemes_notice',
|
|
'type' => ControlsManager::RAW_HTML,
|
|
'raw' => sprintf(
|
|
__('In order for Theme Style to affect all relevant elements, please disable Default Colors ' .
|
|
'and Fonts from the <a href="%s" target="_blank">Settings Page</a>.'),
|
|
\Context::getContext()->link->getAdminLink('AdminCESettings')
|
|
),
|
|
'content_classes' => 'elementor-panel-alert elementor-panel-alert-warning',
|
|
'render_type' => 'ui',
|
|
]
|
|
);
|
|
}
|
|
}
|
|
|
|
private function addTypographySection()
|
|
{
|
|
$this->startControlsSection(
|
|
'section_typography',
|
|
[
|
|
'label' => __('Typography'),
|
|
'tab' => ControlsManager::TAB_STYLE,
|
|
]
|
|
);
|
|
|
|
$this->addSchemesNotice();
|
|
|
|
$this->addControl(
|
|
'body_heading',
|
|
[
|
|
'type' => ControlsManager::HEADING,
|
|
'label' => __('Body'),
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'body_color',
|
|
[
|
|
'label' => __('Text Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
'{{WRAPPER}}' => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTypography::getType(),
|
|
[
|
|
'label' => __('Typography'),
|
|
'name' => 'body_typography',
|
|
'selector' => '{{WRAPPER}}',
|
|
]
|
|
);
|
|
|
|
$this->addResponsiveControl(
|
|
'paragraph_spacing',
|
|
[
|
|
'label' => __('Paragraph Spacing'),
|
|
'type' => ControlsManager::SLIDER,
|
|
'selectors' => [
|
|
'{{WRAPPER}} p' => 'margin-bottom: {{SIZE}}{{UNIT}}',
|
|
],
|
|
'range' => [
|
|
'em' => [
|
|
'min' => 0.1,
|
|
'max' => 20,
|
|
],
|
|
],
|
|
'size_units' => ['px', 'em', 'vh'],
|
|
]
|
|
);
|
|
|
|
// Link Selectors
|
|
$link_selector = 'a, .elementor a';
|
|
$link_hover_selector = 'a:hover, .elementor a:hover';
|
|
|
|
$this->addControl(
|
|
'link_heading',
|
|
[
|
|
'type' => ControlsManager::HEADING,
|
|
'label' => __('Link'),
|
|
'separator' => 'before',
|
|
]
|
|
);
|
|
|
|
$this->startControlsTabs('tabs_link_style');
|
|
|
|
$this->startControlsTab(
|
|
'tab_link_normal',
|
|
[
|
|
'label' => __('Normal'),
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'link_normal_color',
|
|
[
|
|
'label' => __('Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
$link_selector => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTypography::getType(),
|
|
[
|
|
'label' => __('Typography'),
|
|
'name' => 'link_normal_typography',
|
|
'selector' => $link_selector,
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->startControlsTab(
|
|
'tab_link_hover',
|
|
[
|
|
'label' => __('Hover'),
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'link_hover_color',
|
|
[
|
|
'label' => __('Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
$link_hover_selector => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTypography::getType(),
|
|
[
|
|
'label' => __('Typography'),
|
|
'name' => 'link_hover_typography',
|
|
'selector' => $link_hover_selector,
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->endControlsTabs();
|
|
|
|
// Headings.
|
|
$this->addControl(
|
|
'heading_heading',
|
|
[
|
|
'type' => ControlsManager::HEADING,
|
|
'label' => __('Heading'),
|
|
'separator' => 'before',
|
|
]
|
|
);
|
|
|
|
$this->startControlsTabs('tabs_heading_style');
|
|
|
|
for ($i = 1; $i <= 6; ++$i) {
|
|
$this->startControlsTab(
|
|
"tab_heading_h$i",
|
|
[
|
|
'label' => "H$i",
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"h{$i}_color",
|
|
[
|
|
'label' => __('Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
"{{WRAPPER}} h$i" => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTypography::getType(),
|
|
[
|
|
'label' => __('Typography'),
|
|
'name' => "h{$i}_typography",
|
|
'selector' => "{{WRAPPER}} h$i",
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
}
|
|
|
|
$this->endControlsTabs();
|
|
|
|
// Display for Headings.
|
|
$this->addControl(
|
|
'heading_display',
|
|
[
|
|
'type' => ControlsManager::HEADING,
|
|
'label' => __('Display'),
|
|
'separator' => 'before',
|
|
]
|
|
);
|
|
|
|
$this->startControlsTabs('tabs_display_style');
|
|
|
|
foreach ([
|
|
'small' => 'S',
|
|
'medium' => 'M',
|
|
'large' => 'L',
|
|
'xl' => 'XL',
|
|
'xxl' => 'XXL',
|
|
] as $size => $label) {
|
|
$this->startControlsTab(
|
|
"tab_display_$size",
|
|
[
|
|
'label' => $label,
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"display_{$size}_color",
|
|
[
|
|
'label' => __('Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
"{{WRAPPER}} .ce-display-$size" => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTypography::getType(),
|
|
[
|
|
'label' => __('Typography'),
|
|
'name' => "display_{$size}_typography",
|
|
'selector' => "{{WRAPPER}} .ce-display-$size",
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
}
|
|
|
|
$this->endControlsTabs();
|
|
|
|
$this->endControlsSection();
|
|
}
|
|
|
|
private function addButtonsSection()
|
|
{
|
|
$this->startControlsSection(
|
|
'section_buttons',
|
|
[
|
|
'label' => __('Buttons'),
|
|
'tab' => ControlsManager::TAB_STYLE,
|
|
]
|
|
);
|
|
|
|
$buttons = [
|
|
'' => __('Default'),
|
|
'primary' => __('Primary'),
|
|
'secondary' => __('Secondary'),
|
|
];
|
|
$btns = [
|
|
'btn' => __('Theme') . ' ' . __('Default'),
|
|
'primary_btn' => __('Theme') . ' ' . __('Primary'),
|
|
'secondary_btn' => __('Theme') . ' ' . __('Secondary'),
|
|
];
|
|
$this->addControl(
|
|
'button_type',
|
|
[
|
|
'type' => ControlsManager::SELECT,
|
|
'groups' => [
|
|
'buttons' => [
|
|
'label' => 'Creative Elements',
|
|
'options' => &$buttons,
|
|
],
|
|
'btns' => [
|
|
'label' => \Tools::ucFirst(_THEME_NAME_) . ' ' . __('Theme'),
|
|
'options' => &$btns,
|
|
],
|
|
],
|
|
'classes' => 'ce-btn-skin',
|
|
]
|
|
);
|
|
|
|
$this->addSchemesNotice();
|
|
|
|
// CE Buttons
|
|
foreach ($buttons as $type => $heading) {
|
|
$button = $type ? $type . '_button' : 'button';
|
|
$button_selector = ($type ? ".elementor-button-$type " : '') . '.elementor-button';
|
|
$button_color_selector = preg_replace('/\.elementor-button(?!-)/', 'a$0:not(#e)', $button_selector);
|
|
$button_hover_selector = "$button_selector:hover, $button_selector:focus";
|
|
|
|
$this->addControl(
|
|
"{$button}_heading",
|
|
[
|
|
'type' => ControlsManager::HEADING,
|
|
'label' => "$heading " . __('Button'),
|
|
'condition' => [
|
|
'button_type' => $type,
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTypography::getType(),
|
|
[
|
|
'label' => __('Typography'),
|
|
'name' => "{$button}_typography",
|
|
'selector' => $button_selector,
|
|
'exclude' => ['font_size'],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTextShadow::getType(),
|
|
[
|
|
'name' => "{$button}_text_shadow",
|
|
'selector' => $button_selector,
|
|
]
|
|
);
|
|
|
|
$this->startControlsTabs("{$button}_tabs_style");
|
|
|
|
$this->startControlsTab(
|
|
"{$button}_tab_normal",
|
|
[
|
|
'label' => __('Normal'),
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"{$button}_text_color",
|
|
[
|
|
'label' => __('Text Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
"$button_selector, $button_color_selector" => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"{$button}_background_color",
|
|
[
|
|
'label' => __('Background Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
$button_selector => 'background-color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBoxShadow::getType(),
|
|
[
|
|
'name' => "{$button}_box_shadow",
|
|
'selector' => $button_selector,
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBorder::getType(),
|
|
[
|
|
'name' => "{$button}_border",
|
|
'selector' => $button_selector,
|
|
'fields_options' => [
|
|
'color' => [
|
|
'dynamic' => [],
|
|
],
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->startControlsTab(
|
|
"{$button}_tab_hover",
|
|
[
|
|
'label' => __('Hover'),
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"{$button}_hover_text_color",
|
|
[
|
|
'label' => __('Text Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
"$button_hover_selector, $button_color_selector:hover, $button_color_selector:focus" => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"{$button}_hover_background_color",
|
|
[
|
|
'label' => __('Background Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
$button_hover_selector => 'background-color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBoxShadow::getType(),
|
|
[
|
|
'name' => "{$button}_hover_box_shadow",
|
|
'selector' => $button_hover_selector,
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBorder::getType(),
|
|
[
|
|
'name' => "{$button}_hover_border",
|
|
'selector' => $button_hover_selector,
|
|
'fields_options' => [
|
|
'color' => [
|
|
'dynamic' => [],
|
|
],
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->endControlsTabs();
|
|
|
|
$this->addControl(
|
|
"{$button}_size_heading",
|
|
[
|
|
'label' => __('Size'),
|
|
'type' => ControlsManager::HEADING,
|
|
'separator' => 'before',
|
|
]
|
|
);
|
|
|
|
$this->startControlsTabs("{$button}_sizes_style");
|
|
|
|
foreach ([
|
|
'sm' => 'S',
|
|
'md' => 'M',
|
|
'lg' => 'L',
|
|
'xl' => 'XL',
|
|
'xs' => 'XS',
|
|
] as $size => $label) {
|
|
$key = 'sm' === $size ? '' : "_$size";
|
|
$button_size_selector = "$button_selector.elementor-size-$size";
|
|
|
|
$this->startControlsTab(
|
|
"{$button}_size_$size",
|
|
[
|
|
'label' => $label,
|
|
]
|
|
);
|
|
|
|
$this->addResponsiveControl(
|
|
"{$button}{$key}_typography_font_size",
|
|
[
|
|
'label' => _x('Font Size', 'Typography Control'),
|
|
'type' => ControlsManager::SLIDER,
|
|
'size_units' => ['px', 'em', 'rem', 'vw'],
|
|
'range' => [
|
|
'px' => [
|
|
'min' => 1,
|
|
'max' => 200,
|
|
],
|
|
'vw' => [
|
|
'min' => 0.1,
|
|
'max' => 10,
|
|
'step' => 0.1,
|
|
],
|
|
],
|
|
'selectors' => [
|
|
$button_size_selector => 'font-size: {{SIZE}}{{UNIT}}',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addResponsiveControl(
|
|
"{$button}{$key}_padding",
|
|
[
|
|
'label' => __('Padding'),
|
|
'type' => ControlsManager::DIMENSIONS,
|
|
'size_units' => ['px', 'em', '%'],
|
|
'selectors' => [
|
|
$button_size_selector => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"{$button}{$key}_border_radius",
|
|
[
|
|
'label' => __('Border Radius'),
|
|
'type' => ControlsManager::DIMENSIONS,
|
|
'size_units' => ['px', '%'],
|
|
'selectors' => [
|
|
$button_size_selector => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
}
|
|
|
|
$this->endControlsTabs();
|
|
}
|
|
|
|
// Theme Buttons
|
|
foreach ($btns as $btn => $heading) {
|
|
$btn_selector = 'btn' === $btn
|
|
? '.btn:not(.btn-primary, .btn-secondary)'
|
|
: '.btn-' . str_replace('_btn', '', $btn);
|
|
$btn_color_selector = "a$btn_selector";
|
|
$btn_hover_selector = "$btn_selector:hover, $btn_selector:hover:active, $btn_selector:focus";
|
|
|
|
$this->addControl(
|
|
"{$btn}_heading",
|
|
[
|
|
'type' => ControlsManager::HEADING,
|
|
'label' => "$heading " . __('Button'),
|
|
'condition' => [
|
|
'button_type' => $btn,
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTypography::getType(),
|
|
[
|
|
'label' => __('Typography'),
|
|
'name' => "{$btn}_typography",
|
|
'selector' => $btn_selector,
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTextShadow::getType(),
|
|
[
|
|
'name' => "{$btn}_text_shadow",
|
|
'selector' => $btn_selector,
|
|
]
|
|
);
|
|
|
|
$this->startControlsTabs("{$btn}_tabs_style");
|
|
|
|
$this->startControlsTab(
|
|
"{$btn}_tab_normal",
|
|
[
|
|
'label' => __('Normal'),
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"{$btn}_text_color",
|
|
[
|
|
'label' => __('Text Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
"$btn_selector, $btn_color_selector" => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"{$btn}_background_color",
|
|
[
|
|
'label' => __('Background Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
$btn_selector => 'background-color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBoxShadow::getType(),
|
|
[
|
|
'name' => "{$btn}_box_shadow",
|
|
'selector' => $btn_selector,
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBorder::getType(),
|
|
[
|
|
'name' => "{$btn}_border",
|
|
'selector' => $btn_selector,
|
|
'fields_options' => [
|
|
'color' => [
|
|
'dynamic' => [],
|
|
],
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->startControlsTab(
|
|
"{$btn}_tab_hover",
|
|
[
|
|
'label' => __('Hover'),
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"{$btn}_hover_text_color",
|
|
[
|
|
'label' => __('Text Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
"$btn_hover_selector, $btn_color_selector:hover, $button_color_selector:focus" => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"{$btn}_hover_background_color",
|
|
[
|
|
'label' => __('Background Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
$btn_hover_selector => 'background-color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBoxShadow::getType(),
|
|
[
|
|
'name' => "{$btn}_hover_box_shadow",
|
|
'selector' => $btn_hover_selector,
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBorder::getType(),
|
|
[
|
|
'name' => "{$btn}_hover_border",
|
|
'selector' => $btn_hover_selector,
|
|
'fields_options' => [
|
|
'color' => [
|
|
'dynamic' => [],
|
|
],
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->endControlsTabs();
|
|
|
|
$this->addResponsiveControl(
|
|
"{$btn}_padding",
|
|
[
|
|
'label' => __('Padding'),
|
|
'type' => ControlsManager::DIMENSIONS,
|
|
'size_units' => ['px', 'em', '%'],
|
|
'selectors' => [
|
|
$btn_selector => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
|
],
|
|
'separator' => 'before',
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
"{$btn}_border_radius",
|
|
[
|
|
'label' => __('Border Radius'),
|
|
'type' => ControlsManager::DIMENSIONS,
|
|
'size_units' => ['px', '%'],
|
|
'selectors' => [
|
|
$btn_selector => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
|
],
|
|
]
|
|
);
|
|
}
|
|
|
|
$this->endControlsSection();
|
|
}
|
|
|
|
private function addIconsSection()
|
|
{
|
|
$this->startControlsSection(
|
|
'section_icons',
|
|
[
|
|
'label' => __('Icons'),
|
|
'tab' => ControlsManager::TAB_STYLE,
|
|
]
|
|
);
|
|
|
|
$this->startControlsTabs('icon_colors');
|
|
|
|
$this->startControlsTab(
|
|
'icon_colors_normal',
|
|
[
|
|
'label' => __('Normal'),
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'icon_primary_color',
|
|
[
|
|
'label' => __('Primary Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'selectors' => [
|
|
'.elementor-view-stacked .elementor-icon' => 'background-color: {{VALUE}};',
|
|
'.elementor-view-framed .elementor-icon, .elementor-view-default .elementor-icon' => 'color: {{VALUE}};',
|
|
],
|
|
'scheme' => [
|
|
'type' => SchemeColor::getType(),
|
|
'value' => SchemeColor::COLOR_1,
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'icon_secondary_color',
|
|
[
|
|
'label' => __('Secondary Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'selectors' => [
|
|
'.elementor-view-framed .elementor-icon' => 'background-color: {{VALUE}};',
|
|
'.elementor-view-stacked .elementor-icon' => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->startControlsTab(
|
|
'icon_colors_hover',
|
|
[
|
|
'label' => __('Hover'),
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'icon_hover_primary_color',
|
|
[
|
|
'label' => __('Primary Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'selectors' => [
|
|
'.elementor-view-stacked .elementor-icon:hover' => 'background-color: {{VALUE}};',
|
|
'.elementor-view-framed .elementor-icon:hover, .elementor-view-default .elementor-icon:hover' => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'icon_hover_secondary_color',
|
|
[
|
|
'label' => __('Secondary Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'selectors' => [
|
|
'.elementor-view-framed .elementor-icon:hover' => 'background-color: {{VALUE}};',
|
|
'.elementor-view-stacked .elementor-icon:hover' => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->endControlsTabs();
|
|
|
|
$this->addResponsiveControl(
|
|
'icon_size',
|
|
[
|
|
'label' => __('Size'),
|
|
'type' => ControlsManager::SLIDER,
|
|
'range' => [
|
|
'px' => [
|
|
'min' => 6,
|
|
'max' => 300,
|
|
],
|
|
],
|
|
'selectors' => [
|
|
'.elementor-icon' => 'font-size: {{SIZE}}{{UNIT}};',
|
|
],
|
|
'separator' => 'before',
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'icon_padding',
|
|
[
|
|
'label' => __('Padding'),
|
|
'type' => ControlsManager::SLIDER,
|
|
'selectors' => [
|
|
'.elementor-view-framed .elementor-icon' => 'padding: {{SIZE}}{{UNIT}};',
|
|
'.elementor-view-stacked .elementor-icon' => 'padding: {{SIZE}}{{UNIT}};',
|
|
],
|
|
'range' => [
|
|
'em' => [
|
|
'min' => 0,
|
|
'max' => 5,
|
|
],
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'border_width',
|
|
[
|
|
'label' => __('Border Width'),
|
|
'type' => ControlsManager::DIMENSIONS,
|
|
'selectors' => [
|
|
'.elementor-view-framed .elementor-icon' => 'border-width: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'border_radius',
|
|
[
|
|
'label' => __('Border Radius'),
|
|
'type' => ControlsManager::DIMENSIONS,
|
|
'size_units' => ['px', '%'],
|
|
'selectors' => [
|
|
'.elementor-view-framed.elementor-shape-square .elementor-icon' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
|
'.elementor-view-stacked.elementor-shape-square .elementor-icon' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsSection();
|
|
}
|
|
|
|
private function addImagesSection()
|
|
{
|
|
// Image Selectors
|
|
$image_selector = '{{WRAPPER}} img';
|
|
$image_hover_selector = '{{WRAPPER}} img:hover';
|
|
|
|
$this->startControlsSection(
|
|
'section_images',
|
|
[
|
|
'label' => __('Images'),
|
|
'tab' => ControlsManager::TAB_STYLE,
|
|
]
|
|
);
|
|
|
|
$this->addSchemesNotice();
|
|
|
|
$this->startControlsTabs('tabs_image_style');
|
|
|
|
$this->startControlsTab(
|
|
'tab_image_normal',
|
|
[
|
|
'label' => __('Normal'),
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBorder::getType(),
|
|
[
|
|
'name' => 'image_border',
|
|
'selector' => $image_selector,
|
|
'fields_options' => [
|
|
'color' => [
|
|
'dynamic' => [],
|
|
],
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addResponsiveControl(
|
|
'image_border_radius',
|
|
[
|
|
'label' => __('Border Radius'),
|
|
'type' => ControlsManager::DIMENSIONS,
|
|
'size_units' => ['px', '%'],
|
|
'selectors' => [
|
|
$image_selector => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'image_opacity',
|
|
[
|
|
'label' => __('Opacity'),
|
|
'type' => ControlsManager::SLIDER,
|
|
'range' => [
|
|
'px' => [
|
|
'max' => 1,
|
|
'min' => 0.10,
|
|
'step' => 0.01,
|
|
],
|
|
],
|
|
'selectors' => [
|
|
$image_selector => 'opacity: {{SIZE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBoxShadow::getType(),
|
|
[
|
|
'name' => 'image_box_shadow',
|
|
'exclude' => [
|
|
'box_shadow_position',
|
|
],
|
|
'selector' => $image_selector,
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlCssFilter::getType(),
|
|
[
|
|
'name' => 'image_css_filters',
|
|
'selector' => '{{WRAPPER}} img',
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->startControlsTab(
|
|
'tab_image_hover',
|
|
[
|
|
'label' => __('Hover'),
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBorder::getType(),
|
|
[
|
|
'name' => 'image_hover_border',
|
|
'selector' => '{{WRAPPER}} img:hover',
|
|
'fields_options' => [
|
|
'color' => [
|
|
'dynamic' => [],
|
|
],
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addResponsiveControl(
|
|
'image_hover_border_radius',
|
|
[
|
|
'label' => __('Border Radius'),
|
|
'type' => ControlsManager::DIMENSIONS,
|
|
'size_units' => ['px', '%'],
|
|
'selectors' => [
|
|
$image_hover_selector => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'image_hover_opacity',
|
|
[
|
|
'label' => __('Opacity'),
|
|
'type' => ControlsManager::SLIDER,
|
|
'range' => [
|
|
'px' => [
|
|
'max' => 1,
|
|
'min' => 0.10,
|
|
'step' => 0.01,
|
|
],
|
|
],
|
|
'selectors' => [
|
|
$image_hover_selector => 'opacity: {{SIZE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBoxShadow::getType(),
|
|
[
|
|
'name' => 'image_hover_box_shadow',
|
|
'exclude' => [
|
|
'box_shadow_position',
|
|
],
|
|
'selector' => $image_hover_selector,
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlCssFilter::getType(),
|
|
[
|
|
'name' => 'image_hover_css_filters',
|
|
'selector' => $image_hover_selector,
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'image_hover_transition',
|
|
[
|
|
'label' => __('Transition Duration') . ' (s)',
|
|
'type' => ControlsManager::SLIDER,
|
|
'range' => [
|
|
'px' => [
|
|
'max' => 3,
|
|
'step' => 0.1,
|
|
],
|
|
],
|
|
'selectors' => [
|
|
$image_selector => 'transition-duration: {{SIZE}}s',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->endControlsTabs();
|
|
|
|
$this->endControlsSection();
|
|
}
|
|
|
|
private function addFormFieldsSection()
|
|
{
|
|
// Use an array for better readability.
|
|
$label_selector = '{{WRAPPER}} label';
|
|
$input_selector = '{{WRAPPER}} .form-control, {{WRAPPER}} .elementor-field-textual';
|
|
$input_focus_selector = '{{WRAPPER}} .form-control:focus, {{WRAPPER}} .elementor-field-textual:focus';
|
|
|
|
$this->startControlsSection(
|
|
'section_form_fields',
|
|
[
|
|
'label' => __('Form Fields'),
|
|
'tab' => ControlsManager::TAB_STYLE,
|
|
]
|
|
);
|
|
|
|
$this->addSchemesNotice();
|
|
|
|
$this->addControl(
|
|
'form_label_heading',
|
|
[
|
|
'type' => ControlsManager::HEADING,
|
|
'label' => __('Label'),
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'form_label_color',
|
|
[
|
|
'label' => __('Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
$label_selector => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTypography::getType(),
|
|
[
|
|
'label' => __('Typography'),
|
|
'name' => 'form_label_typography',
|
|
'selector' => $label_selector,
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'form_field_heading',
|
|
[
|
|
'type' => ControlsManager::HEADING,
|
|
'label' => __('Field'),
|
|
'separator' => 'before',
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTypography::getType(),
|
|
[
|
|
'label' => __('Typography'),
|
|
'name' => 'form_field_typography',
|
|
'selector' => $input_selector,
|
|
]
|
|
);
|
|
|
|
$this->startControlsTabs('tabs_form_field_style');
|
|
|
|
$this->startControlsTab(
|
|
'tab_form_field_normal',
|
|
[
|
|
'label' => __('Normal'),
|
|
]
|
|
);
|
|
|
|
$this->addFormFieldStateTabControls('form_field', $input_selector);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->startControlsTab(
|
|
'tab_form_field_focus',
|
|
[
|
|
'label' => __('Focus'),
|
|
]
|
|
);
|
|
|
|
$this->addFormFieldStateTabControls('form_field_focus', $input_focus_selector);
|
|
|
|
$this->addControl(
|
|
'form_field_focus_transition_duration',
|
|
[
|
|
'label' => __('Transition Duration') . ' (ms)',
|
|
'type' => ControlsManager::SLIDER,
|
|
'selectors' => [
|
|
$input_selector => 'transition: {{SIZE}}ms',
|
|
],
|
|
'range' => [
|
|
'px' => [
|
|
'min' => 0,
|
|
'max' => 3000,
|
|
],
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
|
|
$this->endControlsTabs();
|
|
|
|
$this->addResponsiveControl(
|
|
'form_field_padding',
|
|
[
|
|
'label' => __('Padding'),
|
|
'type' => ControlsManager::DIMENSIONS,
|
|
'size_units' => ['px', 'em', '%'],
|
|
'selectors' => [
|
|
$input_selector => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
|
'select.form-control:not([size]):not([multiple])' => 'height: auto;',
|
|
],
|
|
'separator' => 'before',
|
|
]
|
|
);
|
|
|
|
$this->endControlsSection();
|
|
}
|
|
|
|
private function addBodySection()
|
|
{
|
|
$this->startControlsSection(
|
|
'section_background',
|
|
[
|
|
'label' => __('Background'),
|
|
'tab' => ControlsManager::TAB_STYLE,
|
|
]
|
|
);
|
|
|
|
$this->addSchemesNotice();
|
|
|
|
$this->startControlsTabs('background_tabs_style');
|
|
|
|
foreach ([
|
|
'body' => '{{WRAPPER}}',
|
|
'wrapper' => '{{WRAPPER}} #wrapper',
|
|
'content' => '{{WRAPPER}} #content',
|
|
] as $tab => $wrapper) {
|
|
$this->startControlsTab(
|
|
"tab_background_$tab",
|
|
[
|
|
'label' => __(ucfirst($tab)),
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBackground::getType(),
|
|
[
|
|
'name' => "{$tab}_background",
|
|
'types' => ['classic', 'gradient'],
|
|
'selector' => $wrapper,
|
|
'fields_options' => [
|
|
// 'background' => [
|
|
// 'frontend_available' => true,
|
|
// ],
|
|
'color' => [
|
|
'default' => 'wrapper' === $tab ? '#00000000' : '',
|
|
'dynamic' => [],
|
|
],
|
|
'color_b' => [
|
|
'dynamic' => [],
|
|
],
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsTab();
|
|
}
|
|
|
|
$this->endControlsTabs();
|
|
|
|
$this->endControlsSection();
|
|
}
|
|
|
|
private function addLayoutSection()
|
|
{
|
|
$this->startControlsSection(
|
|
'section_layout',
|
|
[
|
|
'label' => __('Layout'),
|
|
'tab' => ControlsManager::TAB_STYLE,
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'override_container',
|
|
[
|
|
'label' => __('Override Theme Container'),
|
|
'type' => ControlsManager::SWITCHER,
|
|
'selectors' => [
|
|
'{{WRAPPER}} .container' => 'width: {{container_width.SIZE}}{{container_width.UNIT}}',
|
|
'(tablet){{WRAPPER}} .container' => 'width: {{container_width_tablet.SIZE}}{{container_width_tablet.UNIT}}',
|
|
'(mobile){{WRAPPER}} .container' => 'width: {{container_width_mobile.SIZE}}{{container_width_mobile.UNIT}}',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addResponsiveControl(
|
|
'container_width',
|
|
[
|
|
'label' => __('Content Width'),
|
|
'type' => ControlsManager::SLIDER,
|
|
'size_units' => ['px', 'vw'],
|
|
'range' => [
|
|
'px' => [
|
|
'min' => 300,
|
|
'max' => 1500,
|
|
'step' => 10,
|
|
],
|
|
'vw' => [
|
|
'min' => 1,
|
|
],
|
|
],
|
|
'tablet_default' => [
|
|
'unit' => 'vw',
|
|
],
|
|
'mobile_default' => [
|
|
'unit' => 'vw',
|
|
],
|
|
'placeholder' => '1140',
|
|
'device_args' => [
|
|
ControlsStack::RESPONSIVE_TABLET => [
|
|
'placeholder' => '',
|
|
],
|
|
ControlsStack::RESPONSIVE_MOBILE => [
|
|
'placeholder' => '',
|
|
],
|
|
],
|
|
'description' => __('Sets the default width of the content area (Default: 1140)'),
|
|
'selectors' => [
|
|
'.elementor-section.elementor-section-boxed > .elementor-container' => 'max-width: {{SIZE}}{{UNIT}}',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'space_between_widgets',
|
|
[
|
|
'label' => __('Widgets Space') . ' (px)',
|
|
'type' => ControlsManager::SLIDER,
|
|
'placeholder' => '20',
|
|
'range' => [
|
|
'px' => [
|
|
'max' => 40,
|
|
],
|
|
],
|
|
'description' => __('Sets the default space between widgets (Default: 20)'),
|
|
'selectors' => [
|
|
'.elementor-widget:not(:last-child)' => 'margin-bottom: {{SIZE}}{{UNIT}}',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsSection();
|
|
}
|
|
|
|
private function addBreadcrumbSection()
|
|
{
|
|
$this->startControlsSection(
|
|
'section_breadcrumb',
|
|
[
|
|
'label' => __('Breadcrumb'),
|
|
'tab' => ControlsManager::TAB_STYLE,
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'breadcrumb_color',
|
|
[
|
|
'label' => __('Text Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
'{{WRAPPER}} .breadcrumb:not(#e) li' => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'breadcrumb_link_color',
|
|
[
|
|
'label' => __('Link Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
'{{WRAPPER}} .breadcrumb:not(#e) li a' => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'breadcrumb_link_color_hover',
|
|
[
|
|
'label' => __('Link Hover Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
'{{WRAPPER}} .breadcrumb:not(#e) li a:hover' => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTypography::getType(),
|
|
[
|
|
'label' => __('Typography'),
|
|
'name' => 'breadcrumb_typography',
|
|
'selector' => '{{WRAPPER}} .breadcrumb:not(#e) li',
|
|
]
|
|
);
|
|
|
|
$this->addResponsiveControl(
|
|
'breadcrumb_align',
|
|
[
|
|
'label' => __('Alignment'),
|
|
'type' => ControlsManager::CHOOSE,
|
|
'options' => [
|
|
'left' => [
|
|
'title' => __('Left'),
|
|
'icon' => 'eicon-text-align-left',
|
|
],
|
|
'center' => [
|
|
'title' => __('Center'),
|
|
'icon' => 'eicon-text-align-center',
|
|
],
|
|
'right' => [
|
|
'title' => __('Right'),
|
|
'icon' => 'eicon-text-align-right',
|
|
],
|
|
],
|
|
'selectors' => [
|
|
'{{WRAPPER}} .breadcrumb ol' => 'text-align: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsSection();
|
|
}
|
|
|
|
private function addPageTitleSection()
|
|
{
|
|
$this->startControlsSection(
|
|
'section_page_title',
|
|
[
|
|
'label' => __('Page Title'),
|
|
'tab' => ControlsManager::TAB_STYLE,
|
|
]
|
|
);
|
|
|
|
$title_selector = implode(', ', array_map(
|
|
function ($selector) {
|
|
return "{{WRAPPER}} $selector, {{WRAPPER}} $selector *";
|
|
},
|
|
preg_split('/\s*,\s*/', \Configuration::get('elementor_page_title_selector'))
|
|
)) . ', {{WRAPPER}} .ce-page-title *';
|
|
|
|
$this->addControl(
|
|
'title_color',
|
|
[
|
|
'label' => __('Text Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
$title_selector => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlTypography::getType(),
|
|
[
|
|
'label' => __('Typography'),
|
|
'name' => 'title_typography',
|
|
'selector' => $title_selector,
|
|
]
|
|
);
|
|
|
|
$this->addResponsiveControl(
|
|
'title_align',
|
|
[
|
|
'label' => __('Text Align'),
|
|
'type' => ControlsManager::CHOOSE,
|
|
'label_block' => false,
|
|
'options' => [
|
|
'left' => [
|
|
'title' => __('Left'),
|
|
'icon' => 'eicon-h-align-left',
|
|
],
|
|
'center' => [
|
|
'title' => __('Center'),
|
|
'icon' => 'eicon-h-align-center',
|
|
],
|
|
'right' => [
|
|
'title' => __('Right'),
|
|
'icon' => 'eicon-h-align-right',
|
|
],
|
|
],
|
|
'selectors' => [
|
|
$title_selector => 'text-align: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsSection();
|
|
}
|
|
|
|
private function addLightboxSection()
|
|
{
|
|
$this->startControlsSection(
|
|
'section_lightbox',
|
|
[
|
|
'label' => __('Lightbox'),
|
|
'tab' => ControlsManager::TAB_STYLE,
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'lightbox_color',
|
|
[
|
|
'label' => __('Background Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
'.elementor-lightbox' => 'background-color: {{VALUE}}',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'lightbox_ui_color',
|
|
[
|
|
'label' => __('UI Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
'.elementor-lightbox' => '--lightbox-ui-color: {{VALUE}}',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'lightbox_ui_color_hover',
|
|
[
|
|
'label' => __('UI Hover Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
'.elementor-lightbox' => '--lightbox-ui-color-hover: {{VALUE}}',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
'lightbox_text_color',
|
|
[
|
|
'label' => __('Text Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
'.elementor-lightbox' => '--lightbox-text-color: {{VALUE}}',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBoxShadow::getType(),
|
|
[
|
|
'name' => 'lightbox_box_shadow',
|
|
'selector' => '.elementor-lightbox .elementor-lightbox-image',
|
|
]
|
|
);
|
|
|
|
$this->addResponsiveControl(
|
|
'lightbox_icons_size',
|
|
[
|
|
'label' => __('Toolbar Icons Size'),
|
|
'type' => ControlsManager::SLIDER,
|
|
'default' => [
|
|
'size' => \Configuration::get('lightbox_icons_size') ?: '',
|
|
],
|
|
'selectors' => [
|
|
'.elementor-lightbox' => '--lightbox-header-icons-size: {{SIZE}}{{UNIT}}',
|
|
],
|
|
'separator' => 'before',
|
|
]
|
|
);
|
|
|
|
$this->addResponsiveControl(
|
|
'lightbox_slider_icons_size',
|
|
[
|
|
'label' => __('Navigation Icons Size'),
|
|
'type' => ControlsManager::SLIDER,
|
|
'default' => [
|
|
'size' => \Configuration::get('lightbox_slider_icons_size') ?: '',
|
|
],
|
|
'selectors' => [
|
|
'.elementor-lightbox' => '--lightbox-navigation-icons-size: {{SIZE}}{{UNIT}}',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endControlsSection();
|
|
}
|
|
|
|
private function addFormFieldStateTabControls($prefix, $selector)
|
|
{
|
|
$this->addControl(
|
|
$prefix . '_text_color',
|
|
[
|
|
'label' => __('Text Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
$selector => 'color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
$prefix . '_background_color',
|
|
[
|
|
'label' => __('Background Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
$selector => 'background-color: {{VALUE}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBoxShadow::getType(),
|
|
[
|
|
'name' => $prefix . '_box_shadow',
|
|
'selector' => $selector,
|
|
]
|
|
);
|
|
|
|
if ('form_field_focus' === $prefix) {
|
|
$this->addControl(
|
|
$prefix . '_outline',
|
|
[
|
|
'label' => __('Outline'),
|
|
'type' => ControlsManager::POPOVER_TOGGLE,
|
|
'render_type' => 'ui',
|
|
]
|
|
);
|
|
|
|
$this->startPopover();
|
|
|
|
$this->addControl(
|
|
$prefix . '_outline_type',
|
|
[
|
|
'label' => __('Type'),
|
|
'type' => ControlsManager::SELECT,
|
|
'options' => [
|
|
'solid' => _x('Solid', 'Border Control'),
|
|
'double' => _x('Double', 'Border Control'),
|
|
'dotted' => _x('Dotted', 'Border Control'),
|
|
'dashed' => _x('Dashed', 'Border Control'),
|
|
'groove' => _x('Groove', 'Border Control'),
|
|
],
|
|
'default' => 'solid',
|
|
'selectors' => [
|
|
$selector => 'outline-style: {{VALUE}};',
|
|
],
|
|
'condition' => [
|
|
$prefix . '_outline!' => '',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
$prefix . '_outline_color',
|
|
[
|
|
'label' => __('Color'),
|
|
'type' => ControlsManager::COLOR,
|
|
'dynamic' => [],
|
|
'selectors' => [
|
|
$selector => 'outline-color: {{VALUE}};',
|
|
],
|
|
'condition' => [
|
|
$prefix . '_outline!' => '',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addResponsiveControl(
|
|
$prefix . 'outline_width',
|
|
[
|
|
'label' => __('Width') . ' (px)',
|
|
'type' => ControlsManager::SLIDER,
|
|
'range' => [
|
|
'px' => [
|
|
'max' => 20,
|
|
],
|
|
],
|
|
'selectors' => [
|
|
$selector => 'outline-width: {{SIZE}}{{UNIT}};',
|
|
],
|
|
'condition' => [
|
|
$prefix . '_outline!' => '',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->endPopover();
|
|
}
|
|
|
|
$this->addGroupControl(
|
|
GroupControlBorder::getType(),
|
|
[
|
|
'name' => $prefix . '_border',
|
|
'selector' => $selector,
|
|
'fields_options' => [
|
|
'color' => [
|
|
'dynamic' => [],
|
|
],
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->addControl(
|
|
$prefix . '_border_radius',
|
|
[
|
|
'label' => __('Border Radius'),
|
|
'type' => ControlsManager::DIMENSIONS,
|
|
'size_units' => ['px', '%'],
|
|
'selectors' => [
|
|
$selector => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
|
],
|
|
]
|
|
);
|
|
}
|
|
|
|
protected function saveElements($elements)
|
|
{
|
|
if (self::isInitialDocument() || Helper::isAdminImport()) {
|
|
parent::saveElements($elements);
|
|
}
|
|
}
|
|
|
|
protected function saveSettings($settings)
|
|
{
|
|
$old_settings = $this->getMeta(static::PAGE_META_KEY);
|
|
|
|
if (!empty($old_settings['custom_colors'])) {
|
|
$settings['custom_colors'] = $old_settings['custom_colors'];
|
|
}
|
|
unset($settings['button_type']);
|
|
|
|
parent::saveSettings($settings);
|
|
}
|
|
}
|