← All changes | modules/page-single/widgets/page-single.php +603 -107 2.0.2 → 3.1.4 View file →

		@@ -13,15 +13,13 @@
13	13	use UltimateStoreKit\Base\Module_Base;
14	14
15	15	if (!defined('ABSPATH')) exit; // Exit if accessed directly
16	16
	17	+// phpcs:disable WordPressVIPMinimum.Performance.WPQueryParams -- WordPressVIPMinimum targets the VIP platform, not the plugin directory. These exclusionary parameters come from a widget's own "exclude" control: the list is whatever the site owner picked in Elementor, applied to a bounded result set, not an unbounded catalogue scan.
	18	+
17	19	// class Add_To_Cart extends Widget_Button {
18	20	class Page_Single extends Module_Base {
19	21
20		- // public function get_show_in_panel_tags() {
21		- // return ['shop_single'];
22		- // }
23		-
24	22	public function get_name() {
25	23	return 'usk-page-single';
26	24	}
27	25
		@@ -35,11 +33,14 @@
35	33
36	34	public function get_categories() {
37	35	return ['ultimate-store-kit-single'];
38	36	}
	37	+ public function show_in_panel() {
	38	+ return get_post_type() !== 'page';
	39	+ }
39	40
40	41	public function get_keywords() {
41		- return ['add', 'to', 'cart', 'woocommerce', 'wc', 'additional', 'info'];
	42	+ return ['add', 'to', 'cart', 'woocommerce', 'wc', 'additional', 'info', 'single', 'product', 'page'];
42	43	}
43	44
44	45	public function get_style_depends() {
45	46	if ($this->usk_is_edit_mode()) {
		@@ -48,9 +49,12 @@
48	49	return ['usk-font', 'usk-page-single'];
49	50	}
50	51	}
51	52
52		- public function register_controls() {
	53	+ public function has_widget_inner_wrapper(): bool {
	54	+ return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
	55	+ }
	56	+ protected function register_controls() {
53	57	$this->register_controls_title();
54	58	$this->register_controls_price();
55	59	$this->register_controls_add_to_cart();
56	60	$this->register_controls_tabs();
		@@ -80,8 +84,48 @@
80	84	'types' => ['classic', 'gradient'],
81	85	'selector' => '{{WRAPPER}} .usk-page-single span.onsale',
82	86	]
83	87	);
	88	+ $this->add_responsive_control(
	89	+ 'sale_badge_padding',
	90	+ [
	91	+ 'label' => esc_html__('Padding', 'ultimate-store-kit'),
	92	+ 'type' => Controls_Manager::DIMENSIONS,
	93	+ 'size_units' => ['px', 'em', '%'],
	94	+ 'selectors' => [
	95	+ '{{WRAPPER}} .usk-page-single span.onsale' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	96	+ ],
	97	+ ]
	98	+ );
	99	+ $this->add_responsive_control(
	100	+ 'sale_badge_margin',
	101	+ [
	102	+ 'label' => esc_html__('Margin', 'ultimate-store-kit'),
	103	+ 'type' => Controls_Manager::DIMENSIONS,
	104	+ 'size_units' => ['px', 'em', '%'],
	105	+ 'selectors' => [
	106	+ '{{WRAPPER}} .usk-page-single span.onsale' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	107	+ ],
	108	+ ]
	109	+ );
	110	+ $this->add_responsive_control(
	111	+ 'sale_badge_border_radius',
	112	+ [
	113	+ 'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
	114	+ 'type' => Controls_Manager::DIMENSIONS,
	115	+ 'size_units' => ['px', '%'],
	116	+ 'selectors' => [
	117	+ '{{WRAPPER}} .usk-page-single span.onsale' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	118	+ ],
	119	+ ]
	120	+ );
	121	+ $this->add_group_control(
	122	+ Group_Control_Typography::get_type(),
	123	+ [
	124	+ 'name' => 'sale_badge_typography',
	125	+ 'selector' => '{{WRAPPER}} .usk-page-single span.onsale',
	126	+ ]
	127	+ );
84	128	$this->end_controls_section();
85	129	}
86	130	protected function register_controls_title() {
87	131	$this->start_controls_section(
		@@ -111,8 +155,105 @@
111	155	]
112	156	);
113	157
114	158	$this->end_controls_section();
	159	+
	160	+ $this->start_controls_section(
	161	+ 'section_product_gallery_style',
	162	+ [
	163	+ 'label' => esc_html__('Product Image', 'ultimate-store-kit'),
	164	+ 'tab' => Controls_Manager::TAB_STYLE,
	165	+ ]
	166	+ );
	167	+
	168	+ $this->add_group_control(
	169	+ Group_Control_Background::get_type(),
	170	+ [
	171	+ 'name' => 'image_background',
	172	+ 'selector' => '.woocommerce {{WRAPPER}} .woocommerce-product-gallery__trigger + .woocommerce-product-gallery__wrapper,
	173	+ .woocommerce {{WRAPPER}} .flex-viewport, .woocommerce {{WRAPPER}} .flex-control-thumbs img, {{WRAPPER}} .woocommerce .woocommerce-product-gallery__wrapper',
	174	+ 'separator' => 'before',
	175	+ ]
	176	+ );
	177	+
	178	+ $this->add_group_control(
	179	+ Group_Control_Border::get_type(),
	180	+ [
	181	+ 'name' => 'image_border',
	182	+ 'selector' => '.woocommerce {{WRAPPER}} .woocommerce-product-gallery__trigger + .woocommerce-product-gallery__wrapper,
	183	+ .woocommerce {{WRAPPER}} .flex-viewport, .woocommerce {{WRAPPER}} .flex-control-thumbs img, {{WRAPPER}} .woocommerce .woocommerce-product-gallery__wrapper',
	184	+
	185	+ ]
	186	+ );
	187	+
	188	+ $this->add_responsive_control(
	189	+ 'image_border_radius',
	190	+ [
	191	+ 'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
	192	+ 'type' => Controls_Manager::DIMENSIONS,
	193	+ 'size_units' => ['px', '%', 'em', 'rem', 'custom'],
	194	+ 'selectors' => [
	195	+ '.woocommerce {{WRAPPER}} .woocommerce-product-gallery__trigger + .woocommerce-product-gallery__wrapper,
	196	+ .woocommerce {{WRAPPER}} .flex-viewport, {{WRAPPER}} .woocommerce .woocommerce-product-gallery__wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}',
	197	+ ],
	198	+ ]
	199	+ );
	200	+
	201	+ $this->add_control(
	202	+ 'spacing',
	203	+ [
	204	+ 'label' => esc_html__('Spacing', 'ultimate-store-kit'),
	205	+ 'type' => Controls_Manager::SLIDER,
	206	+ 'size_units' => ['px', 'em', 'rem', 'custom'],
	207	+ 'selectors' => [
	208	+ '.woocommerce {{WRAPPER}} .flex-viewport:not(:last-child)' => 'margin-bottom: {{SIZE}}{{UNIT}}',
	209	+ ],
	210	+ ]
	211	+ );
	212	+
	213	+ $this->add_control(
	214	+ 'heading_thumbs_style',
	215	+ [
	216	+ 'label' => esc_html__('Thumbnails', 'ultimate-store-kit'),
	217	+ 'type' => Controls_Manager::HEADING,
	218	+ 'separator' => 'before',
	219	+ ]
	220	+ );
	221	+
	222	+ $this->add_group_control(
	223	+ Group_Control_Border::get_type(),
	224	+ [
	225	+ 'name' => 'thumbs_border',
	226	+ 'selector' => '.woocommerce {{WRAPPER}} .flex-control-thumbs img',
	227	+ ]
	228	+ );
	229	+
	230	+ $this->add_responsive_control(
	231	+ 'thumbs_border_radius',
	232	+ [
	233	+ 'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
	234	+ 'type' => Controls_Manager::DIMENSIONS,
	235	+ 'size_units' => ['px', '%', 'em', 'rem', 'custom'],
	236	+ 'selectors' => [
	237	+ '.woocommerce {{WRAPPER}} .flex-control-thumbs img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}',
	238	+ ],
	239	+ ]
	240	+ );
	241	+
	242	+ $this->add_control(
	243	+ 'spacing_thumbs',
	244	+ [
	245	+ 'label' => esc_html__('Spacing', 'ultimate-store-kit'),
	246	+ 'type' => Controls_Manager::SLIDER,
	247	+ 'size_units' => ['px', 'em', 'rem', 'custom'],
	248	+ 'selectors' => [
	249	+ '.woocommerce {{WRAPPER}} .flex-control-thumbs li' => 'padding-right: calc({{SIZE}}{{UNIT}} / 2); padding-left: calc({{SIZE}}{{UNIT}} / 2); padding-bottom: {{SIZE}}{{UNIT}}',
	250	+ '.woocommerce {{WRAPPER}} .flex-control-thumbs' => 'margin-right: calc(-{{SIZE}}{{UNIT}} / 2); margin-left: calc(-{{SIZE}}{{UNIT}} / 2)',
	251	+ ],
	252	+ ]
	253	+ );
	254	+
	255	+ $this->end_controls_section();
115	256	}
116	257
117	258	protected function register_controls_price() {
118	259	$this->start_controls_section(
		@@ -123,14 +264,26 @@
123	264	]
124	265	);
125	266
126	267	$this->add_control(
	268	+ 'regular_price_color',
	269	+ [
	270	+ 'label' => esc_html__('Regular Color', 'ultimate-store-kit'),
	271	+ 'type' => Controls_Manager::COLOR,
	272	+ 'selectors' => [
	273	+ '{{WRAPPER}} .woocommerce div.product p.price del, {{WRAPPER}} .woocommerce div.product span.price del' => 'color: {{VALUE}};',
	274	+ ],
	275	+ ]
	276	+ );
	277	+
	278	+ $this->add_control(
127	279	'price_color',
128	280	[
129		- 'label' => esc_html__('Color', 'ultimate-store-kit'),
	281	+ 'label' => esc_html__('Sale Color', 'ultimate-store-kit'),
130	282	'type' => Controls_Manager::COLOR,
131	283	'selectors' => [
132	284	'{{WRAPPER}} .woocommerce div.product p.price,{{WRAPPER}} .woocommerce div.product span.price' => 'color: {{VALUE}};',
	285	+ '{{WRAPPER}} .woocommerce div.product p.price ins, {{WRAPPER}} .woocommerce div.product span.price ins' => 'color: {{VALUE}};',
133	286	],
134	287	]
135	288	);
136	289
		@@ -249,9 +402,9 @@
249	402	'separator' => 'before',
250	403	]
251	404	);
252	405
253		- $this->add_control(
	406	+ $this->add_responsive_control(
254	407	'add_to_cart_border_radius',
255	408	[
256	409	'label' => __('Border Radius', 'ultimate-store-kit'),
257	410	'type' => Controls_Manager::DIMENSIONS,
		@@ -261,20 +414,20 @@
261	414	],
262	415	]
263	416	);
264	417
265		- // $this->add_responsive_control(
266		- // 'add_to_cart_padding',
267		- // [
268		- // 'label' => __('Padding', 'ultimate-store-kit'),
269		- // 'type' => Controls_Manager::DIMENSIONS,
270		- // 'size_units' => ['px', 'em', '%'],
271		- // 'selectors' => [
272		- // '{{WRAPPER}} .woocommerce div.product form.cart .button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
273		- // ],
274		- // ]
275		- // );
276	418	$this->add_responsive_control(
	419	+ 'add_to_cart_padding',
	420	+ [
	421	+ 'label' => __('Padding', 'ultimate-store-kit'),
	422	+ 'type' => Controls_Manager::DIMENSIONS,
	423	+ 'size_units' => ['px', 'em', '%'],
	424	+ 'selectors' => [
	425	+ '{{WRAPPER}} .woocommerce div.product form.cart .button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	426	+ ],
	427	+ ]
	428	+ );
	429	+ $this->add_responsive_control(
277	430	'add_to_cart_size',
278	431	[
279	432	'label' => __('Size', 'ultimate-store-kit'),
280	433	'type' => Controls_Manager::SLIDER,
		@@ -279,9 +432,9 @@
279	432	'label' => __('Size', 'ultimate-store-kit'),
280	433	'type' => Controls_Manager::SLIDER,
281	434	'size_units' => ['px'],
282	435	'selectors' => [
283		- '{{WRAPPER}} .woocommerce div.product form.cart *' => 'height: {{SIZE}}{{UNIT}};',
	436	+ '{{WRAPPER}} .woocommerce div.product form.cart .button' => 'height: {{SIZE}}{{UNIT}};',
284	437	],
285	438	]
286	439	);
287	440
		@@ -345,11 +498,9 @@
345	498	]
346	499	);
347	500
348	501	$this->end_controls_tab();
349		-
350	502	$this->end_controls_tabs();
351		-
352	503	$this->end_controls_section();
353	504
354	505	$this->start_controls_section(
355	506	'qty_style',
		@@ -355,11 +506,8 @@
355	506	'qty_style',
356	507	[
357	508	'label' => __('Quantity Field', 'ultimate-store-kit'),
358	509	'tab' => Controls_Manager::TAB_STYLE,
359		- 'condition' => [
360		- 'show_quantity' => 'yes'
361		- ]
362	510	]
363	511	);
364	512
365	513	$this->add_control(
		@@ -366,9 +514,9 @@
366	514	'qty_fields_width',
367	515	[
368	516	'label' => esc_html__('Width', 'ultimate-store-kit'),
369	517	'type' => Controls_Manager::SLIDER,
370		- 'size_units' => ['px', '%'],
	518	+ 'size_units' => ['px', 'em', '%'],
371	519	'range' => [
372	520	'px' => [
373	521	'min' => 0,
374	522	'max' => 500,
		@@ -376,15 +524,15 @@
376	524	'%' => [
377	525	'min' => 0,
378	526	'max' => 100,
379	527	],
	528	+ 'em' => [
	529	+ 'min' => 0,
	530	+ 'max' => 20,
	531	+ ],
380	532	],
381		- 'default' => [
382		- 'unit' => '%',
383		- 'size' => 11
384		- ],
385	533	'selectors' => [
386		- '{{WRAPPER}} .cart .quantity' => 'width: {{SIZE}}{{UNIT}};',
	534	+ '{{WRAPPER}} .usk-page-single .woocommerce .quantity .qty' => 'width: {{SIZE}}{{UNIT}};',
387	535	],
388	536	]
389	537	);
390	538
		@@ -501,84 +649,8 @@
501	649	}
502	650
503	651	protected function register_controls_tabs() {
504	652
505		- // $this->start_controls_section(
506		- // 'tabs_nav_style_section',
507		- // [
508		- // 'label' => __('Tabs', 'ultimate-store-kit'),
509		- // 'tab' => Controls_Manager::TAB_STYLE,
510		- // ]
511		- // );
512		-
513		- // $this->add_responsive_control(
514		- // 'tabs_nav_align',
515		- // [
516		- // 'label' => __('Alignment', 'ultimate-store-kit'),
517		- // 'type' => Controls_Manager::CHOOSE,
518		- // 'options' => [
519		- // 'left' => [
520		- // 'title' => __('Left', 'ultimate-store-kit'),
521		- // 'icon' => 'eicon-text-align-left',
522		- // ],
523		- // 'center' => [
524		- // 'title' => __(
525		- // 'Center',
526		- // 'ultimate-store-kit'
527		- // ),
528		- // 'icon' => 'eicon-text-align-center',
529		- // ],
530		- // 'right' => [
531		- // 'title' => __(
532		- // 'Right',
533		- // 'ultimate-store-kit'
534		- // ),
535		- // 'icon' => 'eicon-text-align-right',
536		- // ],
537		- // ],
538		- // 'desktop_default' => 'left',
539		- // 'tablet_default' => 'left',
540		- // 'mobile_default' => 'left',
541		- // 'toggle' => false,
542		- // 'selectors' => [
543		- // '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs' => 'justify-content: {{VALUE}};',
544		- // ],
545		- // ]
546		- // );
547		-
548		- // $this->add_responsive_control(
549		- // 'tabs_nav_padding',
550		- // [
551		- // 'label' => esc_html__('Padding', 'ultimate-store-kit'),
552		- // 'type' => Controls_Manager::DIMENSIONS,
553		- // 'size_units' => ['px', 'em', '%'],
554		- // 'selectors' => [
555		- // '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
556		- // ],
557		- // ]
558		- // );
559		-
560		- // $this->add_responsive_control(
561		- // 'tabs_nav_item_radius',
562		- // [
563		- // 'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
564		- // 'type' => Controls_Manager::DIMENSIONS,
565		- // 'size_units' => ['px', 'em', '%'],
566		- // 'selectors' => [
567		- // '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
568		- // ],
569		- // ]
570		- // );
571		- // $this->add_group_control(
572		- // Group_Control_Border::get_type(),
573		- // [
574		- // 'name' => 'tabs_nav_border',
575		- // 'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs',
576		- // ]
577		- // );
578		-
579		- // $this->end_controls_section();
580		-
581	653	$this->start_controls_section(
582	654	'tabs_nav_item_style_section',
583	655	[
584	656	'label' => __('Tabs Item', 'ultimate-store-kit'),
		@@ -761,9 +833,20 @@
761	833	],
762	834	]
763	835	);
764	836
	837	+ $this->add_control(
	838	+ 'tabs_nav_active_line_color',
	839	+ [
	840	+ 'label' => __('Active Line Color', 'ultimate-store-kit') . BDTUSK_NC,
	841	+ 'type' => Controls_Manager::COLOR,
	842	+ 'selectors' => [
	843	+ '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a::after' => 'background-color: {{VALUE}};',
	844	+ ],
	845	+ ]
	846	+ );
765	847
	848	+
766	849	$this->end_controls_tab();
767	850
768	851	$this->end_controls_tabs();
769	852
		@@ -827,8 +910,16 @@
827	910	'selector' => '{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab',
828	911	]
829	912	);
830	913
	914	+ $this->add_group_control(
	915	+ Group_Control_Typography::get_type(),
	916	+ [
	917	+ 'name' => 'tabs_content_typography',
	918	+ 'selector' => '{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab',
	919	+ ]
	920	+ );
	921	+
831	922	$this->end_controls_section();
832	923	}
833	924	protected function register_controls_product_related() {
834	925
		@@ -979,8 +1070,412 @@
979	1070
980	1071	$this->end_controls_tab();
981	1072	$this->end_controls_tabs();
982	1073	$this->end_controls_section();
	1074	+
	1075	+ /**
	1076	+ * Variation Swatches
	1077	+ */
	1078	+ $this->start_controls_section(
	1079	+ 'section_variation_swatches',
	1080	+ [
	1081	+ 'label' => __('Variation Swatches', 'ultimate-store-kit'),
	1082	+ 'tab' => Controls_Manager::TAB_STYLE,
	1083	+ ]
	1084	+ );
	1085	+ $this->add_control(
	1086	+ 'variation_label_color',
	1087	+ [
	1088	+ 'label' => __('Label Color', 'ultimate-store-kit'),
	1089	+ 'type' => Controls_Manager::COLOR,
	1090	+ 'selectors' => [
	1091	+ '{{WRAPPER}} .usk-page-single .variations label' => 'color: {{VALUE}};',
	1092	+ ],
	1093	+ ]
	1094	+ );
	1095	+ $this->add_responsive_control(
	1096	+ 'variation_label_spacing',
	1097	+ [
	1098	+ 'label' => __('Right Spacing', 'ultimate-store-kit'),
	1099	+ 'type' => Controls_Manager::SLIDER,
	1100	+ 'selectors' => [
	1101	+ '{{WRAPPER}} .usk-page-single form.cart table.variations td' => 'padding-left: {{SIZE}}{{UNIT}} !important;',
	1102	+ ],
	1103	+ ]
	1104	+ );
	1105	+ $this->add_group_control(
	1106	+ Group_Control_Typography::get_type(),
	1107	+ [
	1108	+ 'name' => 'variation_label_typography',
	1109	+ 'label' => __('Label Typography', 'ultimate-store-kit'),
	1110	+ 'selector' => '{{WRAPPER}} .usk-page-single .variations label',
	1111	+ ]
	1112	+ );
	1113	+ $this->start_controls_tabs('variation_tabs');
	1114	+ $this->start_controls_tab(
	1115	+ 'variation_tab_normal',
	1116	+ [
	1117	+ 'label' => __('Normal', 'ultimate-store-kit'),
	1118	+ ]
	1119	+ );
	1120	+ $this->add_control(
	1121	+ 'variation_color',
	1122	+ [
	1123	+ 'label' => __('Text Color', 'ultimate-store-kit'),
	1124	+ 'type' => Controls_Manager::COLOR,
	1125	+ 'selectors' => [
	1126	+ '{{WRAPPER}} .usk-page-single .variations select' => 'color: {{VALUE}};',
	1127	+ '{{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item' => 'color: {{VALUE}};',
	1128	+ ],
	1129	+ ]
	1130	+ );
	1131	+ $this->add_group_control(
	1132	+ Group_Control_Background::get_type(),
	1133	+ [
	1134	+ 'name' => 'variation_background',
	1135	+ 'types' => ['classic', 'gradient'],
	1136	+ 'selector' => '{{WRAPPER}} .usk-page-single .variations select, {{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item',
	1137	+ 'exclude' => ['image'],
	1138	+ ]
	1139	+ );
	1140	+ $this->add_group_control(
	1141	+ Group_Control_Border::get_type(),
	1142	+ [
	1143	+ 'name' => 'variation_border',
	1144	+ 'selector' => '{{WRAPPER}} .usk-page-single .variations select, {{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item',
	1145	+ 'separator' => 'before',
	1146	+ ]
	1147	+ );
	1148	+ $this->add_responsive_control(
	1149	+ 'variation_border_radius',
	1150	+ [
	1151	+ 'label' => __('Border Radius', 'ultimate-store-kit'),
	1152	+ 'type' => Controls_Manager::DIMENSIONS,
	1153	+ 'size_units' => ['px', '%'],
	1154	+ 'selectors' => [
	1155	+ '{{WRAPPER}} .usk-page-single .variations select' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	1156	+ '{{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	1157	+ ],
	1158	+ ]
	1159	+ );
	1160	+ $this->add_responsive_control(
	1161	+ 'variation_padding',
	1162	+ [
	1163	+ 'label' => __('Padding', 'ultimate-store-kit'),
	1164	+ 'type' => Controls_Manager::DIMENSIONS,
	1165	+ 'size_units' => ['px', 'em', '%'],
	1166	+ 'selectors' => [
	1167	+ '{{WRAPPER}} .usk-page-single .variations select' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	1168	+ '{{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	1169	+ ],
	1170	+ ]
	1171	+ );
	1172	+ $this->add_responsive_control(
	1173	+ 'variation_gap',
	1174	+ [
	1175	+ 'label' => __('Gap', 'ultimate-store-kit'),
	1176	+ 'type' => Controls_Manager::SLIDER,
	1177	+ 'size_units' => ['px'],
	1178	+ 'range' => [
	1179	+ 'px' => [
	1180	+ 'min' => 0,
	1181	+ 'max' => 50,
	1182	+ 'step' => 1,
	1183	+ ],
	1184	+ ],
	1185	+ 'selectors' => [
	1186	+ '{{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__wrapper' => 'gap: {{SIZE}}{{UNIT}};',
	1187	+ ],
	1188	+ ]
	1189	+ );
	1190	+ $this->add_group_control(
	1191	+ Group_Control_Box_Shadow::get_type(),
	1192	+ [
	1193	+ 'name' => 'variation_box_shadow',
	1194	+ 'selector' => '{{WRAPPER}} .usk-page-single .variations select, {{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item',
	1195	+ ]
	1196	+ );
	1197	+ $this->add_group_control(
	1198	+ Group_Control_Typography::get_type(),
	1199	+ [
	1200	+ 'name' => 'variation_typography',
	1201	+ 'selector' => '{{WRAPPER}} .usk-page-single .variations select, {{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item',
	1202	+ ]
	1203	+ );
	1204	+
	1205	+ $this->add_control(
	1206	+ 'variation_reset_color',
	1207	+ [
	1208	+ 'label' => __('Reset Text Color', 'ultimate-store-kit'),
	1209	+ 'type' => Controls_Manager::COLOR,
	1210	+ 'selectors' => [
	1211	+ '{{WRAPPER}} .usk-page-single .variations .reset_variations' => 'color: {{VALUE}};',
	1212	+ ],
	1213	+ 'separator' => 'before',
	1214	+ ]
	1215	+ );
	1216	+ $this->add_responsive_control(
	1217	+ 'variation_reset_gap',
	1218	+ [
	1219	+ 'label' => __('Left Spacing', 'ultimate-store-kit'),
	1220	+ 'type' => Controls_Manager::SLIDER,
	1221	+ 'size_units' => ['px'],
	1222	+ 'range' => [
	1223	+ 'px' => [
	1224	+ 'min' => 40,
	1225	+ 'max' => 100,
	1226	+ 'step' => 1,
	1227	+ ],
	1228	+ ],
	1229	+ 'selectors' => [
	1230	+ '{{WRAPPER}} .usk-page-single .variations .reset_variations' => 'right: -{{SIZE}}{{UNIT}};',
	1231	+ ],
	1232	+ ]
	1233	+ );
	1234	+ $this->add_group_control(
	1235	+ Group_Control_Typography::get_type(),
	1236	+ [
	1237	+ 'name' => 'variation_reset_typography',
	1238	+ 'label' => __('Reset Typography', 'ultimate-store-kit'),
	1239	+ 'selector' => '{{WRAPPER}} .usk-page-single .variations .reset_variations',
	1240	+ ]
	1241	+ );
	1242	+ $this->end_controls_tab();
	1243	+ $this->start_controls_tab(
	1244	+ 'variation_tab_hover',
	1245	+ [
	1246	+ 'label' => __('Hover', 'ultimate-store-kit'),
	1247	+ ]
	1248	+ );
	1249	+ $this->add_control(
	1250	+ 'variation_color_hover',
	1251	+ [
	1252	+ 'label' => __('Text Color', 'ultimate-store-kit'),
	1253	+ 'type' => Controls_Manager::COLOR,
	1254	+ 'selectors' => [
	1255	+ '{{WRAPPER}} .usk-page-single .variations select:hover' => 'color: {{VALUE}};',
	1256	+ '{{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item:hover' => 'color: {{VALUE}};',
	1257	+ ],
	1258	+ ]
	1259	+ );
	1260	+ $this->add_group_control(
	1261	+ Group_Control_Background::get_type(),
	1262	+ [
	1263	+ 'name' => 'variation_background_hover',
	1264	+ 'types' => ['classic', 'gradient'],
	1265	+ 'selector' => '{{WRAPPER}} .usk-page-single .variations select:hover, {{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item:hover',
	1266	+ 'exclude' => ['image'],
	1267	+ ]
	1268	+ );
	1269	+ $this->add_control(
	1270	+ 'variation_border_color_hover',
	1271	+ [
	1272	+ 'label' => __('Border Color', 'ultimate-store-kit'),
	1273	+ 'type' => Controls_Manager::COLOR,
	1274	+ 'selectors' => [
	1275	+ '{{WRAPPER}} .usk-page-single .variations select:hover' => 'border-color: {{VALUE}};',
	1276	+ '{{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item:hover' => 'border-color: {{VALUE}};',
	1277	+ ],
	1278	+ 'condition' => [
	1279	+ 'variation_border_border!' => '',
	1280	+ ],
	1281	+ 'separator' => 'before',
	1282	+ ]
	1283	+ );
	1284	+ $this->add_group_control(
	1285	+ Group_Control_Box_Shadow::get_type(),
	1286	+ [
	1287	+ 'name' => 'variation_box_shadow_hover',
	1288	+ 'selector' => '{{WRAPPER}} .usk-page-single .variations select:hover, {{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item:hover',
	1289	+ ]
	1290	+ );
	1291	+ $this->end_controls_tab();
	1292	+ $this->start_controls_tab(
	1293	+ 'variation_tab_active',
	1294	+ [
	1295	+ 'label' => __('Active', 'ultimate-store-kit'),
	1296	+ ]
	1297	+ );
	1298	+ $this->add_control(
	1299	+ 'variation_color_active',
	1300	+ [
	1301	+ 'label' => __('Text Color', 'ultimate-store-kit'),
	1302	+ 'type' => Controls_Manager::COLOR,
	1303	+ 'selectors' => [
	1304	+ '{{WRAPPER}} .usk-page-single .variations select:focus' => 'color: {{VALUE}};',
	1305	+ '{{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item.selected' => 'color: {{VALUE}};',
	1306	+ ],
	1307	+ ]
	1308	+ );
	1309	+ $this->add_group_control(
	1310	+ Group_Control_Background::get_type(),
	1311	+ [
	1312	+ 'name' => 'variation_background_active',
	1313	+ 'types' => ['classic', 'gradient'],
	1314	+ 'selector' => '{{WRAPPER}} .usk-page-single .variations select:focus, {{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item.selected',
	1315	+ 'exclude' => ['image'],
	1316	+ ]
	1317	+ );
	1318	+ $this->add_control(
	1319	+ 'variation_border_color_active',
	1320	+ [
	1321	+ 'label' => __('Border Color', 'ultimate-store-kit'),
	1322	+ 'type' => Controls_Manager::COLOR,
	1323	+ 'selectors' => [
	1324	+ '{{WRAPPER}} .usk-page-single .variations select:focus' => 'border-color: {{VALUE}};',
	1325	+ '{{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item.selected' => 'border-color: {{VALUE}};',
	1326	+ ],
	1327	+ 'condition' => [
	1328	+ 'variation_border_border!' => '',
	1329	+ ],
	1330	+ 'separator' => 'before',
	1331	+ ]
	1332	+ );
	1333	+ $this->add_group_control(
	1334	+ Group_Control_Box_Shadow::get_type(),
	1335	+ [
	1336	+ 'name' => 'variation_box_shadow_active',
	1337	+ 'selector' => '{{WRAPPER}} .usk-page-single .variations select:focus, {{WRAPPER}} .usk-page-single .variations .usk-variation-swatches__item.selected',
	1338	+ ]
	1339	+ );
	1340	+ $this->end_controls_tab();
	1341	+ $this->end_controls_tabs();
	1342	+ $this->end_controls_section();
	1343	+
	1344	+ /**
	1345	+ * Quantity Plus Minus
	1346	+ */
	1347	+ $this->start_controls_section(
	1348	+ 'section_quantity_plus_minus',
	1349	+ [
	1350	+ 'label' => __('Quantity Plus Minus', 'ultimate-store-kit'),
	1351	+ 'tab' => Controls_Manager::TAB_STYLE,
	1352	+ ]
	1353	+ );
	1354	+ $this->start_controls_tabs('quantity_plus_minus_tabs');
	1355	+ $this->start_controls_tab(
	1356	+ 'quantity_plus_minus_normal_tab',
	1357	+ [
	1358	+ 'label' => __('Normal', 'ultimate-store-kit'),
	1359	+ ]
	1360	+ );
	1361	+ $this->add_control(
	1362	+ 'quantity_plus_minus_color',
	1363	+ [
	1364	+ 'label' => __('Color', 'ultimate-store-kit'),
	1365	+ 'type' => Controls_Manager::COLOR,
	1366	+ 'selectors' => [
	1367	+ '{{WRAPPER}} .usk-page-single .quantity button' => 'color: {{VALUE}};',
	1368	+ ],
	1369	+ ]
	1370	+ );
	1371	+ $this->add_group_control(
	1372	+ Group_Control_Background::get_type(),
	1373	+ [
	1374	+ 'name' => 'quantity_plus_minus_background',
	1375	+ 'types' => ['classic', 'gradient'],
	1376	+ 'selector' => '{{WRAPPER}} .usk-page-single .quantity button',
	1377	+ 'exclude' => ['image'],
	1378	+ ]
	1379	+ );
	1380	+ $this->add_group_control(
	1381	+ Group_Control_Border::get_type(),
	1382	+ [
	1383	+ 'name' => 'quantity_plus_minus_border',
	1384	+ 'selector' => '{{WRAPPER}} .usk-page-single .quantity button',
	1385	+ 'separator' => 'before',
	1386	+ ]
	1387	+ );
	1388	+ $this->add_responsive_control(
	1389	+ 'quantity_plus_minus_border_radius',
	1390	+ [
	1391	+ 'label' => __('Border Radius', 'ultimate-store-kit'),
	1392	+ 'type' => Controls_Manager::DIMENSIONS,
	1393	+ 'size_units' => ['px', '%'],
	1394	+ 'selectors' => [
	1395	+ '{{WRAPPER}} .usk-page-single .quantity button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	1396	+ ],
	1397	+ ]
	1398	+ );
	1399	+ $this->add_responsive_control(
	1400	+ 'quantity_plus_minus_padding',
	1401	+ [
	1402	+ 'label' => __('Padding', 'ultimate-store-kit'),
	1403	+ 'type' => Controls_Manager::DIMENSIONS,
	1404	+ 'size_units' => ['px', 'em', '%'],
	1405	+ 'selectors' => [
	1406	+ '{{WRAPPER}} .usk-page-single .quantity button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	1407	+ ],
	1408	+ ]
	1409	+ );
	1410	+ $this->add_group_control(
	1411	+ Group_Control_Box_Shadow::get_type(),
	1412	+ [
	1413	+ 'name' => 'quantity_plus_minus_box_shadow',
	1414	+ 'selector' => '{{WRAPPER}} .usk-page-single .quantity button',
	1415	+ ]
	1416	+ );
	1417	+ $this->add_responsive_control(
	1418	+ 'quantity_plus_minus_icon_size',
	1419	+ [
	1420	+ 'label' => __('Icon Size', 'ultimate-store-kit'),
	1421	+ 'type' => Controls_Manager::SLIDER,
	1422	+ 'size_units' => ['px'],
	1423	+ 'selectors' => [
	1424	+ '{{WRAPPER}} .usk-page-single .quantity button' => 'font-size: {{SIZE}}{{UNIT}};',
	1425	+ ],
	1426	+ ]
	1427	+ );
	1428	+ $this->end_controls_tab();
	1429	+ $this->start_controls_tab(
	1430	+ 'quantity_plus_minus_hover_tab',
	1431	+ [
	1432	+ 'label' => __('Hover', 'ultimate-store-kit'),
	1433	+ ]
	1434	+ );
	1435	+ $this->add_control(
	1436	+ 'quantity_plus_minus_hover_color',
	1437	+ [
	1438	+ 'label' => __('Color', 'ultimate-store-kit'),
	1439	+ 'type' => Controls_Manager::COLOR,
	1440	+ 'selectors' => [
	1441	+ '{{WRAPPER}} .usk-page-single .quantity button:hover' => 'color: {{VALUE}};',
	1442	+ ],
	1443	+ ]
	1444	+ );
	1445	+ $this->add_group_control(
	1446	+ Group_Control_Background::get_type(),
	1447	+ [
	1448	+ 'name' => 'quantity_plus_minus_hover_background',
	1449	+ 'types' => ['classic', 'gradient'],
	1450	+ 'selector' => '{{WRAPPER}} .usk-page-single .quantity button:hover',
	1451	+ 'exclude' => ['image'],
	1452	+ ]
	1453	+ );
	1454	+ $this->add_control(
	1455	+ 'quantity_plus_minus_hover_border_color',
	1456	+ [
	1457	+ 'label' => __('Border Color', 'ultimate-store-kit'),
	1458	+ 'type' => Controls_Manager::COLOR,
	1459	+ 'selectors' => [
	1460	+ '{{WRAPPER}} .usk-page-single .quantity button:hover' => 'border-color: {{VALUE}};',
	1461	+ ],
	1462	+ 'condition' => [
	1463	+ 'quantity_plus_minus_border_border!' => '',
	1464	+ ],
	1465	+ 'separator' => 'before',
	1466	+ ]
	1467	+ );
	1468	+ $this->add_group_control(
	1469	+ Group_Control_Box_Shadow::get_type(),
	1470	+ [
	1471	+ 'name' => 'quantity_plus_minus_hover_box_shadow',
	1472	+ 'selector' => '{{WRAPPER}} .usk-page-single .quantity button:hover',
	1473	+ ]
	1474	+ );
	1475	+ $this->end_controls_tab();
	1476	+ $this->end_controls_tabs();
	1477	+ $this->end_controls_section();
983	1478	}
984	1479
985	1480	public function render() {
986	1481	$product_id = '';
		@@ -989,8 +1484,9 @@
989	1484	$product_id = $product->get_id();
990	1485	}
991	1486	?>
992	1487	<div class="usk-page-single">
	1488	+ <?php ultimate_store_kit_setup_quantity_buttons(); // this is for quantity plus minus button ?>
993	1489	<?php echo do_shortcode('[product_page id="' . $product_id . '"]'); ?>
994	1490	</div>
995	1491	<?php
996	1492	}