| @@ -1,9 +1,8 @@ | ||
| 1 | 1 | <?php |
| 2 | 2 | namespace Elementor; |
| 3 | 3 | |
| 4 | 4 | use Elementor\Core\Breakpoints\Manager as Breakpoints_Manager; |
| 5 | -use Elementor\Plugin; | |
| 6 | 5 | |
| 7 | 6 | if ( ! defined( 'ABSPATH' ) ) { |
| 8 | 7 | exit; // Exit if accessed directly. |
| 9 | 8 | } |
| @@ -74,12 +73,8 @@ | ||
| 74 | 73 | public function get_icon() { |
| 75 | 74 | return 'eicon-column'; |
| 76 | 75 | } |
| 77 | 76 | |
| 78 | - protected function is_dynamic_content(): bool { | |
| 79 | - return false; | |
| 80 | - } | |
| 81 | - | |
| 82 | 77 | /** |
| 83 | 78 | * Get initial config. |
| 84 | 79 | * |
| 85 | 80 | * Retrieve the current section initial configuration. |
| @@ -119,9 +114,9 @@ | ||
| 119 | 114 | 'tab' => Controls_Manager::TAB_LAYOUT, |
| 120 | 115 | ] |
| 121 | 116 | ); |
| 122 | 117 | |
| 123 | - // Element Name for the Navigator. | |
| 118 | + // Element Name for the Navigator | |
| 124 | 119 | $this->add_control( |
| 125 | 120 | '_title', |
| 126 | 121 | [ |
| 127 | 122 | 'label' => esc_html__( 'Title', 'elementor' ), |
| @@ -176,12 +171,17 @@ | ||
| 176 | 171 | ], |
| 177 | 172 | ] |
| 178 | 173 | ); |
| 179 | 174 | |
| 175 | + $is_dome_optimization_active = Plugin::$instance->experiments->is_feature_active( 'e_dom_optimization' ); | |
| 176 | + $main_selector_element = $is_dome_optimization_active ? 'widget' : 'column'; | |
| 177 | + $widget_wrap_child = $is_dome_optimization_active ? '' : ' > .elementor-widget-wrap'; | |
| 178 | + $column_wrap_child = $is_dome_optimization_active ? '' : ' > .elementor-column-wrap'; | |
| 179 | + | |
| 180 | 180 | $this->add_responsive_control( |
| 181 | 181 | 'content_position', |
| 182 | 182 | [ |
| 183 | - 'label' => esc_html__( 'Vertical Alignment', 'elementor' ), | |
| 183 | + 'label' => esc_html__( 'Vertical Align', 'elementor' ), | |
| 184 | 184 | 'type' => Controls_Manager::SELECT, |
| 185 | 185 | 'default' => '', |
| 186 | 186 | 'options' => [ |
| 187 | 187 | '' => esc_html__( 'Default', 'elementor' ), |
| @@ -196,12 +196,12 @@ | ||
| 196 | 196 | 'top' => 'flex-start', |
| 197 | 197 | 'bottom' => 'flex-end', |
| 198 | 198 | ], |
| 199 | 199 | 'selectors' => [ |
| 200 | - // TODO: The following line is for BC since 2.7.0. | |
| 201 | - '.elementor-bc-flex-widget {{WRAPPER}}.elementor-column .elementor-widget-wrap' => 'align-items: {{VALUE}}', | |
| 202 | - // This specificity is intended to make sure column css overwrites section css on vertical alignment (content_position). | |
| 203 | - '{{WRAPPER}}.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated' => 'align-content: {{VALUE}}; align-items: {{VALUE}};', | |
| 200 | + // TODO: The following line is for BC since 2.7.0 | |
| 201 | + '.elementor-bc-flex-widget {{WRAPPER}}.elementor-column .elementor-' . $main_selector_element . '-wrap' => 'align-items: {{VALUE}}', | |
| 202 | + // This specificity is intended to make sure column css overwrites section css on vertical alignment (content_position) | |
| 203 | + '{{WRAPPER}}.elementor-column.elementor-element[data-element_type="column"] > .elementor-' . $main_selector_element . '-wrap.elementor-element-populated' . $widget_wrap_child => 'align-content: {{VALUE}}; align-items: {{VALUE}};', | |
| 204 | 204 | ], |
| 205 | 205 | ] |
| 206 | 206 | ); |
| 207 | 207 | |
| @@ -207,9 +207,9 @@ | ||
| 207 | 207 | |
| 208 | 208 | $this->add_responsive_control( |
| 209 | 209 | 'align', |
| 210 | 210 | [ |
| 211 | - 'label' => esc_html__( 'Horizontal Alignment', 'elementor' ), | |
| 211 | + 'label' => esc_html__( 'Horizontal Align', 'elementor' ), | |
| 212 | 212 | 'type' => Controls_Manager::SELECT, |
| 213 | 213 | 'default' => '', |
| 214 | 214 | 'options' => [ |
| 215 | 215 | '' => esc_html__( 'Default', 'elementor' ), |
| @@ -220,17 +220,14 @@ | ||
| 220 | 220 | 'space-around' => esc_html__( 'Space Around', 'elementor' ), |
| 221 | 221 | 'space-evenly' => esc_html__( 'Space Evenly', 'elementor' ), |
| 222 | 222 | ], |
| 223 | 223 | 'selectors' => [ |
| 224 | - '{{WRAPPER}}.elementor-column > .elementor-widget-wrap' => 'justify-content: {{VALUE}}', | |
| 224 | + '{{WRAPPER}}.elementor-column' . $column_wrap_child . ' > .elementor-widget-wrap' => 'justify-content: {{VALUE}}', | |
| 225 | 225 | ], |
| 226 | 226 | ] |
| 227 | 227 | ); |
| 228 | 228 | |
| 229 | - $optimized_markup = Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' ); | |
| 230 | - $space_between_widgets = $optimized_markup | |
| 231 | - ? '--kit-widget-spacing: {{VALUE}}px' | |
| 232 | - : 'margin-block-end: {{VALUE}}px'; | |
| 229 | + $space_between_widgets_selector = $is_dome_optimization_active ? '' : '> .elementor-column-wrap '; | |
| 233 | 230 | |
| 234 | 231 | $this->add_responsive_control( |
| 235 | 232 | 'space_between_widgets', |
| 236 | 233 | [ |
| @@ -237,9 +234,9 @@ | ||
| 237 | 234 | 'label' => esc_html__( 'Widgets Space', 'elementor' ) . ' (px)', |
| 238 | 235 | 'type' => Controls_Manager::NUMBER, |
| 239 | 236 | 'placeholder' => 20, |
| 240 | 237 | 'selectors' => [ |
| 241 | - '{{WRAPPER}} > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute)' => $space_between_widgets, // Need the full path for exclude the inner section. | |
| 238 | + '{{WRAPPER}} ' . $space_between_widgets_selector . '> .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute)' => 'margin-bottom: {{VALUE}}px', //Need the full path for exclude the inner section | |
| 242 | 239 | ], |
| 243 | 240 | ] |
| 244 | 241 | ); |
| 245 | 242 | |
| @@ -291,50 +288,19 @@ | ||
| 291 | 288 | Group_Control_Background::get_type(), |
| 292 | 289 | [ |
| 293 | 290 | 'name' => 'background', |
| 294 | 291 | 'types' => [ 'classic', 'gradient', 'slideshow' ], |
| 295 | - 'selector' => '{{WRAPPER}}:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, {{WRAPPER}} > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer', | |
| 292 | + 'selector' => '{{WRAPPER}}:not(.elementor-motion-effects-element-type-background) > .elementor-' . $main_selector_element . '-wrap, {{WRAPPER}} > .elementor-' . $main_selector_element . '-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer', | |
| 296 | 293 | 'fields_options' => [ |
| 297 | 294 | 'background' => [ |
| 298 | 295 | 'frontend_available' => true, |
| 299 | 296 | ], |
| 300 | - ], | |
| 301 | - ] | |
| 302 | - ); | |
| 303 | - | |
| 304 | - $this->add_control( | |
| 305 | - 'handle_slideshow_asset_loading', | |
| 306 | - [ | |
| 307 | - 'type' => Controls_Manager::HIDDEN, | |
| 308 | - 'assets' => [ | |
| 309 | - 'styles' => [ | |
| 310 | - [ | |
| 311 | - 'name' => 'e-swiper', | |
| 312 | - 'conditions' => [ | |
| 313 | - 'terms' => [ | |
| 314 | - [ | |
| 315 | - 'name' => 'background_background', | |
| 316 | - 'operator' => '===', | |
| 317 | - 'value' => 'slideshow', | |
| 318 | - ], | |
| 319 | - ], | |
| 320 | - ], | |
| 297 | + 'image' => [ | |
| 298 | + 'background_lazyload' => [ | |
| 299 | + 'active' => true, | |
| 300 | + 'keys' => [ 'background_image', 'url' ], | |
| 321 | 301 | ], |
| 322 | 302 | ], |
| 323 | - 'scripts' => [ | |
| 324 | - [ | |
| 325 | - 'name' => 'swiper', | |
| 326 | - 'conditions' => [ | |
| 327 | - 'terms' => [ | |
| 328 | - [ | |
| 329 | - 'name' => 'background_background', | |
| 330 | - 'operator' => '===', | |
| 331 | - 'value' => 'slideshow', | |
| 332 | - ], | |
| 333 | - ], | |
| 334 | - ], | |
| 335 | - ], | |
| 336 | - ], | |
| 337 | 303 | ], |
| 338 | 304 | ] |
| 339 | 305 | ); |
| 340 | 306 | |
| @@ -357,20 +323,15 @@ | ||
| 357 | 323 | |
| 358 | 324 | $this->add_control( |
| 359 | 325 | 'background_hover_transition', |
| 360 | 326 | [ |
| 361 | - 'label' => esc_html__( 'Transition Duration', 'elementor' ) . ' (s)', | |
| 327 | + 'label' => esc_html__( 'Transition Duration', 'elementor' ), | |
| 362 | 328 | 'type' => Controls_Manager::SLIDER, |
| 329 | + 'size_units' => [ 's', 'ms' ], | |
| 363 | 330 | 'default' => [ |
| 331 | + 'unit' => 's', | |
| 364 | 332 | 'size' => 0.3, |
| 365 | 333 | ], |
| 366 | - 'range' => [ | |
| 367 | - 'px' => [ | |
| 368 | - 'min' => 0, | |
| 369 | - 'max' => 3, | |
| 370 | - 'step' => 0.1, | |
| 371 | - ], | |
| 372 | - ], | |
| 373 | 334 | 'render_type' => 'ui', |
| 374 | 335 | 'separator' => 'before', |
| 375 | 336 | ] |
| 376 | 337 | ); |
| @@ -517,20 +478,15 @@ | ||
| 517 | 478 | |
| 518 | 479 | $this->add_control( |
| 519 | 480 | 'background_overlay_hover_transition', |
| 520 | 481 | [ |
| 521 | - 'label' => esc_html__( 'Transition Duration', 'elementor' ) . ' (s)', | |
| 482 | + 'label' => esc_html__( 'Transition Duration', 'elementor' ), | |
| 522 | 483 | 'type' => Controls_Manager::SLIDER, |
| 484 | + 'size_units' => [ 's', 'ms' ], | |
| 523 | 485 | 'default' => [ |
| 486 | + 'unit' => 's', | |
| 524 | 487 | 'size' => 0.3, |
| 525 | 488 | ], |
| 526 | - 'range' => [ | |
| 527 | - 'px' => [ | |
| 528 | - 'min' => 0, | |
| 529 | - 'max' => 3, | |
| 530 | - 'step' => 0.1, | |
| 531 | - ], | |
| 532 | - ], | |
| 533 | 489 | 'render_type' => 'ui', |
| 534 | 490 | 'separator' => 'before', |
| 535 | 491 | ] |
| 536 | 492 | ); |
| @@ -570,9 +526,9 @@ | ||
| 570 | 526 | 'border_radius', |
| 571 | 527 | [ |
| 572 | 528 | 'label' => esc_html__( 'Border Radius', 'elementor' ), |
| 573 | 529 | 'type' => Controls_Manager::DIMENSIONS, |
| 574 | - 'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ], | |
| 530 | + 'size_units' => [ 'px', '%', 'em' ], | |
| 575 | 531 | 'selectors' => [ |
| 576 | 532 | '{{WRAPPER}} > .elementor-element-populated, {{WRAPPER}} > .elementor-element-populated > .elementor-background-overlay, {{WRAPPER}} > .elementor-background-slideshow' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', |
| 577 | 533 | ], |
| 578 | 534 | ] |
| @@ -607,9 +563,9 @@ | ||
| 607 | 563 | 'border_radius_hover', |
| 608 | 564 | [ |
| 609 | 565 | 'label' => esc_html__( 'Border Radius', 'elementor' ), |
| 610 | 566 | 'type' => Controls_Manager::DIMENSIONS, |
| 611 | - 'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ], | |
| 567 | + 'size_units' => [ 'px', '%', 'em' ], | |
| 612 | 568 | 'selectors' => [ |
| 613 | 569 | '{{WRAPPER}}:hover > .elementor-element-populated, {{WRAPPER}}:hover > .elementor-element-populated > .elementor-background-overlay' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', |
| 614 | 570 | ], |
| 615 | 571 | ] |
| @@ -625,21 +581,16 @@ | ||
| 625 | 581 | |
| 626 | 582 | $this->add_control( |
| 627 | 583 | 'border_hover_transition', |
| 628 | 584 | [ |
| 629 | - 'label' => esc_html__( 'Transition Duration', 'elementor' ) . ' (s)', | |
| 585 | + 'label' => esc_html__( 'Transition Duration', 'elementor' ), | |
| 630 | 586 | 'type' => Controls_Manager::SLIDER, |
| 631 | 587 | 'separator' => 'before', |
| 588 | + 'size_units' => [ 's', 'ms' ], | |
| 632 | 589 | 'default' => [ |
| 590 | + 'unit' => 's', | |
| 633 | 591 | 'size' => 0.3, |
| 634 | 592 | ], |
| 635 | - 'range' => [ | |
| 636 | - 'px' => [ | |
| 637 | - 'min' => 0, | |
| 638 | - 'max' => 3, | |
| 639 | - 'step' => 0.1, | |
| 640 | - ], | |
| 641 | - ], | |
| 642 | 593 | 'conditions' => [ |
| 643 | 594 | 'relation' => 'or', |
| 644 | 595 | 'terms' => [ |
| 645 | 596 | [ |
| @@ -647,9 +598,9 @@ | ||
| 647 | 598 | 'operator' => '!==', |
| 648 | 599 | 'value' => '', |
| 649 | 600 | ], |
| 650 | 601 | [ |
| 651 | - 'name' => 'border_hover_border', | |
| 602 | + 'name' => 'border_border', | |
| 652 | 603 | 'operator' => '!==', |
| 653 | 604 | 'value' => '', |
| 654 | 605 | ], |
| 655 | 606 | ], |
| @@ -654,10 +605,10 @@ | ||
| 654 | 605 | ], |
| 655 | 606 | ], |
| 656 | 607 | ], |
| 657 | 608 | 'selectors' => [ |
| 658 | - '{{WRAPPER}} > .elementor-element-populated' => 'transition: background {{background_hover_transition.SIZE}}s, border {{SIZE}}s, border-radius {{SIZE}}s, box-shadow {{SIZE}}s', | |
| 659 | - '{{WRAPPER}} > .elementor-element-populated > .elementor-background-overlay' => 'transition: background {{background_overlay_hover_transition.SIZE}}s, border-radius {{SIZE}}s, opacity {{background_overlay_hover_transition.SIZE}}s', | |
| 609 | + '{{WRAPPER}} > .elementor-element-populated' => 'transition: background {{background_hover_transition.SIZE}}{{background_hover_transition.UNIT}}, border {{SIZE}}{{UNIT}}, border-radius {{SIZE}}{{UNIT}}, box-shadow {{SIZE}}{{UNIT}}', | |
| 610 | + '{{WRAPPER}} > .elementor-element-populated > .elementor-background-overlay' => 'transition: background {{background_overlay_hover_transition.SIZE}}{{background_overlay_hover_transition.UNIT}}, border-radius {{SIZE}}{{UNIT}}, opacity {{background_overlay_hover_transition.SIZE}}{{background_overlay_hover_transition.UNIT}}', | |
| 660 | 611 | ], |
| 661 | 612 | ] |
| 662 | 613 | ); |
| 663 | 614 | |
| @@ -685,8 +636,9 @@ | ||
| 685 | 636 | 'default' => '', |
| 686 | 637 | 'selectors' => [ |
| 687 | 638 | '{{WRAPPER}} .elementor-element-populated .elementor-heading-title' => 'color: {{VALUE}};', |
| 688 | 639 | ], |
| 640 | + 'separator' => 'none', | |
| 689 | 641 | ] |
| 690 | 642 | ); |
| 691 | 643 | |
| 692 | 644 | $this->add_control( |
| @@ -730,10 +682,10 @@ | ||
| 730 | 682 | [ |
| 731 | 683 | 'label' => esc_html__( 'Text Align', 'elementor' ), |
| 732 | 684 | 'type' => Controls_Manager::CHOOSE, |
| 733 | 685 | 'options' => [ |
| 734 | - 'start' => [ | |
| 735 | - 'title' => esc_html__( 'Start', 'elementor' ), | |
| 686 | + 'left' => [ | |
| 687 | + 'title' => esc_html__( 'Left', 'elementor' ), | |
| 736 | 688 | 'icon' => 'eicon-text-align-left', |
| 737 | 689 | ], |
| 738 | 690 | 'center' => [ |
| 739 | 691 | 'title' => esc_html__( 'Center', 'elementor' ), |
| @@ -738,10 +690,10 @@ | ||
| 738 | 690 | 'center' => [ |
| 739 | 691 | 'title' => esc_html__( 'Center', 'elementor' ), |
| 740 | 692 | 'icon' => 'eicon-text-align-center', |
| 741 | 693 | ], |
| 742 | - 'end' => [ | |
| 743 | - 'title' => esc_html__( 'End', 'elementor' ), | |
| 694 | + 'right' => [ | |
| 695 | + 'title' => esc_html__( 'Right', 'elementor' ), | |
| 744 | 696 | 'icon' => 'eicon-text-align-right', |
| 745 | 697 | ], |
| 746 | 698 | 'justify' => [ |
| 747 | 699 | 'title' => esc_html__( 'Justified', 'elementor' ), |
| @@ -747,13 +699,8 @@ | ||
| 747 | 699 | 'title' => esc_html__( 'Justified', 'elementor' ), |
| 748 | 700 | 'icon' => 'eicon-text-align-justify', |
| 749 | 701 | ], |
| 750 | 702 | ], |
| 751 | - 'classes' => 'elementor-control-start-end', | |
| 752 | - 'selectors_dictionary' => [ | |
| 753 | - 'left' => is_rtl() ? 'end' : 'start', | |
| 754 | - 'right' => is_rtl() ? 'start' : 'end', | |
| 755 | - ], | |
| 756 | 703 | 'selectors' => [ |
| 757 | 704 | '{{WRAPPER}} > .elementor-element-populated' => 'text-align: {{VALUE}};', |
| 758 | 705 | ], |
| 759 | 706 | ] |
| @@ -775,9 +722,9 @@ | ||
| 775 | 722 | 'margin', |
| 776 | 723 | [ |
| 777 | 724 | 'label' => esc_html__( 'Margin', 'elementor' ), |
| 778 | 725 | 'type' => Controls_Manager::DIMENSIONS, |
| 779 | - 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ], | |
| 726 | + 'size_units' => [ 'px', 'em', '%', 'rem' ], | |
| 780 | 727 | 'selectors' => [ |
| 781 | 728 | '{{WRAPPER}} > .elementor-element-populated' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}; |
| 782 | 729 | --e-column-margin-right: {{RIGHT}}{{UNIT}}; --e-column-margin-left: {{LEFT}}{{UNIT}};', |
| 783 | 730 | ], |
| @@ -783,16 +730,22 @@ | ||
| 783 | 730 | ], |
| 784 | 731 | ] |
| 785 | 732 | ); |
| 786 | 733 | |
| 734 | + $padding_selector = '{{WRAPPER}} > .elementor-element-populated'; | |
| 735 | + | |
| 736 | + if ( ! $is_dome_optimization_active ) { | |
| 737 | + $padding_selector .= ' > .elementor-widget-wrap'; | |
| 738 | + } | |
| 739 | + | |
| 787 | 740 | $this->add_responsive_control( |
| 788 | 741 | 'padding', |
| 789 | 742 | [ |
| 790 | 743 | 'label' => esc_html__( 'Padding', 'elementor' ), |
| 791 | 744 | 'type' => Controls_Manager::DIMENSIONS, |
| 792 | - 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ], | |
| 745 | + 'size_units' => [ 'px', 'em', '%', 'rem' ], | |
| 793 | 746 | 'selectors' => [ |
| 794 | - '{{WRAPPER}} > .elementor-element-populated' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', | |
| 747 | + $padding_selector => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', | |
| 795 | 748 | ], |
| 796 | 749 | ] |
| 797 | 750 | ); |
| 798 | 751 | |
| @@ -813,11 +766,8 @@ | ||
| 813 | 766 | [ |
| 814 | 767 | 'label' => esc_html__( 'CSS ID', 'elementor' ), |
| 815 | 768 | 'type' => Controls_Manager::TEXT, |
| 816 | 769 | 'default' => '', |
| 817 | - 'ai' => [ | |
| 818 | - 'active' => false, | |
| 819 | - ], | |
| 820 | 770 | 'dynamic' => [ |
| 821 | 771 | 'active' => true, |
| 822 | 772 | ], |
| 823 | 773 | 'title' => esc_html__( 'Add your custom id WITHOUT the Pound key. e.g: my-id', 'elementor' ), |
| @@ -831,11 +781,8 @@ | ||
| 831 | 781 | [ |
| 832 | 782 | 'label' => esc_html__( 'CSS Classes', 'elementor' ), |
| 833 | 783 | 'type' => Controls_Manager::TEXT, |
| 834 | 784 | 'default' => '', |
| 835 | - 'ai' => [ | |
| 836 | - 'active' => false, | |
| 837 | - ], | |
| 838 | 785 | 'dynamic' => [ |
| 839 | 786 | 'active' => true, |
| 840 | 787 | ], |
| 841 | 788 | 'prefix_class' => '', |
| @@ -843,11 +790,9 @@ | ||
| 843 | 790 | 'classes' => 'elementor-control-direction-ltr', |
| 844 | 791 | ] |
| 845 | 792 | ); |
| 846 | 793 | |
| 847 | - Plugin::$instance->controls_manager->add_display_conditions_controls( $this ); | |
| 848 | - | |
| 849 | - // TODO: Backward comparability for deprecated controls. | |
| 794 | + // TODO: Backward comparability for deprecated controls | |
| 850 | 795 | $this->add_control( |
| 851 | 796 | 'screen_sm', |
| 852 | 797 | [ |
| 853 | 798 | 'type' => Controls_Manager::HIDDEN, |
| @@ -863,9 +808,9 @@ | ||
| 863 | 808 | ], |
| 864 | 809 | 'prefix_class' => 'elementor-sm-', |
| 865 | 810 | ] |
| 866 | 811 | ); |
| 867 | - // END Backward comparability. | |
| 812 | + // END Backward comparability | |
| 868 | 813 | |
| 869 | 814 | $this->end_controls_section(); |
| 870 | 815 | |
| 871 | 816 | $this->start_controls_section( |
| @@ -875,10 +820,8 @@ | ||
| 875 | 820 | 'tab' => Controls_Manager::TAB_ADVANCED, |
| 876 | 821 | ] |
| 877 | 822 | ); |
| 878 | 823 | |
| 879 | - Plugin::$instance->controls_manager->add_motion_effects_promotion_control( $this ); | |
| 880 | - | |
| 881 | 824 | $this->add_responsive_control( |
| 882 | 825 | 'animation', |
| 883 | 826 | [ |
| 884 | 827 | 'label' => esc_html__( 'Entrance Animation', 'elementor' ), |
| @@ -933,14 +876,9 @@ | ||
| 933 | 876 | |
| 934 | 877 | $this->add_control( |
| 935 | 878 | 'responsive_description', |
| 936 | 879 | [ |
| 937 | - 'raw' => sprintf( | |
| 938 | - /* translators: 1: Link open tag, 2: Link close tag. */ | |
| 939 | - esc_html__( 'Responsive visibility will take effect only on %1$s preview mode %2$s or live page, and not while editing in Elementor.', 'elementor' ), | |
| 940 | - '<a href="javascript: $e.run( \'panel/close\' )">', | |
| 941 | - '</a>' | |
| 942 | - ), | |
| 880 | + 'raw' => esc_html__( 'Responsive visibility will take effect only on preview or live page, and not while editing in Elementor.', 'elementor' ), | |
| 943 | 881 | 'type' => Controls_Manager::RAW_HTML, |
| 944 | 882 | 'content_classes' => 'elementor-descriptor', |
| 945 | 883 | ] |
| 946 | 884 | ); |
| @@ -962,11 +900,17 @@ | ||
| 962 | 900 | * @since 2.9.0 |
| 963 | 901 | * @access protected |
| 964 | 902 | */ |
| 965 | 903 | protected function content_template() { |
| 904 | + $is_dom_optimization_active = Plugin::$instance->experiments->is_feature_active( 'e_dom_optimization' ); | |
| 905 | + $wrapper_element = $is_dom_optimization_active ? 'widget' : 'column'; | |
| 906 | + | |
| 966 | 907 | ?> |
| 967 | - <div class="elementor-widget-wrap"> | |
| 908 | + <div class="elementor-<?php echo esc_attr( $wrapper_element ); ?>-wrap"> | |
| 968 | 909 | <div class="elementor-background-overlay"></div> |
| 910 | + <?php if ( ! $is_dom_optimization_active ) { ?> | |
| 911 | + <div class="elementor-widget-wrap"></div> | |
| 912 | + <?php } ?> | |
| 969 | 913 | </div> |
| 970 | 914 | <?php |
| 971 | 915 | } |
| 972 | 916 | |
| @@ -980,15 +924,15 @@ | ||
| 980 | 924 | */ |
| 981 | 925 | public function before_render() { |
| 982 | 926 | $settings = $this->get_settings_for_display(); |
| 983 | 927 | |
| 984 | - $overlay_background = $settings['background_overlay_background'] ?? ''; | |
| 985 | - $overlay_hover_background = $settings['background_overlay_hover_background'] ?? ''; | |
| 928 | + $has_background_overlay = in_array( $settings['background_overlay_background'], [ 'classic', 'gradient' ], true ) || | |
| 929 | + in_array( $settings['background_overlay_hover_background'], [ 'classic', 'gradient' ], true ); | |
| 986 | 930 | |
| 987 | - $has_background_overlay = in_array( $overlay_background, [ 'classic', 'gradient' ], true ) || | |
| 988 | - in_array( $overlay_hover_background, [ 'classic', 'gradient' ], true ); | |
| 931 | + $is_dom_optimization_active = Plugin::$instance->experiments->is_feature_active( 'e_dom_optimization' ); | |
| 932 | + $wrapper_attribute_string = $is_dom_optimization_active ? '_widget_wrapper' : '_inner_wrapper'; | |
| 989 | 933 | |
| 990 | - $column_wrap_classes = [ 'elementor-widget-wrap' ]; | |
| 934 | + $column_wrap_classes = $is_dom_optimization_active ? [ 'elementor-widget-wrap' ] : [ 'elementor-column-wrap' ]; | |
| 991 | 935 | |
| 992 | 936 | if ( $this->get_children() ) { |
| 993 | 937 | $column_wrap_classes[] = 'elementor-element-populated'; |
| 994 | 938 | } |
| @@ -993,10 +937,13 @@ | ||
| 993 | 937 | $column_wrap_classes[] = 'elementor-element-populated'; |
| 994 | 938 | } |
| 995 | 939 | |
| 996 | 940 | $this->add_render_attribute( [ |
| 941 | + '_inner_wrapper' => [ | |
| 942 | + 'class' => $column_wrap_classes, | |
| 943 | + ], | |
| 997 | 944 | '_widget_wrapper' => [ |
| 998 | - 'class' => $column_wrap_classes, | |
| 945 | + 'class' => $is_dom_optimization_active ? $column_wrap_classes : 'elementor-widget-wrap', | |
| 999 | 946 | ], |
| 1000 | 947 | '_background_overlay' => [ |
| 1001 | 948 | 'class' => [ 'elementor-background-overlay' ], |
| 1002 | 949 | ], |
| @@ -1005,12 +952,15 @@ | ||
| 1005 | 952 | <<?php |
| 1006 | 953 | // PHPCS - the method get_html_tag is safe. |
| 1007 | 954 | echo $this->get_html_tag(); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped |
| 1008 | 955 | ?> <?php $this->print_render_attribute_string( '_wrapper' ); ?>> |
| 1009 | - <div <?php $this->print_render_attribute_string( '_widget_wrapper' ); ?>> | |
| 956 | + <div <?php $this->print_render_attribute_string( $wrapper_attribute_string ); ?>> | |
| 1010 | 957 | <?php if ( $has_background_overlay ) : ?> |
| 1011 | 958 | <div <?php $this->print_render_attribute_string( '_background_overlay' ); ?>></div> |
| 1012 | 959 | <?php endif; ?> |
| 960 | + <?php if ( ! $is_dom_optimization_active ) : ?> | |
| 961 | + <div <?php $this->print_render_attribute_string( '_widget_wrapper' ); ?>> | |
| 962 | + <?php endif; ?> | |
| 1013 | 963 | <?php |
| 1014 | 964 | } |
| 1015 | 965 | |
| 1016 | 966 | /** |
| @@ -1021,9 +971,11 @@ | ||
| 1021 | 971 | * @since 1.0.0 |
| 1022 | 972 | * @access public |
| 1023 | 973 | */ |
| 1024 | 974 | public function after_render() { |
| 1025 | - ?> | |
| 975 | + if ( ! Plugin::$instance->experiments->is_feature_active( 'e_dom_optimization' ) ) { ?> | |
| 976 | + </div> | |
| 977 | + <?php } ?> | |
| 1026 | 978 | </div> |
| 1027 | 979 | </<?php |
| 1028 | 980 | // PHPCS - the method get_html_tag is safe. |
| 1029 | 981 | echo $this->get_html_tag(); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>> |