| @@ -587,9 +587,10 @@ | ||
| 587 | 587 | 'label' => esc_html__('Color', 'king-addons'), |
| 588 | 588 | 'type' => Controls_Manager::COLOR, |
| 589 | 589 | 'default' => '#000000', |
| 590 | 590 | 'selectors' => [ |
| 591 | - '.king-addons-popup-close-button-{{ID}}' => 'color: {{VALUE}};', | |
| 591 | + '.king-addons-popup-close-button-{{ID}}' => 'color: {{VALUE}}; fill: {{VALUE}};', | |
| 592 | + '.king-addons-popup-close-button-{{ID}} svg' => 'color: {{VALUE}}; fill: {{VALUE}};', | |
| 592 | 593 | ], |
| 593 | 594 | ] |
| 594 | 595 | ); |
| 595 | 596 | |
| @@ -602,9 +603,9 @@ | ||
| 602 | 603 | 'step' => 1, |
| 603 | 604 | 'default' => 20, |
| 604 | 605 | 'separator' => 'before', |
| 605 | 606 | 'selectors' => [ |
| 606 | - '.king-addons-popup-close-button-{{ID}}' => 'font-size: {{VALUE}}px;', | |
| 607 | + '.king-addons-popup-close-button-{{ID}}' => 'font-size: {{VALUE}}px; width: {{VALUE}}px; height: {{VALUE}}px;', | |
| 607 | 608 | ], |
| 608 | 609 | ] |
| 609 | 610 | ); |
| 610 | 611 | |
| @@ -655,16 +656,16 @@ | ||
| 655 | 656 | $this_ID = $this->get_id(); |
| 656 | 657 | $class_ID = 'king-addons-popup-' . $this_ID; |
| 657 | 658 | $overlay_ID = 'king-addons-popup-overlay-' . $this_ID; |
| 658 | 659 | |
| 660 | + $class_selector_js = esc_attr(wp_json_encode('.' . $class_ID)); | |
| 661 | + $overlay_selector_js = esc_attr(wp_json_encode('.' . $overlay_ID)); | |
| 662 | + | |
| 659 | 663 | if (!empty($settings['kng_popup_template'])) { |
| 660 | 664 | |
| 661 | 665 | echo '<div class="king-addons-popup-overlay ' . |
| 662 | 666 | esc_attr($overlay_ID) . '" onclick="'; |
| 663 | - echo "document.querySelector('." . | |
| 664 | - esc_attr($class_ID) . "').classList.toggle('king-addons-popup-active'); document.querySelector('." . | |
| 665 | - esc_attr($overlay_ID) . "').style.opacity = '0'; document.body.style.pointerEvents = 'none'; setTimeout(function () {document.querySelector('." . | |
| 666 | - esc_attr($overlay_ID) . "').style.display = 'none'; document.body.style.pointerEvents = '';}, 500);"; | |
| 667 | + echo "document.querySelector(" . $class_selector_js . ").classList.toggle('king-addons-popup-active'); document.querySelector(" . $overlay_selector_js . ").style.opacity = '0'; document.body.style.pointerEvents = 'none'; setTimeout(function () {document.querySelector(" . $overlay_selector_js . ").style.display = 'none'; document.body.style.pointerEvents = '';}, 500);"; | |
| 667 | 668 | echo '"></div>'; |
| 668 | 669 | |
| 669 | 670 | echo '<div class="king-addons-popup ' . |
| 670 | 671 | esc_attr($class_ID) . ' king-addons-popup-position-' . |
| @@ -677,12 +678,9 @@ | ||
| 677 | 678 | if ('' != $settings['kng_popup_close_btn_icon']['value']) { |
| 678 | 679 | |
| 679 | 680 | echo '<div class="king-addons-popup-close-button king-addons-popup-close-button-' . |
| 680 | 681 | esc_attr($this_ID) . '" onclick="'; |
| 681 | - echo "document.querySelector('." . | |
| 682 | - esc_attr($class_ID) . "').classList.toggle('king-addons-popup-active'); document.querySelector('." . | |
| 683 | - esc_attr($overlay_ID) . "').style.opacity = '0'; document.body.style.pointerEvents = 'none'; setTimeout(function () {document.querySelector('." . | |
| 684 | - esc_attr($overlay_ID) . "').style.display = 'none'; document.body.style.pointerEvents = '';}, 500);"; | |
| 682 | + echo "document.querySelector(" . $class_selector_js . ").classList.toggle('king-addons-popup-active'); document.querySelector(" . $overlay_selector_js . ").style.opacity = '0'; document.body.style.pointerEvents = 'none'; setTimeout(function () {document.querySelector(" . $overlay_selector_js . ").style.display = 'none'; document.body.style.pointerEvents = '';}, 500);"; | |
| 685 | 683 | echo '">'; |
| 686 | 684 | |
| 687 | 685 | Icons_Manager::render_icon($settings['kng_popup_close_btn_icon']); |
| 688 | 686 | echo '</div>'; |
| @@ -704,12 +702,9 @@ | ||
| 704 | 702 | if ('' == $settings['kng_popup_disable_btn']) { |
| 705 | 703 | |
| 706 | 704 | echo '<button class="king-addons-popup-button king-addons-popup-button-' . |
| 707 | 705 | esc_attr($this_ID) . '" onclick="'; |
| 708 | - echo "document.querySelector('." . | |
| 709 | - esc_attr($class_ID) . "').classList.toggle('king-addons-popup-active'); document.querySelector('." . | |
| 710 | - esc_attr($overlay_ID) . "').style.display = 'block'; document.body.style.pointerEvents = 'none'; setTimeout(function () {document.querySelector('." . | |
| 711 | - esc_attr($overlay_ID) . "').style.opacity = '1';}, 1); setTimeout(function () {document.body.style.pointerEvents = '';}, 500);"; | |
| 706 | + echo "document.querySelector(" . $class_selector_js . ").classList.toggle('king-addons-popup-active'); document.querySelector(" . $overlay_selector_js . ").style.display = 'block'; document.body.style.pointerEvents = 'none'; setTimeout(function () {document.querySelector(" . $overlay_selector_js . ").style.opacity = '1';}, 1); setTimeout(function () {document.body.style.pointerEvents = '';}, 500);"; | |
| 712 | 707 | echo '">' . |
| 713 | 708 | esc_html($settings['kng_popup_btn_text']) . '</button>'; |
| 714 | 709 | |
| 715 | 710 | } |
| @@ -721,8 +716,15 @@ | ||
| 721 | 716 | document.addEventListener('DOMContentLoaded', function () { |
| 722 | 717 | |
| 723 | 718 | const offCanvas = document.querySelector('." . esc_js($class_ID) . "'); |
| 724 | 719 | const overlay = document.querySelector('." . esc_js($overlay_ID) . "'); |
| 720 | + | |
| 721 | + // With no template picked the widget prints a placeholder instead of | |
| 722 | + // the panel markup, so these lookups come back empty. Bail out rather | |
| 723 | + // than throwing on insertBefore and losing the handlers below. | |
| 724 | + if (!offCanvas || !overlay) { | |
| 725 | + return; | |
| 726 | + } | |
| 725 | 727 | |
| 726 | 728 | // Moves all Popupes to right after the <body> opens |
| 727 | 729 | document.body.insertBefore(overlay, document.body.firstChild); |
| 728 | 730 | document.body.insertBefore(offCanvas, document.body.firstChild); |
