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 1.5.0, at modules/page-single/widgets/page-single.php

991 lines 35.2 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 ['ultimate-store-kit-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	],
134	]
135	);
136
137	$this->add_group_control(
138	Group_Control_Typography::get_type(),
139	[
140	'name' => 'price_typography',
141	'selector' => '{{WRAPPER}} .woocommerce div.product p.price,{{WRAPPER}} .woocommerce div.product span.price',
142	]
143	);
144	$this->end_controls_section();
145	$this->start_controls_section(
146	'short_desc_color',
147	[
148	'label' => __('Product Description', 'ultimate-store-kit'),
149	'tab' => Controls_Manager::TAB_STYLE,
150	]
151	);
152
153	$this->add_control(
154	'sd_color',
155	[
156	'label' => esc_html__('Color', 'ultimate-store-kit'),
157	'type' => Controls_Manager::COLOR,
158	'selectors' => [
159	'{{WRAPPER}} .woocommerce-product-details__short-description' => 'color: {{VALUE}};',
160	],
161	]
162	);
163
164	$this->add_group_control(
165	Group_Control_Typography::get_type(),
166	[
167	'name' => 'sd_color_typo',
168	'selector' => '{{WRAPPER}} .woocommerce-product-details__short-description',
169	]
170	);
171
172	$this->end_controls_section();
173	}
174	protected function register_controls_add_to_cart() {
175
176	$this->start_controls_section(
177	'section_style_add_to_cart',
178	[
179	'label' => __('Add To Cart', 'ultimate-store-kit'),
180	'tab' => Controls_Manager::TAB_STYLE,
181	]
182	);
183
184	$this->start_controls_tabs('tabs_add_to_cart_style');
185
186	$this->start_controls_tab(
187	'tab_add_to_cart_normal',
188	[
189	'label' => __('Normal', 'ultimate-store-kit'),
190	]
191	);
192
193	$this->add_control(
194	'add_to_cart_text_color',
195	[
196	'label' => __('Color', 'ultimate-store-kit'),
197	'type' => Controls_Manager::COLOR,
198	'default' => '#fff',
199	'selectors' => [
200	'{{WRAPPER}} .woocommerce div.product form.cart .button' => 'color: {{VALUE}}; cursor:pointer;'
201	],
202	]
203	);
204
205	$this->add_group_control(
206	Group_Control_Background::get_type(),
207	[
208	'name' => 'add_to_cart_background',
209	'label' => __('Background', 'ultimate-store-kit'),
210	'types' => [
211	'classic', 'gradient'
212	],
213	'exclude' => ['image'],
214	'fields_options' => [
215	'background' => [
216	'default' => 'classic',
217	],
218	'color' => [
219	'default' => '#1E87F0',
220	],
221	],
222	'selector' => '{{WRAPPER}} .woocommerce div.product form.cart .button',
223	]
224	);
225
226	$this->add_group_control(
227	Group_Control_Border::get_type(),
228	[
229	'name' => 'add_to_cart_border',
230	'label' => __('Border', 'ultimate-post-kit'),
231	'fields_options' => [
232	'border' => [
233	'default' => 'solid',
234	],
235	'width' => [
236	'default' => [
237	'top' => '0',
238	'right' => '0',
239	'bottom' => '0',
240	'left' => '0',
241	'isLinked' => false,
242	],
243	],
244	// 'color' => [
245	// 'default' => '#8D99AE',
246	// ],
247	],
248	'selector' => '{{WRAPPER}} .woocommerce div.product form.cart .button',
249	'separator' => 'before',
250	]
251	);
252
253	$this->add_control(
254	'add_to_cart_border_radius',
255	[
256	'label' => __('Border Radius', 'ultimate-store-kit'),
257	'type' => Controls_Manager::DIMENSIONS,
258	'size_units' => ['px', '%'],
259	'selectors' => [
260	'{{WRAPPER}} .woocommerce div.product form.cart .button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
261	],
262	]
263	);
264
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	$this->add_responsive_control(
277	'add_to_cart_size',
278	[
279	'label' => __('Size', 'ultimate-store-kit'),
280	'type' => Controls_Manager::SLIDER,
281	'size_units' => ['px'],
282	'selectors' => [
283	'{{WRAPPER}} .woocommerce div.product form.cart *' => 'height: {{SIZE}}{{UNIT}};',
284	],
285	]
286	);
287
288	$this->add_group_control(
289	Group_Control_Typography::get_type(),
290	[
291	'name' => 'add_to_cart_typography',
292	'selector' => '{{WRAPPER}} .woocommerce div.product form.cart .button',
293	]
294	);
295
296	$this->add_group_control(
297	Group_Control_Box_Shadow::get_type(),
298	[
299	'name' => 'add_to_cart_box_shadow',
300	'selector' => '{{WRAPPER}} .woocommerce div.product form.cart .button',
301	]
302	);
303
304	$this->end_controls_tab();
305
306	$this->start_controls_tab(
307	'tab_add_to_cart_hover',
308	[
309	'label' => __('Hover', 'ultimate-store-kit'),
310	]
311	);
312
313	$this->add_control(
314	'add_to_cart_hover_color',
315	[
316	'label' => __('Color', 'ultimate-store-kit'),
317	'type' => Controls_Manager::COLOR,
318	'selectors' => [
319	'{{WRAPPER}} .woocommerce div.product form.cart .button:hover, {{WRAPPER}} .woocommerce div.product form.cart .button:focus' => 'color: {{VALUE}};',
320	],
321	]
322	);
323
324	$this->add_control(
325	'add_to_cart_hover_border_color',
326	[
327	'label' => __('Border Color', 'ultimate-store-kit'),
328	'type' => Controls_Manager::COLOR,
329	'condition' => [
330	'add_to_cart_border_border!' => '',
331	],
332	'selectors' => [
333	'{{WRAPPER}} .woocommerce div.product form.cart .button:hover, {{WRAPPER}} .woocommerce div.product form.cart .button:focus' => 'border-color: {{VALUE}};',
334	],
335	]
336	);
337
338	$this->add_group_control(
339	Group_Control_Background::get_type(),
340	[
341	'name' => 'add_to_cart_hover_background',
342	'label' => __('Background', 'ultimate-store-kit'),
343	'exclude' => ['image'],
344	'selector' => '{{WRAPPER}} .woocommerce div.product form.cart .button:hover, {{WRAPPER}} .elementor-button:focus',
345	]
346	);
347
348	$this->end_controls_tab();
349
350	$this->end_controls_tabs();
351
352	$this->end_controls_section();
353
354	$this->start_controls_section(
355	'qty_style',
356	[
357	'label' => __('Quantity Field', 'ultimate-store-kit'),
358	'tab' => Controls_Manager::TAB_STYLE,
359	'condition' => [
360	'show_quantity' => 'yes'
361	]
362	]
363	);
364
365	$this->add_control(
366	'qty_fields_width',
367	[
368	'label' => esc_html__('Width', 'ultimate-store-kit'),
369	'type' => Controls_Manager::SLIDER,
370	'size_units' => ['px', '%'],
371	'range' => [
372	'px' => [
373	'min' => 0,
374	'max' => 500,
375	],
376	'%' => [
377	'min' => 0,
378	'max' => 100,
379	],
380	],
381	'default' => [
382	'unit' => '%',
383	'size' => 11
384	],
385	'selectors' => [
386	'{{WRAPPER}} .cart .quantity' => 'width: {{SIZE}}{{UNIT}};',
387	],
388	]
389	);
390
391	$this->add_control(
392	'qty_fields_color',
393	[
394	'label' => __('Color', 'ultimate-store-kit'),
395	'type' => Controls_Manager::COLOR,
396	'selectors' => [
397	'{{WRAPPER}} .quantity input[type=number]' => 'color: {{VALUE}} ',
398	'{{WRAPPER}} .quantity input[type=number]::placeholder' => 'color: {{VALUE}} ',
399	],
400	'separator' => 'before',
401	]
402	);
403
404	$this->add_group_control(
405	Group_Control_Background::get_type(),
406	[
407	'name' => 'qty_fields_background',
408	'exclude' => ['image'],
409	'selector' => '{{WRAPPER}} .quantity input[type=number]',
410	]
411	);
412
413	$this->add_group_control(
414	Group_Control_Border::get_type(),
415	[
416	'name' => 'qty_fields_border',
417	'label' => __(
418	'Border',
419	'ultimate-post-kit'
420	),
421	'fields_options' => [
422	'border' => [
423	'default' => 'solid',
424	],
425	'width' => [
426	'default' => [
427	'top' => '1',
428	'right' => '1',
429	'bottom' => '1',
430	'left' => '1',
431	'isLinked' => false,
432	],
433	],
434	'color' => [
435	'default' => '#a4afb7',
436	],
437	],
438	'selector' => '{{WRAPPER}} .quantity input[type=number]',
439	'separator' => 'before',
440	]
441	);
442
443	$this->add_responsive_control(
444	'qty_fields_border_radius',
445	[
446	'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
447	'type' => Controls_Manager::DIMENSIONS,
448	'size_units' => ['px', '%'],
449	'default' => [
450	'top' => '3',
451	'right' => '3',
452	'bottom' => '3',
453	'left' => '3',
454	'isLinked' => false
455	],
456	'selectors' => [
457	'{{WRAPPER}} .quantity input[type=number]' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
458	],
459	]
460	);
461
462	$this->add_control(
463	'qty_fields_padding',
464	[
465	'label' => __('Padding', 'ultimate-store-kit'),
466	'type' => Controls_Manager::DIMENSIONS,
467	'selectors' => [
468	'{{WRAPPER}} .quantity input[type=number]' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} ;',
469	],
470	]
471	);
472
473	$this->add_responsive_control(
474	'qty_fields_margin',
475	[
476	'label' => __('Margin', 'ultimate-store-kit'),
477	'type' => Controls_Manager::DIMENSIONS,
478	'selectors' => [
479	'{{WRAPPER}} .quantity input[type=number]' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} ;',
480	],
481	]
482	);
483
484	$this->add_group_control(
485	Group_Control_Typography::get_type(),
486	[
487	'name' => 'qty_fields_typography',
488	'selector' => '{{WRAPPER}} .quantity input[type=number]',
489	]
490	);
491
492
493	$this->add_group_control(
494	Group_Control_Box_Shadow::get_type(),
495	[
496	'name' => 'qty_fields_shadow',
497	'selector' => '{{WRAPPER}} .quantity input[type=number]'
498	]
499	);
500	$this->end_controls_section();
501	}
502
503	protected function register_controls_tabs() {
504
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	$this->start_controls_section(
582	'tabs_nav_item_style_section',
583	[
584	'label' => __('Tabs Item', 'ultimate-store-kit'),
585	'tab' => Controls_Manager::TAB_STYLE,
586	]
587	);
588
589
590	$this->add_responsive_control(
591	'tabs_nav_item_padding',
592	[
593	'label' => esc_html__(
594	'Padding',
595	'ultimate-store-kit'
596	),
597	'type' => Controls_Manager::DIMENSIONS,
598	'size_units' => ['px', 'em', '%'],
599	'selectors' => [
600	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
601	],
602	]
603	);
604
605	$this->add_responsive_control(
606	'tabs_nav_item_margin',
607	[
608	'label' => esc_html__('Margin', 'ultimate-store-kit'),
609	'type' => Controls_Manager::DIMENSIONS,
610	'size_units' => ['px', 'em', '%'],
611	'selectors' => [
612	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
613	],
614	]
615	);
616
617
618	$this->add_group_control(
619	Group_Control_Typography::get_type(),
620	[
621	'name' => 'tabs_nav_item_typography',
622	'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li',
623	]
624	);
625
626	$this->add_group_control(
627	Group_Control_Border::get_type(),
628	[
629	'name' => 'tabs_nav_item_border',
630	'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a',
631	]
632	);
633
634
635	$this->add_responsive_control(
636	'tabs_nav_item_border_radius',
637	[
638	'label' => __('Border Radius', 'ultimate-store-kit'),
639	'type' => Controls_Manager::DIMENSIONS,
640	'size_units' => ['px', '%'],
641	'selectors' => [
642	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}; overflow: hidden;',
643	],
644	]
645	);
646
647	$this->start_controls_tabs('tabs_tabs_nav');
648
649	$this->start_controls_tab(
650	'tabs_nav_item_normal',
651	[
652	'label' => __('Normal', 'ultimate-store-kit'),
653	]
654	);
655
656	$this->add_control(
657	'tabs_nav_item_color',
658	[
659	'label' => esc_html__('Color', 'ultimate-store-kit'),
660	'type' => Controls_Manager::COLOR,
661	'selectors' => [
662	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a' => 'color: {{VALUE}};',
663	],
664	]
665	);
666
667	$this->add_group_control(
668	Group_Control_Background::get_type(),
669	[
670	'name' => 'tabs_nav_item_bg',
671	'types' => ['classic', 'gradient'],
672	'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a',
673	]
674	);
675
676
677
678	$this->end_controls_tab();
679
680	$this->start_controls_tab(
681	'tabs_nav_item_hover',
682	[
683	'label' => __('Hover', 'ultimate-store-kit'),
684	]
685	);
686
687	$this->add_control(
688	'tabs_nav_item_color_hover',
689	[
690	'label' => esc_html__('Color', 'ultimate-store-kit'),
691	'type' => Controls_Manager::COLOR,
692	'selectors' => [
693	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a:hover' => 'color: {{VALUE}};',
694	],
695	]
696	);
697
698	$this->add_group_control(
699	Group_Control_Background::get_type(),
700	[
701	'name' => 'tabs_nav_item_bg_hover',
702	'types' => ['classic', 'gradient'],
703	'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a:hover',
704	]
705	);
706
707	$this->add_control(
708	'tabs_nav_item_border_color_hover',
709	[
710	'label' => esc_html__('Border Color', 'ultimate-store-kit'),
711	'type' => Controls_Manager::COLOR,
712	'condition' => [
713	'tabs_nav_item_border_border!' => '',
714	],
715	'selectors' => [
716	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li a:hover' => 'border-color: {{VALUE}};',
717	],
718	]
719	);
720
721
722	$this->end_controls_tab();
723
724	$this->start_controls_tab(
725	'tabs_nav_active',
726	[
727	'label' => __('Active', 'ultimate-store-kit'),
728	]
729	);
730
731	$this->add_control(
732	'tabs_nav_color_active',
733	[
734	'label' => esc_html__('Color', 'ultimate-store-kit'),
735	'type' => Controls_Manager::COLOR,
736	'selectors' => [
737	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li.active a' => 'color: {{VALUE}};',
738	],
739	]
740	);
741
742	$this->add_group_control(
743	Group_Control_Background::get_type(),
744	[
745	'name' => 'tabs_nav_bg_active',
746	'types' => ['classic', 'gradient'],
747	'selector' => '{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li.active a',
748	]
749	);
750
751	$this->add_control(
752	'tabs_nav_item_border_color_active',
753	[
754	'label' => esc_html__('Border Color', 'ultimate-store-kit'),
755	'type' => Controls_Manager::COLOR,
756	'condition' => [
757	'tabs_nav_item_border_border!' => '',
758	],
759	'selectors' => [
760	'{{WRAPPER}} .woocommerce div.product .woocommerce-tabs ul.tabs li.active a' => 'border-color: {{VALUE}};',
761	],
762	]
763	);
764
765
766	$this->end_controls_tab();
767
768	$this->end_controls_tabs();
769
770	$this->end_controls_section();
771
772	$this->start_controls_section(
773	'tabs_content',
774	[
775	'label' => __('Tabs Content', 'ultimate-store-kit'),
776	'tab' => Controls_Manager::TAB_STYLE,
777	]
778	);
779
780	$this->add_control(
781	'tabs_content_color',
782	[
783	'label' => __('Color', 'ultimate-store-kit'),
784	'type' => Controls_Manager::COLOR,
785	'selectors' => [
786	'{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab' => 'color: {{VALUE}}',
787	],
788	]
789	);
790	$this->add_group_control(
791	Group_Control_Background::get_type(),
792	[
793	'name' => 'tabs_content_bg',
794	'types' => ['classic', 'gradient'],
795	'selector' => '{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab',
796	]
797	);
798
799	$this->add_responsive_control(
800	'tabs_content_padding',
801	[
802	'label' => esc_html__('Padding', 'ultimate-store-kit'),
803	'type' => Controls_Manager::DIMENSIONS,
804	'size_units' => ['px', 'em', '%'],
805	'selectors' => [
806	'{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
807	],
808	]
809	);
810
811	$this->add_responsive_control(
812	'tabs_content_border_radius',
813	[
814	'label' => __('Border Radius', 'ultimate-store-kit'),
815	'type' => Controls_Manager::DIMENSIONS,
816	'size_units' => ['px', '%'],
817	'selectors' => [
818	'{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}; overflow: hidden;',
819	],
820	]
821	);
822
823	$this->add_group_control(
824	Group_Control_Border::get_type(),
825	[
826	'name' => 'tabs_content_border',
827	'selector' => '{{WRAPPER}} .usk-page-single .woocommerce-tabs .wc-tab',
828	]
829	);
830
831	$this->end_controls_section();
832	}
833	protected function register_controls_product_related() {
834
835	$this->start_controls_section(
836	'section_style_product_related',
837	[
838	'label' => __('Related Product', 'ultimate-store-kit'),
839	'tab' => Controls_Manager::TAB_STYLE,
840	]
841	);
842	$this->start_controls_tabs(
843	'tabs_product_related'
844	);
845	$this->start_controls_tab(
846	'tab_product_related_heading',
847	[
848	'label' => __('Heading', 'ultimate-store-kit'),
849	]
850	);
851	$this->add_control(
852	'related_heading_color',
853	[
854	'label' => __('Color', 'ultimate-store-kit'),
855	'type' => Controls_Manager::COLOR,
856	'selectors' => [
857	'{{WRAPPER}} .usk-page-single .related.products > h2' => 'color: {{VALUE}};',
858	],
859	]
860	);
861
862	$this->add_group_control(
863	Group_Control_Typography::get_type(),
864	[
865	'name' => 'related_heading_typography',
866	'selector' => '{{WRAPPER}} .usk-page-single .related.products > h2',
867	]
868	);
869
870	$this->add_responsive_control(
871	'related_heading_margin',
872	[
873	'label' => __('Margin', 'ultimate-store-kit'),
874	'type' => Controls_Manager::DIMENSIONS,
875	'size_units' => [
876	'px', 'em', '%'
877	],
878	'selectors' => [
879	'{{WRAPPER}} .usk-product-related .related.products > h2' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
880	],
881	]
882	);
883	$this->end_controls_tab();
884	$this->start_controls_tab(
885	'tab_product_related_title',
886	[
887	'label' => __('Title', 'ultimate-store-kit'),
888	]
889	);
890
891	$this->add_control(
892	'related_title_color',
893	[
894	'label' => __('Color', 'ultimate-store-kit'),
895	'type' => Controls_Manager::COLOR,
896	'selectors' => [
897	'{{WRAPPER}} .woocommerce ul.products li.product .woocommerce-loop-product__title' => 'color: {{VALUE}};',
898	],
899	]
900	);
901	$this->add_group_control(
902	Group_Control_Typography::get_type(),
903	[
904	'name' => 'related_title_typography',
905	'selector' => '{{WRAPPER}} .woocommerce ul.products li.product .woocommerce-loop-product__title',
906	]
907	);
908	$this->end_controls_tab();
909	$this->start_controls_tab(
910	'tab_product_related_price',
911	[
912	'label' => __('Price', 'ultimate-store-kit'),
913	]
914	);
915	$this->add_control(
916	'related_price_color',
917	[
918	'label' => esc_html__('Color', 'ultimate-store-kit'),
919	'type' => Controls_Manager::COLOR,
920	'selectors' => [
921	'{{WRAPPER}} .woocommerce ul.products li.product .price' => 'color: {{VALUE}};',
922	],
923	]
924	);
925
926	$this->add_group_control(
927	Group_Control_Typography::get_type(),
928	[
929	'name' => 'related_price_typography',
930	'selector' => '{{WRAPPER}} .woocommerce ul.products li.product .price',
931	]
932	);
933	$this->end_controls_tab();
934	$this->start_controls_tab(
935	'tab_product_related_cart',
936	[
937	'label' => __('Cart', 'ultimate-store-kit'),
938	]
939	);
940	$this->add_control(
941	'related_cart_color',
942	[
943	'label' => esc_html__('Color', 'ultimate-store-kit'),
944	'type' => Controls_Manager::COLOR,
945	'selectors' => [
946	'{{WRAPPER}} .woocommerce ul.products li.product a.button' => 'color: {{VALUE}};',
947	],
948	]
949	);
950	$this->add_control(
951	'related_cart_background_color',
952	[
953	'label' => esc_html__('Background', 'ultimate-store-kit'),
954	'type' => Controls_Manager::COLOR,
955	'selectors' => [
956	'{{WRAPPER}} .woocommerce ul.products li.product a.button' => 'background-color: {{VALUE}};',
957	],
958	]
959	);
960	$this->add_responsive_control(
961	'related_cart_padding',
962	[
963	'label' => __('Padding', 'ultimate-store-kit'),
964	'type' => Controls_Manager::DIMENSIONS,
965	'size_units' => ['px', '%', 'em'],
966	'selectors' => [
967	'{{WRAPPER}} .woocommerce ul.products li.product a.button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
968	],
969	]
970	);
971	$this->add_group_control(
972	Group_Control_Typography::get_type(),
973	[
974	'name' => 'related_cart_typography',
975	'label' => __('Typography', 'ultimate-store-kit'),
976	'selector' => '{{WRAPPER}} .woocommerce ul.products li.product a.button',
977	]
978	);
979
980	$this->end_controls_tab();
981	$this->end_controls_tabs();
982	$this->end_controls_section();
983	}
984
985	public function render() { ?>
986	<div class="usk-page-single">
987	<?php echo do_shortcode('[product_page id="' . get_the_ID() . '"]'); ?>
988	</div>
989	<?php }
990	}
991