ultimate-store-kit / modules / page-single / widgets / page-single.php

page-single.php in Ultimate Store Kit – Store Builder Addons for Elementor, WooCommerce Store Builder, EDD Store Builder 2.0.5, at modules/page-single/widgets/page-single.php

994 lines 34.5 KB

Raw Download Zip

1	<?php
2
3	namespace UltimateStoreKit\Modules\PageSingle\Widgets;
4
5	use Elementor\Controls_Manager;
6	use Elementor\Group_Control_Typography;
7	use Elementor\Group_Control_Box_Shadow;
8	use Elementor\Group_Control_Text_Shadow;
9	use Elementor\Group_Control_Border;
10	use Elementor\Group_Control_Background;
11	use Elementor\Icons_Manager;
12
13	use UltimateStoreKit\Base\Module_Base;
14
15	if (!defined('ABSPATH')) exit; // Exit if accessed directly
16
17	// class Add_To_Cart extends Widget_Button {
18	class Page_Single extends Module_Base {
19
20	// public function get_show_in_panel_tags() {
21	// return ['shop_single'];
22	// }
23
24	public function get_name() {
25	return 'usk-page-single';
26	}
27
28	public function get_title() {
29	return BDTUSK . esc_html__('Single Product (Page)', 'ultimate-store-kit');
30	}
31
32	public function get_icon() {
33	return 'usk-widget-icon usk-icon-page-single usk-new';
34	}
35
36	public function get_categories() {
37	return ['ultimate-store-kit-single'];
38	}
39
40	public function get_keywords() {
41	return ['add', 'to', 'cart', 'woocommerce', 'wc', 'additional', 'info'];
42	}
43
44	public function get_style_depends() {
45	if ($this->usk_is_edit_mode()) {
46	return ['usk-all-styles'];
47	} else {
48	return ['usk-font', 'usk-page-single'];
49	}
50	}
51
52	public function register_controls() {
53	$this->register_controls_title();
54	$this->register_controls_price();
55	$this->register_controls_add_to_cart();
56	$this->register_controls_tabs();
57	$this->register_controls_product_related();
58	$this->start_controls_section(
59	'section_style_badge',
60	[
61	'label' => __('Sale Badge', 'ultimate-store-kit'),
62	'tab' => Controls_Manager::TAB_STYLE,
63	]
64	);
65	$this->add_control(
66	'sale_badge_color',
67	[
68	'label' => __('Color', 'ultimate-store-kit'),
69	'type' => Controls_Manager::COLOR,
70	'selectors' => [
71	'{{WRAPPER}} .usk-page-single span.onsale' => 'color: {{VALUE}}',
72	],
73	]
74	);
75	$this->add_group_control(
76	Group_Control_Background::get_type(),
77	[
78	'name' => 'sale_badge_background',
79	'label' => __('Background', 'ultimate-store-kit'),
80	'types' => ['classic', 'gradient'],
81	'selector' => '{{WRAPPER}} .usk-page-single span.onsale',
82	]
83	);
84	$this->end_controls_section();
85	}
86	protected function register_controls_title() {
87	$this->start_controls_section(
88	'section_style_title',
89	[
90	'label' => __('Product Title', 'ultimate-store-kit'),
91	'tab' => Controls_Manager::TAB_STYLE,
92	]
93	);
94
95	$this->add_control(
96	'title_color',
97	[
98	'label' => __('Color', 'ultimate-store-kit'),
99	'type' => Controls_Manager::COLOR,
100	'selectors' => [
101	'{{WRAPPER}} .woocommerce div.product .product_title' => 'color: {{VALUE}};',
102	],
103	]
104	);
105
106	$this->add_group_control(
107	Group_Control_Typography::get_type(),
108	[
109	'name' => 'title_typography',
110	'selector' => '{{WRAPPER}} .woocommerce div.product .product_title',
111	]
112	);
113
114	$this->end_controls_section();
115	}
116
117	protected function register_controls_price() {
118	$this->start_controls_section(
119	'price',
120	[
121	'label' => __('Product Price', 'ultimate-store-kit'),
122	'tab' => Controls_Manager::TAB_STYLE,
123	]
124	);
125
126	$this->add_control(
127	'price_color',
128	[
129	'label' => esc_html__('Color', 'ultimate-store-kit'),
130	'type' => Controls_Manager::COLOR,
131	'selectors' => [
132	'{{WRAPPER}} .woocommerce div.product p.price,{{WRAPPER}} .woocommerce div.product span.price' => 'color: {{VALUE}};',
133	'{{WRAPPER}} .woocommerce div.product p.price ins, {{WRAPPER}} .woocommerce div.product span.price ins' => 'color: {{VALUE}};',
134	],
135	]
136	);
137
138	$this->add_group_control(
139	Group_Control_Typography::get_type(),
140	[
141	'name' => 'price_typography',
142	'selector' => '{{WRAPPER}} .woocommerce div.product p.price,{{WRAPPER}} .woocommerce div.product span.price',
143	]
144	);
145	$this->end_controls_section();
146	$this->start_controls_section(
147	'short_desc_color',
148	[
149	'label' => __('Product Description', 'ultimate-store-kit'),
150	'tab' => Controls_Manager::TAB_STYLE,
151	]
152	);
153
154	$this->add_control(
155	'sd_color',
156	[
157	'label' => esc_html__('Color', 'ultimate-store-kit'),
158	'type' => Controls_Manager::COLOR,
159	'selectors' => [
160	'{{WRAPPER}} .woocommerce-product-details__short-description' => 'color: {{VALUE}};',
161	],
162	]
163	);
164
165	$this->add_group_control(
166	Group_Control_Typography::get_type(),
167	[
168	'name' => 'sd_color_typo',
169	'selector' => '{{WRAPPER}} .woocommerce-product-details__short-description',
170	]
171	);
172
173	$this->end_controls_section();
174	}
175	protected function register_controls_add_to_cart() {
176
177	$this->start_controls_section(
178	'section_style_add_to_cart',
179	[
180	'label' => __('Add To Cart', 'ultimate-store-kit'),
181	'tab' => Controls_Manager::TAB_STYLE,
182	]
183	);
184
185	$this->start_controls_tabs('tabs_add_to_cart_style');
186
187	$this->start_controls_tab(
188	'tab_add_to_cart_normal',
189	[
190	'label' => __('Normal', 'ultimate-store-kit'),
191	]
192	);
193
194	$this->add_control(
195	'add_to_cart_text_color',
196	[
197	'label' => __('Color', 'ultimate-store-kit'),
198	'type' => Controls_Manager::COLOR,
199	'default' => '#fff',
200	'selectors' => [
201	'{{WRAPPER}} .woocommerce div.product form.cart .button' => 'color: {{VALUE}}; cursor:pointer;'
202	],
203	]
204	);
205
206	$this->add_group_control(
207	Group_Control_Background::get_type(),
208	[
209	'name' => 'add_to_cart_background',
210	'label' => __('Background', 'ultimate-store-kit'),
211	'types' => [
212	'classic', 'gradient'
213	],
214	'exclude' => ['image'],
215	'fields_options' => [
216	'background' => [
217	'default' => 'classic',
218	],
219	'color' => [
220	'default' => '#1E87F0',
221	],
222	],
223	'selector' => '{{WRAPPER}} .woocommerce div.product form.cart .button',
224	]
225	);
226
227	$this->add_group_control(
228	Group_Control_Border::get_type(),
229	[
230	'name' => 'add_to_cart_border',
231	'label' => __('Border', 'ultimate-store-kit'),
232	'fields_options' => [
233	'border' => [
234	'default' => 'solid',
235	],
236	'width' => [
237	'default' => [
238	'top' => '0',
239	'right' => '0',
240	'bottom' => '0',
241	'left' => '0',
242	'isLinked' => false,
243	],
244	],
245	// 'color' => [
246	// 'default' => '#8D99AE',
247	// ],
248	],
249	'selector' => '{{WRAPPER}} .woocommerce div.product form.cart .button',
250	'separator' => 'before',
251	]
252	);
253
254	$this->add_responsive_control(
255	'add_to_cart_border_radius',
256	[
257	'label' => __('Border Radius', 'ultimate-store-kit'),
258	'type' => Controls_Manager::DIMENSIONS,
259	'size_units' => ['px', '%'],
260	'selectors' => [
261	'{{WRAPPER}} .woocommerce div.product form.cart .button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
262	],
263	]
264	);
265
266	// $this->add_responsive_control(
267	// 'add_to_cart_padding',
268	// [
269	// 'label' => __('Padding', 'ultimate-store-kit'),
270	// 'type' => Controls_Manager::DIMENSIONS,
271	// 'size_units' => ['px', 'em', '%'],
272	// 'selectors' => [
273	// '{{WRAPPER}} .woocommerce div.product form.cart .button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
274	// ],
275	// ]
276	// );
277	$this->add_responsive_control(
278	'add_to_cart_size',
279	[
280	'label' => __('Size', 'ultimate-store-kit'),
281	'type' => Controls_Manager::SLIDER,
282	'size_units' => ['px'],
283	'selectors' => [
284	'{{WRAPPER}} .woocommerce div.product form.cart *' => 'height: {{SIZE}}{{UNIT}};',
285	],
286	]
287	);
288
289	$this->add_group_control(
290	Group_Control_Typography::get_type(),
291	[
292	'name' => 'add_to_cart_typography',
293	'selector' => '{{WRAPPER}} .woocommerce div.product form.cart .button',
294	]
295	);
296
297	$this->add_group_control(
298	Group_Control_Box_Shadow::get_type(),
299	[
300	'name' => 'add_to_cart_box_shadow',
301	'selector' => '{{WRAPPER}} .woocommerce div.product form.cart .button',
302	]
303	);
304
305	$this->end_controls_tab();
306
307	$this->start_controls_tab(
308	'tab_add_to_cart_hover',
309	[
310	'label' => __('Hover', 'ultimate-store-kit'),
311	]
312	);
313
314	$this->add_control(
315	'add_to_cart_hover_color',
316	[
317	'label' => __('Color', 'ultimate-store-kit'),
318	'type' => Controls_Manager::COLOR,
319	'selectors' => [
320	'{{WRAPPER}} .woocommerce div.product form.cart .button:hover, {{WRAPPER}} .woocommerce div.product form.cart .button:focus' => 'color: {{VALUE}};',
321	],
322	]
323	);
324
325	$this->add_control(
326	'add_to_cart_hover_border_color',
327	[
328	'label' => __('Border Color', 'ultimate-store-kit'),
329	'type' => Controls_Manager::COLOR,
330	'condition' => [
331	'add_to_cart_border_border!' => '',
332	],
333	'selectors' => [
334	'{{WRAPPER}} .woocommerce div.product form.cart .button:hover, {{WRAPPER}} .woocommerce div.product form.cart .button:focus' => 'border-color: {{VALUE}};',
335	],
336	]
337	);
338
339	$this->add_group_control(
340	Group_Control_Background::get_type(),
341	[
342	'name' => 'add_to_cart_hover_background',
343	'label' => __('Background', 'ultimate-store-kit'),
344	'exclude' => ['image'],
345	'selector' => '{{WRAPPER}} .woocommerce div.product form.cart .button:hover, {{WRAPPER}} .elementor-button:focus',
346	]
347	);
348
349	$this->end_controls_tab();
350	$this->end_controls_tabs();
351	$this->end_controls_section();
352
353	$this->start_controls_section(
354	'qty_style',
355	[
356	'label' => __('Quantity Field', 'ultimate-store-kit'),
357	'tab' => Controls_Manager::TAB_STYLE,
358	]
359	);
360
361	$this->add_control(
362	'qty_fields_width',
363	[
364	'label' => esc_html__('Width', 'ultimate-store-kit'),
365	'type' => Controls_Manager::SLIDER,
366	'size_units' => ['px', 'em', '%'],
367	'range' => [
368	'px' => [
369	'min' => 0,
370	'max' => 500,
371	],
372	'%' => [
373	'min' => 0,
374	'max' => 100,
375	],
376	'em' => [
377	'min' => 0,
378	'max' => 20,
379	],
380	],
381	'selectors' => [
382	'{{WRAPPER}} .usk-page-single .woocommerce .quantity .qty' => 'width: {{SIZE}}{{UNIT}};',
383	],
384	]
385	);
386
387	$this->add_control(
388	'qty_fields_color',
389	[
390	'label' => __('Color', 'ultimate-store-kit'),
391	'type' => Controls_Manager::COLOR,
392	'selectors' => [
393	'{{WRAPPER}} .quantity input[type=number]' => 'color: {{VALUE}} ',
394	'{{WRAPPER}} .quantity input[type=number]::placeholder' => 'color: {{VALUE}} ',
395	],
396	'separator' => 'before',
397	]
398	);
399
400	$this->add_group_control(
401	Group_Control_Background::get_type(),
402	[
403	'name' => 'qty_fields_background',
404	'exclude' => ['image'],
405	'selector' => '{{WRAPPER}} .quantity input[type=number]',
406	]
407	);
408
409	$this->add_group_control(
410	Group_Control_Border::get_type(),
411	[
412	'name' => 'qty_fields_border',
413	'label' => __(
414	'Border',
415	'ultimate-store-kit'
416	),
417	'fields_options' => [
418	'border' => [
419	'default' => 'solid',
420	],
421	'width' => [
422	'default' => [
423	'top' => '1',
424	'right' => '1',
425	'bottom' => '1',
426	'left' => '1',
427	'isLinked' => false,
428	],
429	],
430	'color' => [
431	'default' => '#a4afb7',
432	],
433	],
434	'selector' => '{{WRAPPER}} .quantity input[type=number]',
435	'separator' => 'before',
436	]
437	);
438
439	$this->add_responsive_control(
440	'qty_fields_border_radius',
441	[
442	'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
443	'type' => Controls_Manager::DIMENSIONS,
444	'size_units' => ['px', '%'],
445	'default' => [
446	'top' => '3',
447	'right' => '3',
448	'bottom' => '3',
449	'left' => '3',
450	'isLinked' => false
451	],
452	'selectors' => [
453	'{{WRAPPER}} .quantity input[type=number]' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
454	],
455	]
456	);
457
458	$this->add_control(
459	'qty_fields_padding',
460	[
461	'label' => __('Padding', 'ultimate-store-kit'),
462	'type' => Controls_Manager::DIMENSIONS,
463	'selectors' => [
464	'{{WRAPPER}} .quantity input[type=number]' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} ;',
465	],
466	]
467	);
468
469	$this->add_responsive_control(
470	'qty_fields_margin',
471	[
472	'label' => __('Margin', 'ultimate-store-kit'),
473	'type' => Controls_Manager::DIMENSIONS,
474	'selectors' => [
475	'{{WRAPPER}} .quantity input[type=number]' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} ;',
476	],
477	]
478	);
479
480	$this->add_group_control(
481	Group_Control_Typography::get_type(),
482	[
483	'name' => 'qty_fields_typography',
484	'selector' => '{{WRAPPER}} .quantity input[type=number]',
485	]
486	);
487
488
489	$this->add_group_control(
490	Group_Control_Box_Shadow::get_type(),
491	[
492	'name' => 'qty_fields_shadow',
493	'selector' => '{{WRAPPER}} .quantity input[type=number]'
494	]
495	);
496	$this->end_controls_section();
497	}
498
499	protected function register_controls_tabs() {
500
501	// $this->start_controls_section(
502	// 'tabs_nav_style_section',
503	// [
504	// 'label' => __('Tabs', 'ultimate-store-kit'),
505	// 'tab' => Controls_Manager::TAB_STYLE,
506	// ]
507	// );
508
509	// $this->add_responsive_control(
510	// 'tabs_nav_align',
511	// [
512	// 'label' => __('Alignment', 'ultimate-store-kit'),
513	// 'type' => Controls_Manager::CHOOSE,
514	// 'options' => [
515	// 'left' => [
516	// 'title' => __('Left', 'ultimate-store-kit'),
517	// 'icon' => 'eicon-text-align-left',
518	// ],
519	// 'center' => [
520	// 'title' => __(
521	// 'Center',
522	// 'ultimate-store-kit'
523	// ),
524	// 'icon' => 'eicon-text-align-center',
525	// ],
526	// 'right' => [
527	// 'title' => __(
528	// 'Right',
529	// 'ultimate-store-kit'
530	// ),
531	// 'icon' => 'eicon-text-align-right',
532	// ],
533	// ],
534	// 'desktop_default' => 'left',
535	// 'tablet_default' => 'left',
536	// 'mobile_default' => 'left',
537	// 'toggle' => false,
538	// 'selectors' => [
539	// '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs' => 'justify-content: {{VALUE}};',
540	// ],
541	// ]
542	// );
543
544	// $this->add_responsive_control(
545	// 'tabs_nav_padding',
546	// [
547	// 'label' => esc_html__('Padding', 'ultimate-store-kit'),
548	// 'type' => Controls_Manager::DIMENSIONS,
549	// 'size_units' => ['px', 'em', '%'],
550	// 'selectors' => [
551	// '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
552	// ],
553	// ]
554	// );
555
556	// $this->add_responsive_control(
557	// 'tabs_nav_item_radius',
558	// [
559	// 'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
560	// 'type' => Controls_Manager::DIMENSIONS,
561	// 'size_units' => ['px', 'em', '%'],
562	// 'selectors' => [
563	// '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
564	// ],
565	// ]
566	// );
567	// $this->add_group_control(
568	// Group_Control_Border::get_type(),
569	// [
570	// 'name' => 'tabs_nav_border',
571	// 'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs',
572	// ]
573	// );
574
575	// $this->end_controls_section();
576
577	$this->start_controls_section(
578	'tabs_nav_item_style_section',
579	[
580	'label' => __('Tabs Item', 'ultimate-store-kit'),
581	'tab' => Controls_Manager::TAB_STYLE,
582	]
583	);
584
585
586	$this->add_responsive_control(
587	'tabs_nav_item_padding',
588	[
589	'label' => esc_html__(
590	'Padding',
591	'ultimate-store-kit'
592	),
593	'type' => Controls_Manager::DIMENSIONS,
594	'size_units' => ['px', 'em', '%'],
595	'selectors' => [
596	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
597	],
598	]
599	);
600
601	$this->add_responsive_control(
602	'tabs_nav_item_margin',
603	[
604	'label' => esc_html__('Margin', 'ultimate-store-kit'),
605	'type' => Controls_Manager::DIMENSIONS,
606	'size_units' => ['px', 'em', '%'],
607	'selectors' => [
608	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
609	],
610	]
611	);
612
613
614	$this->add_group_control(
615	Group_Control_Typography::get_type(),
616	[
617	'name' => 'tabs_nav_item_typography',
618	'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li',
619	]
620	);
621
622	$this->add_group_control(
623	Group_Control_Border::get_type(),
624	[
625	'name' => 'tabs_nav_item_border',
626	'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a',
627	]
628	);
629
630
631	$this->add_responsive_control(
632	'tabs_nav_item_border_radius',
633	[
634	'label' => __('Border Radius', 'ultimate-store-kit'),
635	'type' => Controls_Manager::DIMENSIONS,
636	'size_units' => ['px', '%'],
637	'selectors' => [
638	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}; overflow: hidden;',
639	],
640	]
641	);
642
643	$this->start_controls_tabs('tabs_tabs_nav');
644
645	$this->start_controls_tab(
646	'tabs_nav_item_normal',
647	[
648	'label' => __('Normal', 'ultimate-store-kit'),
649	]
650	);
651
652	$this->add_control(
653	'tabs_nav_item_color',
654	[
655	'label' => esc_html__('Color', 'ultimate-store-kit'),
656	'type' => Controls_Manager::COLOR,
657	'selectors' => [
658	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a' => 'color: {{VALUE}};',
659	],
660	]
661	);
662
663	$this->add_group_control(
664	Group_Control_Background::get_type(),
665	[
666	'name' => 'tabs_nav_item_bg',
667	'types' => ['classic', 'gradient'],
668	'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a',
669	]
670	);
671
672
673
674	$this->end_controls_tab();
675
676	$this->start_controls_tab(
677	'tabs_nav_item_hover',
678	[
679	'label' => __('Hover', 'ultimate-store-kit'),
680	]
681	);
682
683	$this->add_control(
684	'tabs_nav_item_color_hover',
685	[
686	'label' => esc_html__('Color', 'ultimate-store-kit'),
687	'type' => Controls_Manager::COLOR,
688	'selectors' => [
689	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a:hover' => 'color: {{VALUE}};',
690	],
691	]
692	);
693
694	$this->add_group_control(
695	Group_Control_Background::get_type(),
696	[
697	'name' => 'tabs_nav_item_bg_hover',
698	'types' => ['classic', 'gradient'],
699	'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a:hover',
700	]
701	);
702
703	$this->add_control(
704	'tabs_nav_item_border_color_hover',
705	[
706	'label' => esc_html__('Border Color', 'ultimate-store-kit'),
707	'type' => Controls_Manager::COLOR,
708	'condition' => [
709	'tabs_nav_item_border_border!' => '',
710	],
711	'selectors' => [
712	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a:hover' => 'border-color: {{VALUE}};',
713	],
714	]
715	);
716
717
718	$this->end_controls_tab();
719
720	$this->start_controls_tab(
721	'tabs_nav_active',
722	[
723	'label' => __('Active', 'ultimate-store-kit'),
724	]
725	);
726
727	$this->add_control(
728	'tabs_nav_color_active',
729	[
730	'label' => esc_html__('Color', 'ultimate-store-kit'),
731	'type' => Controls_Manager::COLOR,
732	'selectors' => [
733	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li.active a' => 'color: {{VALUE}};',
734	],
735	]
736	);
737
738	$this->add_group_control(
739	Group_Control_Background::get_type(),
740	[
741	'name' => 'tabs_nav_bg_active',
742	'types' => ['classic', 'gradient'],
743	'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li.active a',
744	]
745	);
746
747	$this->add_control(
748	'tabs_nav_item_border_color_active',
749	[
750	'label' => esc_html__('Border Color', 'ultimate-store-kit'),
751	'type' => Controls_Manager::COLOR,
752	'condition' => [
753	'tabs_nav_item_border_border!' => '',
754	],
755	'selectors' => [
756	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li.active a' => 'border-color: {{VALUE}};',
757	],
758	]
759	);
760
761
762	$this->end_controls_tab();
763
764	$this->end_controls_tabs();
765
766	$this->end_controls_section();
767
768	$this->start_controls_section(
769	'tabs_content',
770	[
771	'label' => __('Tabs Content', 'ultimate-store-kit'),
772	'tab' => Controls_Manager::TAB_STYLE,
773	]
774	);
775
776	$this->add_control(
777	'tabs_content_color',
778	[
779	'label' => __('Color', 'ultimate-store-kit'),
780	'type' => Controls_Manager::COLOR,
781	'selectors' => [
782	'{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab' => 'color: {{VALUE}}',
783	],
784	]
785	);
786	$this->add_group_control(
787	Group_Control_Background::get_type(),
788	[
789	'name' => 'tabs_content_bg',
790	'types' => ['classic', 'gradient'],
791	'selector' => '{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab',
792	]
793	);
794
795	$this->add_responsive_control(
796	'tabs_content_padding',
797	[
798	'label' => esc_html__('Padding', 'ultimate-store-kit'),
799	'type' => Controls_Manager::DIMENSIONS,
800	'size_units' => ['px', 'em', '%'],
801	'selectors' => [
802	'{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
803	],
804	]
805	);
806
807	$this->add_responsive_control(
808	'tabs_content_border_radius',
809	[
810	'label' => __('Border Radius', 'ultimate-store-kit'),
811	'type' => Controls_Manager::DIMENSIONS,
812	'size_units' => ['px', '%'],
813	'selectors' => [
814	'{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}; overflow: hidden;',
815	],
816	]
817	);
818
819	$this->add_group_control(
820	Group_Control_Border::get_type(),
821	[
822	'name' => 'tabs_content_border',
823	'selector' => '{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab',
824	]
825	);
826
827	$this->end_controls_section();
828	}
829	protected function register_controls_product_related() {
830
831	$this->start_controls_section(
832	'section_style_product_related',
833	[
834	'label' => __('Related Product', 'ultimate-store-kit'),
835	'tab' => Controls_Manager::TAB_STYLE,
836	]
837	);
838	$this->start_controls_tabs(
839	'tabs_product_related'
840	);
841	$this->start_controls_tab(
842	'tab_product_related_heading',
843	[
844	'label' => __('Heading', 'ultimate-store-kit'),
845	]
846	);
847	$this->add_control(
848	'related_heading_color',
849	[
850	'label' => __( 'Color', 'ultimate-store-kit' ),
851	'type' => Controls_Manager::COLOR,
852	'selectors' => [
853	'{{WRAPPER}} .usk-page-single .related.products > h2' => 'color: {{VALUE}};',
854	],
855	]
856	);
857
858	$this->add_group_control(
859	Group_Control_Typography::get_type(),
860	[
861	'name' => 'related_heading_typography',
862	'selector' => '{{WRAPPER}} .usk-page-single .related.products > h2',
863	]
864	);
865
866	$this->add_responsive_control(
867	'related_heading_margin',
868	[
869	'label' => __('Margin', 'ultimate-store-kit'),
870	'type' => Controls_Manager::DIMENSIONS,
871	'size_units' => [
872	'px', 'em', '%'
873	],
874	'selectors' => [
875	'{{WRAPPER}} .usk-product-related .related.products > h2' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
876	],
877	]
878	);
879	$this->end_controls_tab();
880	$this->start_controls_tab(
881	'tab_product_related_title',
882	[
883	'label' => __('Title', 'ultimate-store-kit'),
884	]
885	);
886
887	$this->add_control(
888	'related_title_color',
889	[
890	'label' => __('Color', 'ultimate-store-kit'),
891	'type' => Controls_Manager::COLOR,
892	'selectors' => [
893	'{{WRAPPER}} .woocommerce ul.products li.product .woocommerce-loop-product__title' => 'color: {{VALUE}};',
894	],
895	]
896	);
897	$this->add_group_control(
898	Group_Control_Typography::get_type(),
899	[
900	'name' => 'related_title_typography',
901	'selector' => '{{WRAPPER}} .woocommerce ul.products li.product .woocommerce-loop-product__title',
902	]
903	);
904	$this->end_controls_tab();
905	$this->start_controls_tab(
906	'tab_product_related_price',
907	[
908	'label' => __('Price', 'ultimate-store-kit'),
909	]
910	);
911	$this->add_control(
912	'related_price_color',
913	[
914	'label' => esc_html__('Color', 'ultimate-store-kit'),
915	'type' => Controls_Manager::COLOR,
916	'selectors' => [
917	'{{WRAPPER}} .woocommerce ul.products li.product .price' => 'color: {{VALUE}};',
918	],
919	]
920	);
921
922	$this->add_group_control(
923	Group_Control_Typography::get_type(),
924	[
925	'name' => 'related_price_typography',
926	'selector' => '{{WRAPPER}} .woocommerce ul.products li.product .price',
927	]
928	);
929	$this->end_controls_tab();
930	$this->start_controls_tab(
931	'tab_product_related_cart',
932	[
933	'label' => __('Cart', 'ultimate-store-kit'),
934	]
935	);
936	$this->add_control(
937	'related_cart_color',
938	[
939	'label' => esc_html__('Color', 'ultimate-store-kit'),
940	'type' => Controls_Manager::COLOR,
941	'selectors' => [
942	'{{WRAPPER}} .woocommerce ul.products li.product a.button' => 'color: {{VALUE}};',
943	],
944	]
945	);
946	$this->add_control(
947	'related_cart_background_color',
948	[
949	'label' => esc_html__('Background', 'ultimate-store-kit'),
950	'type' => Controls_Manager::COLOR,
951	'selectors' => [
952	'{{WRAPPER}} .woocommerce ul.products li.product a.button' => 'background-color: {{VALUE}};',
953	],
954	]
955	);
956	$this->add_responsive_control(
957	'related_cart_padding',
958	[
959	'label' => __( 'Padding', 'ultimate-store-kit' ),
960	'type' => Controls_Manager::DIMENSIONS,
961	'size_units' => ['px', '%', 'em'],
962	'selectors' => [
963	'{{WRAPPER}} .woocommerce ul.products li.product a.button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
964	],
965	]
966	);
967	$this->add_group_control(
968	Group_Control_Typography::get_type(),
969	[
970	'name' => 'related_cart_typography',
971	'label' => __( 'Typography', 'ultimate-store-kit' ),
972	'selector' => '{{WRAPPER}} .woocommerce ul.products li.product a.button',
973	]
974	);
975
976	$this->end_controls_tab();
977	$this->end_controls_tabs();
978	$this->end_controls_section();
979	}
980
981	public function render() {
982	$product_id = '';
983	$product = wc_get_product(get_the_ID());
984	if ($product) {
985	$product_id = $product->get_id();
986	}
987	?>
988	<div class="usk-page-single">
989	<?php echo do_shortcode('[product_page id="' . $product_id . '"]'); ?>
990	</div>
991	<?php
992	}
993	}
994