← All changes
|
includes/elementor/modules/checkout/widgets/style-controls.php
+132
-2
1.6.5
→
2.7.0
View file →
| @@ -3,8 +3,12 @@ | ||
| 3 | 3 | namespace Sellkit\Elementor\Modules\Checkout\Widgets; |
| 4 | 4 | |
| 5 | 5 | defined( 'ABSPATH' ) || die(); |
| 6 | 6 | |
| 7 | +use Elementor\Controls_Manager; | |
| 8 | +use Elementor\Group_Control_Typography; | |
| 9 | +use Elementor\Core\Kits\Documents\Tabs\Global_Colors; | |
| 10 | + | |
| 7 | 11 | class Style_Controls extends \Sellkit_Elementor_Checkout_Widget { |
| 8 | 12 | public function __construct() { |
| 9 | 13 | $this->form_style(); |
| 10 | 14 | $this->heading_style(); |
| @@ -113,8 +117,24 @@ | ||
| 113 | 117 | 'tab' => 'style', |
| 114 | 118 | ] |
| 115 | 119 | ); |
| 116 | 120 | |
| 121 | + $this->add_responsive_control( | |
| 122 | + 'section_heading_style_padding', | |
| 123 | + [ | |
| 124 | + 'label' => esc_html__( 'Padding', 'sellkit' ), | |
| 125 | + 'type' => 'dimensions', | |
| 126 | + 'size_units' => [ 'px', '%', 'em' ], | |
| 127 | + 'selectors' => [ | |
| 128 | + '{{WRAPPER}} .heading' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', | |
| 129 | + '{{WRAPPER}} #sellkit-checkout-widget-id form .sellkit-one-page-checkout-shipping .shipping_address #shipping_text_title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', | |
| 130 | + '{{WRAPPER}} #sellkit-checkout-widget-id form .sellkit-multistep-checkout-second #shipping_header_title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', | |
| 131 | + '{{WRAPPER}} #sellkit-checkout-widget-id form .sellkit-multistep-checkout-third #payment_method_title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', | |
| 132 | + '{{WRAPPER}} #sellkit-checkout-widget-id h4#shipping_header_title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', | |
| 133 | + ], | |
| 134 | + ] | |
| 135 | + ); | |
| 136 | + | |
| 117 | 137 | $this->add_group_control( |
| 118 | 138 | 'typography', |
| 119 | 139 | [ |
| 120 | 140 | 'name' => 'heading_typography2', |
| @@ -177,13 +197,27 @@ | ||
| 177 | 197 | |
| 178 | 198 | $this->add_control( |
| 179 | 199 | 'sub_heading_title', |
| 180 | 200 | [ |
| 181 | - 'label' => esc_html__( 'Sub Heading', 'sellkit' ), | |
| 201 | + 'show_label' => false, | |
| 182 | 202 | 'type' => 'raw_html', |
| 203 | + 'raw' => esc_html__( 'Sub Heading', 'sellkit' ), | |
| 204 | + 'content_classes' => 'sellkit-elementor-editor-bulk-text' | |
| 183 | 205 | ] |
| 184 | 206 | ); |
| 185 | 207 | |
| 208 | + $this->add_responsive_control( | |
| 209 | + 'section_sub_heading_style_padding', | |
| 210 | + [ | |
| 211 | + 'label' => esc_html__( 'Padding', 'sellkit' ), | |
| 212 | + 'type' => 'dimensions', | |
| 213 | + 'size_units' => [ 'px', '%', 'em' ], | |
| 214 | + 'selectors' => [ | |
| 215 | + '{{WRAPPER}} #sellkit-checkout-widget-id .sub-heading' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', | |
| 216 | + ], | |
| 217 | + ] | |
| 218 | + ); | |
| 219 | + | |
| 186 | 220 | $this->add_group_control( |
| 187 | 221 | 'typography', |
| 188 | 222 | [ |
| 189 | 223 | 'name' => 'sub-heading_typography', |
| @@ -497,8 +531,37 @@ | ||
| 497 | 531 | 'type' => 'heading', |
| 498 | 532 | ] |
| 499 | 533 | ); |
| 500 | 534 | |
| 535 | + $this->add_responsive_control( | |
| 536 | + 'button_primary_size_width', | |
| 537 | + [ | |
| 538 | + 'label' => esc_html__( 'Width', 'sellkit' ), | |
| 539 | + 'type' => 'slider', | |
| 540 | + 'size_units' => [ 'px', '%', 'em', 'custom' ], | |
| 541 | + 'range' => [ | |
| 542 | + 'px' => [ | |
| 543 | + 'min' => 0, | |
| 544 | + 'max' => 1000, | |
| 545 | + 'step' => 1, | |
| 546 | + ], | |
| 547 | + '%' => [ | |
| 548 | + 'min' => 0, | |
| 549 | + 'max' => 100, | |
| 550 | + 'step' => 1, | |
| 551 | + ], | |
| 552 | + 'em' => [ | |
| 553 | + 'min' => 0, | |
| 554 | + 'max' => 10, | |
| 555 | + 'step' => 0.1, | |
| 556 | + ], | |
| 557 | + ], | |
| 558 | + 'selectors' => [ | |
| 559 | + '{{WRAPPER}} #sellkit-checkout-widget-id .sellkit-checkout-widget-primary-button' => 'width: {{SIZE}}{{UNIT}} !important;', | |
| 560 | + ], | |
| 561 | + ] | |
| 562 | + ); | |
| 563 | + | |
| 501 | 564 | $this->start_controls_tabs( |
| 502 | 565 | 'button_primary_style_tabs' |
| 503 | 566 | ); |
| 504 | 567 | |
| @@ -515,8 +578,9 @@ | ||
| 515 | 578 | 'label' => esc_html__( 'Text Color', 'sellkit' ), |
| 516 | 579 | 'type' => 'color', |
| 517 | 580 | 'selectors' => [ |
| 518 | 581 | '{{WRAPPER}} .sellkit-checkout-widget-primary-button' => 'color: {{VALUE}} !important', |
| 582 | + '{{WRAPPER}} #sellkit-checkout-widget-id .place-order .sellkit-checkout-widget-primary-button' => 'color: {{VALUE}}', | |
| 519 | 583 | ], |
| 520 | 584 | ] |
| 521 | 585 | ); |
| 522 | 586 | |
| @@ -543,8 +607,9 @@ | ||
| 543 | 607 | 'label' => esc_html__( 'Background Color', 'sellkit' ), |
| 544 | 608 | 'type' => 'color', |
| 545 | 609 | 'selectors' => [ |
| 546 | 610 | '{{WRAPPER}} .sellkit-checkout-widget-primary-button' => 'background-color: {{VALUE}} !important', |
| 611 | + '{{WRAPPER}} #sellkit-checkout-widget-id .place-order .sellkit-checkout-widget-primary-button' => 'background-color: {{VALUE}}', | |
| 547 | 612 | ], |
| 548 | 613 | ] |
| 549 | 614 | ); |
| 550 | 615 | |
| @@ -563,8 +628,10 @@ | ||
| 563 | 628 | 'label' => esc_html__( 'Text Color', 'sellkit' ), |
| 564 | 629 | 'type' => 'color', |
| 565 | 630 | 'selectors' => [ |
| 566 | 631 | '{{WRAPPER}} .sellkit-checkout-widget-primary-button:hover' => 'color: {{VALUE}} !important', |
| 632 | + '{{WRAPPER}} #sellkit-checkout-widget-id .place-order .sellkit-checkout-widget-primary-button:hover' => 'color: {{VALUE}}', | |
| 633 | + '{{WRAPPER}} .sellkit-checkout-widget-main-wrapper #sellkit-checkout-widget-id form .place-order #place_order:is(button):hover' => 'color: {{VALUE}}', | |
| 567 | 634 | ], |
| 568 | 635 | ] |
| 569 | 636 | ); |
| 570 | 637 | |
| @@ -583,8 +650,10 @@ | ||
| 583 | 650 | 'label' => esc_html__( 'Background Color', 'sellkit' ), |
| 584 | 651 | 'type' => 'color', |
| 585 | 652 | 'selectors' => [ |
| 586 | 653 | '{{WRAPPER}} .sellkit-checkout-widget-primary-button:hover' => 'background-color: {{VALUE}} !important', |
| 654 | + '{{WRAPPER}} #sellkit-checkout-widget-id .place-order .sellkit-checkout-widget-primary-button:hover' => 'background-color: {{VALUE}}', | |
| 655 | + '{{WRAPPER}} .sellkit-checkout-widget-main-wrapper #sellkit-checkout-widget-id form .place-order #place_order:is(button):hover' => 'background-color: {{VALUE}}', | |
| 587 | 656 | ], |
| 588 | 657 | ] |
| 589 | 658 | ); |
| 590 | 659 | |
| @@ -774,8 +843,31 @@ | ||
| 774 | 843 | 'selector' => '{{WRAPPER}} .woocommerce-checkout .sellkit-checkout-widget-return-button > span', |
| 775 | 844 | ] |
| 776 | 845 | ); |
| 777 | 846 | |
| 847 | + $this->add_control( | |
| 848 | + 'button_return_link_icon_size', | |
| 849 | + [ | |
| 850 | + 'label' => esc_html__( 'Icon Size', 'sellkit' ), | |
| 851 | + 'type' => Controls_Manager::SLIDER, | |
| 852 | + 'size_units' => [ 'px' ], | |
| 853 | + 'range' => [ | |
| 854 | + 'px' => [ | |
| 855 | + 'min' => 0, | |
| 856 | + 'max' => 200, | |
| 857 | + 'step' => 1, | |
| 858 | + ], | |
| 859 | + ], | |
| 860 | + 'default' => [ | |
| 861 | + 'unit' => 'px', | |
| 862 | + 'size' => 15, | |
| 863 | + ], | |
| 864 | + 'selectors' => [ | |
| 865 | + '{{WRAPPER}} .woocommerce-checkout .sellkit-checkout-widget-return-button > svg' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};', | |
| 866 | + ], | |
| 867 | + ] | |
| 868 | + ); | |
| 869 | + | |
| 778 | 870 | $this->start_controls_tabs( |
| 779 | 871 | 'button_return_link_style_tabs' |
| 780 | 872 | ); |
| 781 | 873 | |
| @@ -793,8 +885,9 @@ | ||
| 793 | 885 | 'type' => 'color', |
| 794 | 886 | 'selectors' => [ |
| 795 | 887 | '{{WRAPPER}} .sellkit-checkout-widget-return-button > span' => 'color: {{VALUE}}', |
| 796 | 888 | '{{WRAPPER}} .sellkit-checkout-widget-return-button > i' => 'color: {{VALUE}}', |
| 889 | + '{{WRAPPER}} .sellkit-checkout-widget-return-button > svg' => 'fill: {{VALUE}}', | |
| 797 | 890 | ], |
| 798 | 891 | ] |
| 799 | 892 | ); |
| 800 | 893 | |
| @@ -850,9 +943,10 @@ | ||
| 850 | 943 | 'selector' => '{{WRAPPER}} .sellkit-widget-checkout-fields p input::placeholder, |
| 851 | 944 | .sellkit-widget-checkout-fields p select::placeholder, |
| 852 | 945 | #sellkit-checkout-widget-id #sellkit-checkout-billing-field-wrapper .mini-title, |
| 853 | 946 | #sellkit-checkout-widget-id #sellkit-checkout-widget-shipping-fields .mini-title, |
| 854 | - #sellkit-checkout-widget-id .sellkit-custom-coupon-form .jx-coupon::placeholder', | |
| 947 | + #sellkit-checkout-widget-id .sellkit-custom-coupon-form .jx-coupon::placeholder, | |
| 948 | + .sellkit-checkout-order-fields .sellkit-checkout-order-notes label', | |
| 855 | 949 | ] |
| 856 | 950 | ); |
| 857 | 951 | |
| 858 | 952 | $this->add_control( |
| @@ -866,8 +960,9 @@ | ||
| 866 | 960 | '{{WRAPPER}} .sellkit-widget-checkout-fields p textarea::placeholder' => 'color: {{VALUE}}', |
| 867 | 961 | '{{WRAPPER}} #sellkit-checkout-widget-id #sellkit-checkout-billing-field-wrapper .mini-title' => 'color: {{VALUE}}', |
| 868 | 962 | '{{WRAPPER}} #sellkit-checkout-widget-id #sellkit-checkout-widget-shipping-fields .mini-title' => 'color: {{VALUE}}', |
| 869 | 963 | '{{WRAPPER}} #sellkit-checkout-widget-id .sellkit-custom-coupon-form .jx-coupon::placeholder' => 'color: {{VALUE}}', |
| 964 | + '{{WRAPPER}} #sellkit-checkout-widget-id .sellkit-checkout-order-notes label' => 'color: {{VALUE}}', | |
| 870 | 965 | ], |
| 871 | 966 | ] |
| 872 | 967 | ); |
| 873 | 968 | |
| @@ -901,8 +996,9 @@ | ||
| 901 | 996 | 'selectors' => [ |
| 902 | 997 | '{{WRAPPER}} #sellkit-checkout-widget-id .sellkit-widget-checkout-fields input' => 'color: {{VALUE}}', |
| 903 | 998 | '{{WRAPPER}} #sellkit-checkout-widget-id .sellkit-widget-checkout-fields textarea' => 'color: {{VALUE}}', |
| 904 | 999 | '{{WRAPPER}} #sellkit-checkout-widget-id .sellkit-widget-checkout-fields select' => 'color: {{VALUE}}', |
| 1000 | + '{{WRAPPER}} #sellkit-checkout-widget-id .sellkit-checkout-field-select .sellkit-select-appearance' => 'color: {{VALUE}}', | |
| 905 | 1001 | '{{WRAPPER}} #sellkit-checkout-widget-id .sellkit-widget-checkout-fields option' => 'color: {{VALUE}}', |
| 906 | 1002 | '{{WRAPPER}} #sellkit-checkout-widget-id .sellkit-custom-coupon-form .jx-coupon' => 'color: {{VALUE}}', |
| 907 | 1003 | ], |
| 908 | 1004 | ] |
| @@ -1078,8 +1174,42 @@ | ||
| 1078 | 1174 | ] |
| 1079 | 1175 | ); |
| 1080 | 1176 | |
| 1081 | 1177 | $this->divider( 'order_summary_divider_1' ); |
| 1178 | + | |
| 1179 | + $this->add_control( | |
| 1180 | + 'order_summary_style_heading_product_variation', | |
| 1181 | + [ | |
| 1182 | + 'label' => esc_html__( 'Product Variation', 'sellkit' ), | |
| 1183 | + 'type' => 'heading', | |
| 1184 | + ] | |
| 1185 | + ); | |
| 1186 | + | |
| 1187 | + $this->add_group_control( | |
| 1188 | + Group_Control_Typography::get_type(), | |
| 1189 | + [ | |
| 1190 | + 'name' => 'product_variation_typography', | |
| 1191 | + 'selector' => '{{WRAPPER}} #sellkit-checkout-variations .sellkit-checkout-variation-item, | |
| 1192 | + {{WRAPPER}} #sellkit-checkout-variations i', | |
| 1193 | + ] | |
| 1194 | + ); | |
| 1195 | + | |
| 1196 | + $this->add_control( | |
| 1197 | + 'product_variation_text_color', | |
| 1198 | + [ | |
| 1199 | + 'label' => esc_html__( 'Color', 'sellkit' ), | |
| 1200 | + 'type' => Controls_Manager::COLOR, | |
| 1201 | + 'selectors' => [ | |
| 1202 | + '{{WRAPPER}} #sellkit-checkout-variations .sellkit-checkout-variation-item' => 'color: {{VALUE}} !important', | |
| 1203 | + '{{WRAPPER}} #sellkit-checkout-variations i' => 'color: {{VALUE}} !important', | |
| 1204 | + ], | |
| 1205 | + 'global' => [ | |
| 1206 | + 'default' => Global_Colors::COLOR_TEXT, | |
| 1207 | + ], | |
| 1208 | + ] | |
| 1209 | + ); | |
| 1210 | + | |
| 1211 | + $this->divider( 'order_summary_divider_variation_ends' ); | |
| 1082 | 1212 | |
| 1083 | 1213 | $this->add_control( |
| 1084 | 1214 | 'order_summary_style_heading_2', |
| 1085 | 1215 | [ |