ultimate-store-kit / modules / featured-box / widgets / featured-box.php

featured-box.php in Ultimate Store Kit 3.1.2, at modules/featured-box/widgets/featured-box.php

1,516 lines 48.4 KB

Raw Download Zip

1	<?php
2
3	namespace UltimateStoreKit\Modules\FeaturedBox\Widgets;
4
5	use Elementor\Controls_Manager;
6	use Elementor\Group_Control_Background;
7	use Elementor\Group_Control_Border;
8	use Elementor\Group_Control_Box_Shadow;
9	use Elementor\Group_Control_Image_Size;
10	use Elementor\Group_Control_Typography;
11	use UltimateStoreKit\Classes\Utils;
12	use UltimateStoreKit\Base\Module_Base;
13
14	if (!defined('ABSPATH')) {
15	exit;
16	} // Exit if accessed directly
17
18	// 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.
19
20	class Featured_Box extends Module_Base {
21
22	public function get_name() {
23	return 'usk-featured-box';
24	}
25
26	public function get_title() {
27	return esc_html__('Featured Box', 'ultimate-store-kit');
28	}
29
30	public function get_icon() {
31	return 'usk-widget-icon usk-icon-featured-box';
32	}
33
34	public function get_categories() {
35	return ['ultimate-store-kit'];
36	}
37
38	public function get_keywords() {
39	return ['services', 'list', 'featured', 'box', 'info', 'featured box'];
40	}
41
42	public function get_style_depends() {
43	if ($this->usk_is_edit_mode()) {
44	return ['usk-styles'];
45	} else {
46	return ['usk-featured-box'];
47	}
48	}
49
50	// public function get_custom_help_url() {
51	// return 'https://youtu.be/a_wJL950Kz4';
52	// }
53
54	public function has_widget_inner_wrapper(): bool {
55	return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
56	}
57	protected function register_controls() {
58
59	$this->start_controls_section(
60	'section_layout',
61	[
62	'label' => __('Layout', 'ultimate-store-kit'),
63	'tab' => Controls_Manager::TAB_CONTENT,
64	]
65	);
66
67	$this->start_controls_tabs('tabs_layout');
68	$this->start_controls_tab(
69	'tab_content',
70	[
71	'label' => __('Content', 'ultimate-store-kit'),
72	]
73	);
74
75	$this->add_control(
76	'title',
77	[
78	'label' => __('Title', 'ultimate-store-kit'),
79	'type' => Controls_Manager::TEXT,
80	'dynamic' => [
81	'active' => true,
82	],
83	'default' => esc_html__('New Featured Box', 'ultimate-store-kit'),
84	'placeholder' => __('Enter your title', 'ultimate-store-kit'),
85	'label_block' => true,
86	'condition' => [
87	'show_title' => 'yes',
88	],
89	]
90	);
91
92	$this->add_control(
93	'meta',
94	[
95	'label' => esc_html__('Meta Text', 'ultimate-store-kit'),
96	'type' => Controls_Manager::TEXT,
97	'label_block' => true,
98	'dynamic' => ['active' => true],
99	'default' => esc_html__('Monthly Discount', 'ultimate-store-kit'),
100	'condition' => [
101	'show_meta' => 'yes',
102	],
103	]
104	);
105
106	$this->add_control(
107	'readmore_text',
108	[
109	'label' => esc_html__('Button Text', 'ultimate-store-kit'),
110	'type' => Controls_Manager::TEXT,
111	'default' => esc_html__('Shop Now', 'ultimate-store-kit'),
112	'label_block' => true,
113	'dynamic' => ['active' => true],
114	'condition' => [
115	'show_readmore' => 'yes',
116	],
117	]
118	);
119
120	$this->add_control(
121	'readmore_link',
122	[
123	'label' => esc_html__('Button Link', 'ultimate-store-kit'),
124	'type' => Controls_Manager::URL,
125	'dynamic' => ['active' => true],
126	'placeholder' => 'http://your-link.com',
127	'default' => [
128	'url' => '#',
129	],
130	'condition' => [
131	'show_readmore' => 'yes',
132	],
133	]
134	);
135	$this->add_responsive_control(
136	'image',
137	[
138	'label' => __('Image', 'ultimate-store-kit'),
139	'type' => Controls_Manager::MEDIA,
140	'dynamic' => [ 'active' => true ],
141	'default' => [
142	'url' => \Elementor\Utils::get_placeholder_image_src(),
143	],
144	'selectors' => [
145	'{{WRAPPER}} .usk-featured-box .usk-image-wrap' => 'background-image: url("{{URL}}");',
146	],
147	'has_sizes' => true,
148	'render_type' => 'template',
149	]
150	);
151	$this->add_responsive_control(
152	'position',
153	[
154	'label' => esc_html__( 'Position', 'ultimate-store-kit' ),
155	'type' => Controls_Manager::SELECT,
156	'default' => '',
157	'separator' => 'before',
158	'options' => [
159	'' => esc_html__( 'Default', 'ultimate-store-kit' ),
160	'center center' => esc_html__( 'Center Center', 'ultimate-store-kit' ),
161	'center left' => esc_html__( 'Center Left', 'ultimate-store-kit' ),
162	'center right' => esc_html__( 'Center Right', 'ultimate-store-kit' ),
163	'top center' => esc_html__( 'Top Center', 'ultimate-store-kit' ),
164	'top left' => esc_html__( 'Top Left', 'ultimate-store-kit' ),
165	'top right' => esc_html__( 'Top Right', 'ultimate-store-kit' ),
166	'bottom center' => esc_html__( 'Bottom Center', 'ultimate-store-kit' ),
167	'bottom left' => esc_html__( 'Bottom Left', 'ultimate-store-kit' ),
168	'bottom right' => esc_html__( 'Bottom Right', 'ultimate-store-kit' ),
169	'initial' => esc_html__( 'Custom', 'ultimate-store-kit' ),
170
171	],
172	'selectors' => [
173	'{{WRAPPER}} .usk-featured-box .usk-image-wrap' => 'background-position: {{VALUE}};',
174	],
175	'condition' => [
176	'image[url]!' => '',
177	],
178	]
179	);
180
181	$this->add_responsive_control(
182	'xpos',
183	[
184	'label' => esc_html__( 'X Position', 'ultimate-store-kit' ),
185	'type' => Controls_Manager::SLIDER,
186	'responsive' => true,
187	'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
188	'default' => [
189	'size' => 0,
190	],
191	'tablet_default' => [
192	'size' => 0,
193	],
194	'mobile_default' => [
195	'size' => 0,
196	],
197	'range' => [
198	'px' => [
199	'min' => -800,
200	'max' => 800,
201	],
202	'em' => [
203	'min' => -100,
204	'max' => 100,
205	],
206	'%' => [
207	'min' => -100,
208	'max' => 100,
209	],
210	'vw' => [
211	'min' => -100,
212	'max' => 100,
213	],
214	],
215	'selectors' => [
216	'{{WRAPPER}} .usk-featured-box .usk-image-wrap' => 'background-position: {{SIZE}}{{UNIT}} {{ypos.SIZE}}{{ypos.UNIT}}',
217	],
218	'condition' => [
219	'position' => [ 'initial' ],
220	'image[url]!' => '',
221	],
222	'required' => true,
223	]
224	);
225
226	$this->add_responsive_control(
227	'ypos',
228	[
229	'label' => esc_html__( 'Y Position', 'ultimate-store-kit' ),
230	'type' => Controls_Manager::SLIDER,
231	'responsive' => true,
232	'size_units' => [ 'px', '%', 'em', 'rem', 'vh', 'custom' ],
233	'default' => [
234	'size' => 0,
235	],
236	'tablet_default' => [
237	'size' => 0,
238	],
239	'mobile_default' => [
240	'size' => 0,
241	],
242	'range' => [
243	'px' => [
244	'min' => -800,
245	'max' => 800,
246	],
247	'em' => [
248	'min' => -100,
249	'max' => 100,
250	],
251	'%' => [
252	'min' => -100,
253	'max' => 100,
254	],
255	'vh' => [
256	'min' => -100,
257	'max' => 100,
258	],
259	],
260	'selectors' => [
261	'{{WRAPPER}} .usk-featured-box .usk-image-wrap' => 'background-position: {{xpos.SIZE}}{{xpos.UNIT}} {{SIZE}}{{UNIT}}',
262	],
263	'condition' => [
264	'position' => [ 'initial' ],
265	'image[url]!' => '',
266	],
267	'required' => true,
268	]
269	);
270
271	$this->add_responsive_control(
272	'repeat',
273	[
274	'label' => esc_html_x( 'Repeat', 'Background Control', 'ultimate-store-kit' ),
275	'type' => Controls_Manager::SELECT,
276	'default' => '',
277	'options' => [
278	'' => esc_html__( 'Default', 'ultimate-store-kit' ),
279	'no-repeat' => esc_html__( 'No-repeat', 'ultimate-store-kit' ),
280	'repeat' => esc_html__( 'Repeat', 'ultimate-store-kit' ),
281	'repeat-x' => esc_html__( 'Repeat-x', 'ultimate-store-kit' ),
282	'repeat-y' => esc_html__( 'Repeat-y', 'ultimate-store-kit' ),
283	],
284	'selectors' => [
285	'{{WRAPPER}} .usk-featured-box .usk-image-wrap' => 'background-repeat: {{VALUE}};',
286	],
287	'condition' => [
288	'image[url]!' => '',
289	],
290	]
291	);
292
293	$this->add_responsive_control(
294	'size',
295	[
296	'label' => esc_html__( 'Display Size', 'ultimate-store-kit' ),
297	'type' => Controls_Manager::SELECT,
298	'default' => '',
299	'options' => [
300	'' => esc_html__( 'Default', 'ultimate-store-kit' ),
301	'auto' => esc_html__( 'Auto', 'ultimate-store-kit' ),
302	'cover' => esc_html__( 'Cover', 'ultimate-store-kit' ),
303	'contain' => esc_html__( 'Contain', 'ultimate-store-kit' ),
304	'initial' => esc_html__( 'Custom', 'ultimate-store-kit' ),
305	],
306	'selectors' => [
307	'{{WRAPPER}} .usk-featured-box .usk-image-wrap' => 'background-size: {{VALUE}};',
308	],
309	'condition' => [
310	'image[url]!' => '',
311	],
312	]
313	);
314
315	$this->add_responsive_control(
316	'bg_width',
317	[
318	'label' => esc_html__( 'Width', 'ultimate-store-kit' ),
319	'type' => Controls_Manager::SLIDER,
320	'responsive' => true,
321	'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
322	'range' => [
323	'px' => [
324	'max' => 1000,
325	],
326	],
327	'default' => [
328	'size' => 100,
329	'unit' => '%',
330	],
331	'required' => true,
332	'selectors' => [
333	'{{WRAPPER}} .usk-featured-box .usk-image-wrap' => 'background-size: {{SIZE}}{{UNIT}} auto',
334
335	],
336	'condition' => [
337	'size' => [ 'initial' ],
338	'image[url]!' => '',
339	],
340	]
341	);
342
343
344	$this->end_controls_tab();
345	$this->start_controls_tab(
346	'tab_optional',
347	[
348	'label' => __('Optional', 'ultimate-store-kit'),
349	]
350	);
351
352	$this->add_control(
353	'title_link',
354	[
355	'label' => esc_html__('Title Link', 'ultimate-store-kit'),
356	'type' => Controls_Manager::URL,
357	'dynamic' => ['active' => true],
358	'placeholder' => 'http://your-link.com',
359	'condition' => [
360	'show_title' => 'yes',
361	],
362	]
363	);
364
365	$this->add_control(
366	'text',
367	[
368	'label' => esc_html__('Text', 'ultimate-store-kit'),
369	'type' => Controls_Manager::WYSIWYG,
370	'label_block' => true,
371	'dynamic' => ['active' => true],
372	'default' => esc_html__('Don\'t miss the last opportunity.', 'ultimate-store-kit'),
373	'condition' => [
374	'show_text' => 'yes',
375	],
376	'separator' => 'before',
377	]
378	);
379
380	$this->add_control(
381	'badge_text',
382	[
383	'label' => esc_html__('Badge Text', 'ultimate-store-kit'),
384	'type' => Controls_Manager::TEXT,
385	'dynamic' => ['active' => true],
386	'default' => esc_html__('New', 'ultimate-store-kit'),
387	'condition' => [
388	'badge' => 'yes',
389	],
390	'separator' => 'before',
391	]
392	);
393
394
395	$this->end_controls_tab();
396	$this->end_controls_tabs();
397	$this->end_controls_section();
398
399	$this->start_controls_section(
400	'section_additional_settings',
401	[
402	'label' => __('Additional Options', 'ultimate-store-kit'),
403	'tab' => Controls_Manager::TAB_CONTENT,
404	]
405	);
406
407	$this->add_responsive_control(
408	'box_height',
409	[
410	'label' => esc_html__('Height', 'ultimate-store-kit'),
411	'type' => Controls_Manager::SLIDER,
412	'default' => [
413	'size' => 300,
414	],
415	'range' => [
416	'px' => [
417	'min' => 200,
418	'max' => 800,
419	],
420	],
421	'selectors' => [
422	'{{WRAPPER}} .usk-featured-box .usk-item' => 'height: {{SIZE}}{{UNIT}};',
423	],
424	]
425	);
426
427	$this->add_responsive_control(
428	'content_width',
429	[
430	'label' => esc_html__('Content Width', 'ultimate-store-kit'),
431	'type' => Controls_Manager::SLIDER,
432	'default' => [
433	'size' => 500,
434	],
435	'range' => [
436	'px' => [
437	'min' => 200,
438	'max' => 1200,
439	],
440	],
441	'selectors' => [
442	'{{WRAPPER}} .usk-featured-box .usk-content' => 'max-width: {{SIZE}}{{UNIT}};',
443	],
444	]
445	);
446
447	$this->add_control(
448	'content_position',
449	[
450	'label' => esc_html__('Content Position', 'ultimate-store-kit'),
451	'type' => Controls_Manager::CHOOSE,
452	'default' => 'center',
453	'options' => [
454	'top' => [
455	'title' => esc_html__('Top', 'ultimate-store-kit'),
456	'icon' => 'eicon-v-align-top',
457	],
458	'center' => [
459	'title' => esc_html__('Center', 'ultimate-store-kit'),
460	'icon' => 'eicon-v-align-middle',
461	],
462	'bottom' => [
463	'title' => esc_html__('Bottom', 'ultimate-store-kit'),
464	'icon' => 'eicon-v-align-bottom',
465	],
466	],
467	'toggle' => false,
468	]
469	);
470
471	$this->add_responsive_control(
472	'alignment',
473	[
474	'label' => esc_html__('Alignment', 'ultimate-store-kit'),
475	'type' => Controls_Manager::CHOOSE,
476	'options' => [
477	'left' => [
478	'title' => esc_html__('Left', 'ultimate-store-kit'),
479	'icon' => 'eicon-h-align-left',
480	],
481	'center' => [
482	'title' => esc_html__('Center', 'ultimate-store-kit'),
483	'icon' => 'eicon-h-align-center',
484	],
485	'right' => [
486	'title' => esc_html__('Right', 'ultimate-store-kit'),
487	'icon' => 'eicon-h-align-right',
488	],
489	],
490	'selectors' => [
491	'{{WRAPPER}} .usk-featured-box .usk-content' => 'text-align: {{VALUE}}',
492	],
493	]
494	);
495
496	$this->add_control(
497	'show_title',
498	[
499	'label' => __('Show Title', 'ultimate-store-kit'),
500	'type' => Controls_Manager::SWITCHER,
501	'default' => 'yes',
502	'separator' => 'before',
503	]
504	);
505
506	$this->add_control(
507	'title_tag',
508	[
509	'label' => __('Title HTML Tag', 'ultimate-store-kit'),
510	'type' => Controls_Manager::SELECT,
511	'default' => 'h3',
512	'options' => ultimate_store_kit_title_tags(),
513	'condition' => [
514	'show_title' => 'yes',
515	],
516	]
517	);
518
519	$this->add_control(
520	'show_text',
521	[
522	'label' => esc_html__('Show Text', 'ultimate-store-kit'),
523	'type' => Controls_Manager::SWITCHER,
524	'default' => 'yes',
525	'separator' => 'before',
526	]
527	);
528
529	$this->add_control(
530	'show_meta',
531	[
532	'label' => esc_html__('Show Meta', 'ultimate-store-kit'),
533	'type' => Controls_Manager::SWITCHER,
534	'default' => 'yes',
535	]
536	);
537
538	$this->add_control(
539	'show_readmore',
540	[
541	'label' => esc_html__('Show Button', 'ultimate-store-kit'),
542	'type' => Controls_Manager::SWITCHER,
543	'default' => 'yes',
544	]
545	);
546	$this->add_control(
547	'badge',
548	[
549	'label' => esc_html__('Badge', 'ultimate-store-kit') . BDTUSK_NC,
550	'type' => Controls_Manager::SWITCHER,
551	]
552	);
553
554	$this->add_control(
555	'show_wrapper_link',
556	[
557	'label' => esc_html__('Show Wrapper link', 'ultimate-store-kit'),
558	'type' => Controls_Manager::SWITCHER,
559	'separator' => 'before',
560	]
561	);
562
563	$this->add_control(
564	'wrapper_link',
565	[
566	'label' => esc_html__('Wrapper Link', 'ultimate-store-kit'),
567	'type' => Controls_Manager::URL,
568	'dynamic' => ['active' => true],
569	'placeholder' => 'http://your-link.com',
570	'default' => [
571	'url' => '#',
572	],
573	'condition' => [
574	'show_wrapper_link' => 'yes',
575	],
576	]
577	);
578
579	$this->end_controls_section();
580
581	//Style
582	$this->start_controls_section(
583	'section_style_items',
584	[
585	'label' => __('Featured Box', 'ultimate-store-kit'),
586	'tab' => Controls_Manager::TAB_STYLE,
587	]
588	);
589
590	$this->start_controls_tabs('tabs_item_style');
591
592	$this->start_controls_tab(
593	'tab_item_normal',
594	[
595	'label' => esc_html__('Normal', 'ultimate-store-kit'),
596	]
597	);
598
599	$this->add_group_control(
600	Group_Control_Background::get_type(),
601	[
602	'name' => 'item_background',
603	'selector' => '{{WRAPPER}} .usk-featured-box .usk-item',
604	]
605	);
606
607	$this->add_group_control(
608	Group_Control_Border::get_type(),
609	[
610	'name' => 'item_border',
611	'label' => esc_html__('Border', 'ultimate-store-kit'),
612	// 'fields_options' => [
613	// 'border' => [
614	// 'default' => 'solid',
615	// ],
616	// 'width' => [
617	// 'default' => [
618	// 'top' => '1',
619	// 'right' => '1',
620	// 'bottom' => '1',
621	// 'left' => '1',
622	// 'isLinked' => false,
623	// ],
624	// ],
625	// 'color' => [
626	// 'default' => '#eee',
627	// ],
628	// ],
629	'selector' => '{{WRAPPER}} .usk-featured-box .usk-item',
630	'separator' => 'before',
631	]
632	);
633
634	$this->add_responsive_control(
635	'item_border_radius',
636	[
637	'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
638	'type' => Controls_Manager::DIMENSIONS,
639	'size_units' => ['px', 'em', '%'],
640	'selectors' => [
641	'{{WRAPPER}} .usk-featured-box .usk-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
642	],
643	]
644	);
645
646	$this->add_responsive_control(
647	'item_padding',
648	[
649	'label' => esc_html__('Padding', 'ultimate-store-kit'),
650	'type' => Controls_Manager::DIMENSIONS,
651	'size_units' => ['px', 'em', '%'],
652	'selectors' => [
653	'{{WRAPPER}} .usk-featured-box .usk-item .usk-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
654	],
655	]
656	);
657
658	$this->add_group_control(
659	Group_Control_Box_Shadow::get_type(),
660	[
661	'name' => 'item_box_shadow',
662	'selector' => '{{WRAPPER}} .usk-featured-box .usk-item',
663	]
664	);
665
666	$this->end_controls_tab();
667
668	$this->start_controls_tab(
669	'tab_item_hover',
670	[
671	'label' => esc_html__('Hover', 'ultimate-store-kit'),
672	]
673	);
674
675	$this->add_group_control(
676	Group_Control_Background::get_type(),
677	[
678	'name' => 'item_hover_background',
679	'selector' => '{{WRAPPER}} .usk-featured-box .usk-item:hover',
680	]
681	);
682
683	$this->add_control(
684	'item_hover_border_color',
685	[
686	'label' => esc_html__('Border Color', 'ultimate-store-kit'),
687	'type' => Controls_Manager::COLOR,
688	'default' => '#333',
689	'condition' => [
690	'item_border_border!' => '',
691	],
692	'selectors' => [
693	'{{WRAPPER}} .usk-featured-box .usk-item:hover' => 'border-color: {{VALUE}};',
694	],
695	'separator' => 'before',
696	]
697	);
698
699	$this->add_group_control(
700	Group_Control_Box_Shadow::get_type(),
701	[
702	'name' => 'item_hover_box_shadow',
703	'selector' => '{{WRAPPER}} .usk-featured-box .usk-item:hover',
704	]
705	);
706
707	$this->end_controls_tab();
708
709	$this->end_controls_tabs();
710
711	$this->end_controls_section();
712
713	$this->start_controls_section(
714	'section_title_style',
715	[
716	'label' => __('Title', 'ultimate-store-kit'),
717	'tab' => Controls_Manager::TAB_STYLE,
718	'condition' => [
719	'show_title' => 'yes',
720	],
721	]
722	);
723
724	$this->add_control(
725	'title_color',
726	[
727	'label' => __('Color', 'ultimate-store-kit'),
728	'type' => Controls_Manager::COLOR,
729	'selectors' => [
730	'{{WRAPPER}} .usk-featured-box .usk-title a' => 'color: {{VALUE}} ',
731	],
732	]
733	);
734
735	$this->add_control(
736	'title_hover_color',
737	[
738	'label' => __('Hover Color', 'ultimate-store-kit'),
739	'type' => Controls_Manager::COLOR,
740	'selectors' => [
741	'{{WRAPPER}} .usk-featured-box .usk-title a:hover' => 'color: {{VALUE}} ',
742	],
743	]
744	);
745
746	$this->add_responsive_control(
747	'title_margin',
748	[
749	'label' => esc_html__('Margin', 'ultimate-store-kit'),
750	'type' => Controls_Manager::DIMENSIONS,
751	'size_units' => ['px', 'em', '%'],
752	'selectors' => [
753	'{{WRAPPER}} .usk-featured-box .usk-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
754	],
755	]
756	);
757
758	$this->add_group_control(
759	Group_Control_Typography::get_type(),
760	[
761	'name' => 'title_typography',
762	'selector' => '{{WRAPPER}} .usk-featured-box .usk-title',
763	]
764	);
765
766	$this->end_controls_section();
767
768	$this->start_controls_section(
769	'section_style_text',
770	[
771	'label' => __('Text', 'ultimate-store-kit'),
772	'tab' => Controls_Manager::TAB_STYLE,
773	'condition' => [
774	'show_text' => 'yes',
775	],
776	]
777	);
778
779	$this->add_control(
780	'text_color',
781	[
782	'label' => __('Color', 'ultimate-store-kit'),
783	'type' => Controls_Manager::COLOR,
784	'selectors' => [
785	'{{WRAPPER}} .usk-featured-box .usk-text' => 'color: {{VALUE}};',
786	],
787	]
788	);
789
790	$this->add_responsive_control(
791	'text_margin',
792	[
793	'label' => esc_html__('Margin', 'ultimate-store-kit'),
794	'type' => Controls_Manager::DIMENSIONS,
795	'size_units' => ['px', 'em', '%'],
796	'selectors' => [
797	'{{WRAPPER}} .usk-featured-box .usk-text' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
798	],
799	]
800	);
801
802	$this->add_group_control(
803	Group_Control_Typography::get_type(),
804	[
805	'name' => 'text_typography',
806	'selector' => '{{WRAPPER}} .usk-featured-box .usk-text',
807	]
808	);
809
810	$this->end_controls_section();
811
812	$this->start_controls_section(
813	'section_style_meta',
814	[
815	'label' => __('Meta', 'ultimate-store-kit'),
816	'tab' => Controls_Manager::TAB_STYLE,
817	'condition' => [
818	'show_meta' => 'yes',
819	],
820	]
821	);
822
823	$this->add_control(
824	'meta_color',
825	[
826	'label' => __('Color', 'ultimate-store-kit'),
827	'type' => Controls_Manager::COLOR,
828	'selectors' => [
829	'{{WRAPPER}} .usk-featured-box .usk-meta' => 'color: {{VALUE}};',
830	],
831	]
832	);
833
834	$this->add_control(
835	'meta_color_hover',
836	[
837	'label' => __('Hover Color', 'ultimate-store-kit'),
838	'type' => Controls_Manager::COLOR,
839	'selectors' => [
840	'{{WRAPPER}} .usk-featured-box .usk-meta:hover' => 'color: {{VALUE}};',
841	],
842	]
843	);
844
845	$this->add_responsive_control(
846	'meta_margin',
847	[
848	'label' => esc_html__('Margin', 'ultimate-store-kit'),
849	'type' => Controls_Manager::DIMENSIONS,
850	'size_units' => ['px', 'em', '%'],
851	'selectors' => [
852	'{{WRAPPER}} .usk-featured-box .usk-meta' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
853	],
854	]
855	);
856
857	$this->add_group_control(
858	Group_Control_Typography::get_type(),
859	[
860	'name' => 'meta_typography',
861	'selector' => '{{WRAPPER}} .usk-featured-box .usk-meta',
862	]
863	);
864
865	$this->end_controls_section();
866
867	$this->start_controls_section(
868	'section_style_readmore',
869	[
870	'label' => esc_html__('Button', 'ultimate-store-kit'),
871	'tab' => Controls_Manager::TAB_STYLE,
872	'condition' => [
873	'show_readmore' => 'yes',
874	],
875	]
876	);
877
878	$this->add_control(
879	'button_offset_toggle',
880	[
881	'label' => __('Offset', 'ultimate-store-kit'),
882	'type' => Controls_Manager::POPOVER_TOGGLE,
883	'label_off' => __('None', 'ultimate-store-kit'),
884	'label_on' => __('Custom', 'ultimate-store-kit'),
885	'return_value' => 'yes',
886	]
887	);
888	$this->start_popover();
889	$this->add_responsive_control(
890	'button_x_position',
891	[
892	'label' => __( 'X', 'ultimate-store-kit' ),
893	'type' => Controls_Manager::SLIDER,
894	'default' => [
895	'size' => 0,
896	],
897	'tablet_default' => [
898	'size' => 0,
899	],
900	'mobile_default' => [
901	'size' => 0,
902	],
903	'range' => [
904	'px' => [
905	'min' => -800,
906	'max' => 800,
907	],
908	],
909	'condition' => [
910	'button_offset_toggle' => 'yes'
911	],
912	'render_type' => 'ui',
913	'selectors' => [
914	'{{WRAPPER}}' => '--usk-button-x-offset: {{SIZE}}px;'
915	],
916	]
917	);
918
919	$this->add_responsive_control(
920	'button_y_position',
921	[
922	'label' => __( 'Y', 'ultimate-store-kit' ),
923	'type' => Controls_Manager::SLIDER,
924	'default' => [
925	'size' => 0,
926	],
927	'tablet_default' => [
928	'size' => 0,
929	],
930	'mobile_default' => [
931	'size' => 0,
932	],
933	'range' => [
934	'px' => [
935	'min' => -800,
936	'max' => 800,
937	],
938	],
939	'condition' => [
940	'button_offset_toggle' => 'yes'
941	],
942	'render_type' => 'ui',
943	'selectors' => [
944	'{{WRAPPER}}' => '--usk-button-y-offset: {{SIZE}}px;'
945	],
946	]
947	);
948
949	$this->add_responsive_control(
950	'button_rotate',
951	[
952	'label' => __( 'Rotate', 'ultimate-store-kit' ),
953	'type' => Controls_Manager::SLIDER,
954	'default' => [
955	'size' => 0,
956	],
957	'tablet_default' => [
958	'size' => 0,
959	],
960	'mobile_default' => [
961	'size' => 0,
962	],
963	'range' => [
964	'px' => [
965	'min' => -180,
966	'max' => 180,
967	'step' => 5,
968	],
969	],
970	'condition' => [
971	'button_offset_toggle' => 'yes'
972	],
973	'render_type' => 'ui',
974	'selectors' => [
975	'{{WRAPPER}}' => '--usk-button-rotate: {{SIZE}}deg;'
976	],
977	]
978	);
979	$this->end_popover();
980
981	$this->start_controls_tabs('tabs_readmore_style');
982
983	$this->start_controls_tab(
984	'tab_readmore_normal',
985	[
986	'label' => esc_html__('Normal', 'ultimate-store-kit'),
987	]
988	);
989
990	$this->add_control(
991	'readmore_color',
992	[
993	'label' => esc_html__('Color', 'ultimate-store-kit'),
994	'type' => Controls_Manager::COLOR,
995	'selectors' => [
996	'{{WRAPPER}} .usk-featured-box .usk-link-btn a' => 'color: {{VALUE}};',
997	],
998	]
999	);
1000
1001	$this->add_group_control(
1002	Group_Control_Background::get_type(),
1003	[
1004	'name' => 'readmore_background',
1005	'selector' => '{{WRAPPER}} .usk-featured-box .usk-link-btn a',
1006	]
1007	);
1008
1009	$this->add_group_control(
1010	Group_Control_Border::get_type(),
1011	[
1012	'name' => 'readmore_border',
1013	'label' => esc_html__('Border', 'ultimate-store-kit'),
1014	'fields_options' => [
1015	'border' => [
1016	'default' => 'solid',
1017	],
1018	'width' => [
1019	'default' => [
1020	'top' => '1',
1021	'right' => '1',
1022	'bottom' => '1',
1023	'left' => '1',
1024	'isLinked' => false,
1025	],
1026	],
1027	'color' => [
1028	'default' => '#D90429',
1029	],
1030	],
1031	'selector' => '{{WRAPPER}} .usk-featured-box .usk-link-btn a',
1032	'separator' => 'before',
1033	]
1034	);
1035
1036	$this->add_responsive_control(
1037	'readmore_radius',
1038	[
1039	'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
1040	'type' => Controls_Manager::DIMENSIONS,
1041	'size_units' => ['px', '%'],
1042	'selectors' => [
1043	'{{WRAPPER}} .usk-featured-box .usk-link-btn a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1044	],
1045	]
1046	);
1047
1048	$this->add_responsive_control(
1049	'readmore_padding',
1050	[
1051	'label' => esc_html__('Padding', 'ultimate-store-kit'),
1052	'type' => Controls_Manager::DIMENSIONS,
1053	'size_units' => ['px', 'em', '%'],
1054	'selectors' => [
1055	'{{WRAPPER}} .usk-featured-box .usk-link-btn a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1056	],
1057	]
1058	);
1059
1060	$this->add_responsive_control(
1061	'readmore_margin',
1062	[
1063	'label' => esc_html__('Margin', 'ultimate-store-kit'),
1064	'type' => Controls_Manager::DIMENSIONS,
1065	'size_units' => ['px', 'em', '%'],
1066	'selectors' => [
1067	'{{WRAPPER}} .usk-featured-box .usk-link-btn' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1068	],
1069	]
1070	);
1071
1072	$this->add_group_control(
1073	Group_Control_Typography::get_type(),
1074	[
1075	'name' => 'readmore_typography',
1076	'selector' => '{{WRAPPER}} .usk-featured-box .usk-link-btn a',
1077	]
1078	);
1079
1080	$this->add_group_control(
1081	Group_Control_Box_Shadow::get_type(),
1082	[
1083	'name' => 'readmore_box_shadow',
1084	'selector' => '{{WRAPPER}} .usk-featured-box .usk-link-btn a',
1085	]
1086	);
1087
1088	$this->end_controls_tab();
1089
1090	$this->start_controls_tab(
1091	'tab_readmore_hover',
1092	[
1093	'label' => esc_html__('Hover', 'ultimate-store-kit'),
1094	]
1095	);
1096
1097	$this->add_control(
1098	'readmore_hover_color',
1099	[
1100	'label' => esc_html__('Color', 'ultimate-store-kit'),
1101	'type' => Controls_Manager::COLOR,
1102	'selectors' => [
1103	'{{WRAPPER}} .usk-featured-box .usk-link-btn a:hover' => 'color: {{VALUE}};',
1104	'{{WRAPPER}} .usk-featured-box .usk-link-btn a span::before' => 'background-color: {{VALUE}};',
1105	'{{WRAPPER}} .usk-featured-box .usk-link-btn a span::after' => 'border-top-color: {{VALUE}}; border-right-color: {{VALUE}};',
1106	],
1107	]
1108	);
1109
1110	$this->add_group_control(
1111	Group_Control_Background::get_type(),
1112	[
1113	'name' => 'readmore_hover_background',
1114	'selector' => '{{WRAPPER}} .usk-featured-box .usk-link-btn a:before',
1115	]
1116	);
1117
1118	$this->add_control(
1119	'readmore_hover_border_color',
1120	[
1121	'label' => esc_html__('Border Color', 'ultimate-store-kit'),
1122	'type' => Controls_Manager::COLOR,
1123	'condition' => [
1124	'readmore_border_border!' => '',
1125	],
1126	'selectors' => [
1127	'{{WRAPPER}} .usk-featured-box .usk-link-btn a:hover' => 'border-color: {{VALUE}};',
1128	],
1129	]
1130	);
1131
1132	$this->end_controls_tab();
1133	$this->end_controls_tabs();
1134	$this->end_controls_section();
1135
1136	$this->start_controls_section(
1137	'section_style_badge',
1138	[
1139	'label' => esc_html__('Badge', 'ultimate-store-kit'),
1140	'tab' => Controls_Manager::TAB_STYLE,
1141	'condition' => [
1142	'badge' => 'yes',
1143	'badge_text!' => '',
1144	],
1145	]
1146	);
1147	$this->add_responsive_control(
1148	'badge_position',
1149	[
1150	'label' => esc_html__('Position', 'ultimate-store-kit'),
1151	'type' => Controls_Manager::SELECT,
1152	'default' => 'top-right',
1153	'options' => [
1154	'top-left' => esc_html__('Top Left', 'ultimate-store-kit'),
1155	'top-right' => esc_html__('Top Right', 'ultimate-store-kit'),
1156	'bottom-left' => esc_html__('Bottom Left', 'ultimate-store-kit'),
1157	'bottom-right' => esc_html__('Bottom Right', 'ultimate-store-kit'),
1158	],
1159	'selectors_dictionary' => [
1160	'top-left' => 'top: 0; left: 0;',
1161	'top-right' => 'top: 0; right: 0;',
1162	'bottom-left' => 'bottom: 0; left: 0;',
1163	'bottom-right' => 'bottom: 0; right: 0;',
1164	],
1165	'selectors' => [
1166	'{{WRAPPER}} .usk-featured-box .usk-badge' => '{{VALUE}};',
1167	],
1168	]
1169	);
1170	$this->start_controls_tabs('tabs_badge_style');
1171	$this->start_controls_tab(
1172	'tab_badge_normal',
1173	[
1174	'label' => esc_html__('Normal', 'ultimate-store-kit'),
1175	]
1176	);
1177	$this->add_control(
1178	'badge_color',
1179	[
1180	'label' => esc_html__('Color', 'ultimate-store-kit'),
1181	'type' => Controls_Manager::COLOR,
1182	'selectors' => [
1183	'{{WRAPPER}} .usk-featured-box .usk-badge' => 'color: {{VALUE}};',
1184	],
1185	]
1186	);
1187	$this->add_group_control(
1188	Group_Control_Background::get_type(),
1189	[
1190	'name' => 'badge_background',
1191	'exclude' => ['image'],
1192	'selector' => '{{WRAPPER}} .usk-featured-box .usk-badge',
1193	]
1194	);
1195	$this->add_group_control(
1196	Group_Control_Border::get_type(),
1197	[
1198	'name' => 'badge_border',
1199	'selector' => '{{WRAPPER}} .usk-featured-box .usk-badge',
1200	'separator' => 'before',
1201	]
1202	);
1203	$this->add_responsive_control(
1204	'badge_border_radius',
1205	[
1206	'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
1207	'type' => Controls_Manager::DIMENSIONS,
1208	'size_units' => ['px', '%'],
1209	'selectors' => [
1210	'{{WRAPPER}} .usk-featured-box .usk-badge' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1211	],
1212	]
1213	);
1214	$this->add_responsive_control(
1215	'badge_padding',
1216	[
1217	'label' => esc_html__('Padding', 'ultimate-store-kit'),
1218	'type' => Controls_Manager::DIMENSIONS,
1219	'size_units' => ['px', 'em', '%'],
1220	'selectors' => [
1221	'{{WRAPPER}} .usk-featured-box .usk-badge' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1222	],
1223	]
1224	);
1225	$this->add_responsive_control(
1226	'badge_margin',
1227	[
1228	'label' => esc_html__('Margin', 'ultimate-store-kit'),
1229	'type' => Controls_Manager::DIMENSIONS,
1230	'size_units' => ['px', 'em', '%'],
1231	'selectors' => [
1232	'{{WRAPPER}} .usk-featured-box .usk-badge' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1233	],
1234	]
1235	);
1236	$this->add_group_control(
1237	Group_Control_Typography::get_type(),
1238	[
1239	'name' => 'badge_typography',
1240	'selector' => '{{WRAPPER}} .usk-featured-box .usk-badge',
1241	]
1242	);
1243	$this->add_group_control(
1244	Group_Control_Box_Shadow::get_type(),
1245	[
1246	'name' => 'badge_box_shadow',
1247	'selector' => '{{WRAPPER}} .usk-featured-box .usk-badge',
1248	]
1249	);
1250	$this->add_control(
1251	'badge_offset_toggle',
1252	[
1253	'label' => __('Offset', 'ultimate-store-kit'),
1254	'type' => Controls_Manager::POPOVER_TOGGLE,
1255	'label_off' => __('None', 'ultimate-store-kit'),
1256	'label_on' => __('Custom', 'ultimate-store-kit'),
1257	'return_value' => 'yes',
1258	]
1259	);
1260	$this->start_popover();
1261	$this->add_responsive_control(
1262	'badge_x_position',
1263	[
1264	'label' => __( 'X', 'ultimate-store-kit' ),
1265	'type' => Controls_Manager::SLIDER,
1266	'default' => [
1267	'size' => 0,
1268	],
1269	'tablet_default' => [
1270	'size' => 0,
1271	],
1272	'mobile_default' => [
1273	'size' => 0,
1274	],
1275	'range' => [
1276	'px' => [
1277	'min' => -800,
1278	'max' => 800,
1279	],
1280	],
1281	'condition' => [
1282	'badge_offset_toggle' => 'yes'
1283	],
1284	'render_type' => 'ui',
1285	'selectors' => [
1286	'{{WRAPPER}}' => '--usk-badge-x-offset: {{SIZE}}px;'
1287	],
1288	]
1289	);
1290
1291	$this->add_responsive_control(
1292	'badge_y_position',
1293	[
1294	'label' => __( 'Y', 'ultimate-store-kit' ),
1295	'type' => Controls_Manager::SLIDER,
1296	'default' => [
1297	'size' => 0,
1298	],
1299	'tablet_default' => [
1300	'size' => 0,
1301	],
1302	'mobile_default' => [
1303	'size' => 0,
1304	],
1305	'range' => [
1306	'px' => [
1307	'min' => -800,
1308	'max' => 800,
1309	],
1310	],
1311	'condition' => [
1312	'badge_offset_toggle' => 'yes'
1313	],
1314	'render_type' => 'ui',
1315	'selectors' => [
1316	'{{WRAPPER}}' => '--usk-badge-y-offset: {{SIZE}}px;'
1317	],
1318	]
1319	);
1320
1321	$this->add_responsive_control(
1322	'badge_rotate',
1323	[
1324	'label' => __( 'Rotate', 'ultimate-store-kit' ),
1325	'type' => Controls_Manager::SLIDER,
1326	'default' => [
1327	'size' => 0,
1328	],
1329	'tablet_default' => [
1330	'size' => 0,
1331	],
1332	'mobile_default' => [
1333	'size' => 0,
1334	],
1335	'range' => [
1336	'px' => [
1337	'min' => -180,
1338	'max' => 180,
1339	'step' => 5,
1340	],
1341	],
1342	'condition' => [
1343	'badge_offset_toggle' => 'yes'
1344	],
1345	'render_type' => 'ui',
1346	'selectors' => [
1347	'{{WRAPPER}}' => '--usk-badge-rotate: {{SIZE}}deg;'
1348	],
1349	]
1350	);
1351	$this->end_popover();
1352	$this->end_controls_tab();
1353	$this->start_controls_tab(
1354	'tab_badge_hover',
1355	[
1356	'label' => esc_html__('Hover', 'ultimate-store-kit'),
1357	]
1358	);
1359	$this->add_control(
1360	'badge_hover_color',
1361	[
1362	'label' => esc_html__('Color', 'ultimate-store-kit'),
1363	'type' => Controls_Manager::COLOR,
1364	'selectors' => [
1365	'{{WRAPPER}} .usk-featured-box .usk-badge:hover' => 'color: {{VALUE}};',
1366	],
1367	]
1368	);
1369	$this->add_group_control(
1370	Group_Control_Background::get_type(),
1371	[
1372	'name' => 'badge_hover_background',
1373	'exclude' => ['image'],
1374	'selector' => '{{WRAPPER}} .usk-featured-box .usk-badge:hover',
1375	]
1376	);
1377	$this->add_control(
1378	'badge_hover_border_color',
1379	[
1380	'label' => esc_html__('Border Color', 'ultimate-store-kit'),
1381	'type' => Controls_Manager::COLOR,
1382	'condition' => [
1383	'badge_border_border!' => '',
1384	],
1385	'selectors' => [
1386	'{{WRAPPER}} .usk-featured-box .usk-badge:hover' => 'border-color: {{VALUE}};',
1387	],
1388	]
1389	);
1390	$this->end_controls_tab();
1391	$this->end_controls_tabs();
1392	$this->end_controls_section();
1393	}
1394
1395	public function render_title() {
1396	$settings = $this->get_settings_for_display();
1397
1398	if (!$settings['show_title']) {
1399	return;
1400	}
1401
1402	if ( ! empty($settings['title_link']['url']) && ! empty($settings['title']) ) {
1403	$this->add_link_attributes('title-link', $settings['title_link'], true);
1404	}
1405
1406	if (!empty($settings['title'])) {
1407	printf(
1408	'<%1$s class="usk-title"><a %2$s title="%3$s">%3$s</a></%1$s>',
1409	esc_attr( Utils::get_valid_html_tag($settings['title_tag']) ),
1410	$this->get_render_attribute_string('title-link'), // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1411	esc_attr($settings['title'])
1412	);
1413	}
1414	}
1415
1416	public function render_text() {
1417	$settings = $this->get_settings_for_display();
1418
1419	if (!$settings['show_text']) {
1420	return;
1421	}
1422
1423	?>
1424	<?php if ($settings['text']): ?>
1425	<div class="usk-text">
1426	<?php echo wp_kses_post($settings['text']); ?>
1427	</div>
1428	<?php endif;
1429	}
1430
1431	public function render_meta() {
1432	$settings = $this->get_settings_for_display();
1433
1434	if (!$settings['show_meta']) {
1435	return;
1436	}
1437
1438	?>
1439	<?php if ($settings['meta']): ?>
1440	<div class="usk-meta">
1441	<?php echo wp_kses_post($settings['meta']); ?>
1442	</div>
1443	<?php endif;
1444	}
1445
1446	public function rendar_image() {
1447	$settings = $this->get_settings_for_display();
1448
1449	if (empty($settings['image']['url'])) {
1450	return;
1451	}
1452
1453	?>
1454
1455	<div class="usk-image-wrap"></div>
1456
1457	<?php
1458	}
1459
1460	public function render_readmore() {
1461	$settings = $this->get_settings_for_display();
1462
1463	if (!$settings['show_readmore']) {
1464	return;
1465	}
1466
1467	if (!empty($settings['readmore_link']['url'])) {
1468	$this->add_link_attributes('readmore-link', $settings['readmore_link'], true);
1469	}
1470
1471	?>
1472	<?php if ((!empty($settings['readmore_link']['url'])) && ($settings['show_readmore'])): ?>
1473	<div class="usk-link-btn">
1474	<a <?php $this->print_render_attribute_string('readmore-link');?>>
1475	<span><?php echo esc_html($settings['readmore_text']); ?></span>
1476	</a>
1477	</div>
1478	<?php endif;?>
1479	<?php
1480	}
1481
1482	protected function render() {
1483	$settings = $this->get_settings_for_display();
1484
1485	$this->add_render_attribute('featured-box', 'class', 'usk-featured-box usk-fb-content-position-' . $settings['content_position']);
1486
1487	if (!empty($settings['wrapper_link']['url'])) {
1488	$this->add_link_attributes('link', $settings['wrapper_link'], true);
1489	}
1490	$this->add_render_attribute('link', 'class', 'usk-featured-box-wrapper-link', true);
1491
1492	?>
1493	<div <?php $this->print_render_attribute_string('featured-box');?>>
1494
1495	<div class="usk-item">
1496	<?php $this->rendar_image();?>
1497	<div class="usk-content">
1498	<?php $this->render_meta();?>
1499	<?php $this->render_title();?>
1500	<?php $this->render_text();?>
1501	<?php $this->render_readmore();?>
1502	</div>
1503	</div>
1504	<?php
1505	if ($settings['badge'] == 'yes' and !empty($settings['badge_text'])) {
1506	printf('<div class="usk-badge">%1$s</div>', esc_html($settings['badge_text']));
1507	}
1508	if ($settings['show_wrapper_link'] == 'yes' and !empty($settings['wrapper_link']['url'])) { ?>
1509	<a <?php $this->print_render_attribute_string('link'); ?>></a>
1510	<?php } ?>
1511
1512	</div>
1513	<?php
1514	}
1515	}
1516