betterdocs / includes / elementor / widgets / basic / betterdocs-elementor-category-box.php

betterdocs-elementor-category-box.php in BetterDocs – AI Documentation, Knowledge Base, MCP Server, Docs, Wikis, FAQ & Chatbot 2.0.1, at includes/elementor/widgets/basic/betterdocs-elementor-category-box.php

2,019 lines 72.5 KB

Raw Download Zip

1	<?php
2
3	use Elementor\Controls_Manager;
4	use \Elementor\Group_Control_Border;
5	use \Elementor\Group_Control_Box_Shadow;
6	use \Elementor\Group_Control_Typography;
7	use \Elementor\Group_Control_Background;
8	use Elementor\Widget_Base;
9
10	if (!defined('ABSPATH')) {
11	exit; // Exit if accessed directly
12	}
13
14	class BetterDocs_Elementor_Category_Box extends Widget_Base
15	{
16
17	use \Better_Docs_Elementor\Traits\Template_Query;
18
19	public function get_name()
20	{
21	return 'betterdocs-category-box';
22	}
23
24	public function get_title()
25	{
26	return __('BetterDocs Category Box', 'betterdocs');
27	}
28
29	public function get_icon()
30	{
31	return 'betterdocs-icon-category-box';
32	}
33
34	public function get_categories()
35	{
36	return ['docs-archive'];
37	}
38
39	public function get_style_depends()
40	{
41	return [
42	'betterdocs-category-box'
43	];
44	}
45
46	public function get_keywords()
47	{
48	return [
49	'knowledgebase',
50	'knowledge Base',
51	'documentation',
52	'doc',
53	'kb',
54	'betterdocs',
55	'docs',
56	'category-box'
57	];
58	}
59
60	public function get_custom_help_url()
61	{
62	return 'https://betterdocs.co/docs/betterdocs-category-box';
63	}
64
65	protected function _register_controls()
66	{
67	/**
68	* Query Controls!
69	* @source includes/elementor-helper.php
70	*/
71	do_action('betterdocs/elementor/widgets/query', $this, 'doc_category');
72
73	/**
74	* ----------------------------------------------------------
75	* Section: Layout Options
76	* ----------------------------------------------------------
77	*/
78	$this->start_controls_section(
79	'section_layout_options',
80	[
81	'label' => __('Layout Options', 'betterdocs')
82	]
83	);
84
85	$this->add_control(
86	'layout_template',
87	[
88	'label' => __('Select Layout', 'betterdocs'),
89	'type' => Controls_Manager::SELECT2,
90	'options' => $this->template_options(),
91	'default' => $this->get_default(),
92	'label_block' => true
93	]
94	);
95
96	$this->add_responsive_control(
97	'box_column',
98	[
99	'label' => __('Box Column', 'betterdocs'),
100	'type' => Controls_Manager::SELECT,
101	'default' => '3',
102	'tablet_default' => '2',
103	'mobile_default' => '1',
104	'options' => [
105	'1' => '1',
106	'2' => '2',
107	'3' => '3',
108	'4' => '4'
109	],
110	'prefix_class' => 'elementor-grid%s-',
111	'frontend_available' => true,
112	'label_block' => true,
113	'condition' => [
114	'layout_template' => ['layout-2', 'default']
115	]
116	]
117	);
118
119	$this->add_control(
120	'show_icon',
121	[
122	'label' => __('Show Icon', 'betterdocs'),
123	'type' => Controls_Manager::SWITCHER,
124	'label_on' => __('Show', 'betterdocs'),
125	'label_off' => __('Hide', 'betterdocs'),
126	'return_value' => 'true',
127	'default' => 'true'
128	]
129	);
130
131	$this->add_control(
132	'show_title',
133	[
134	'label' => __('Show Title', 'betterdocs'),
135	'type' => Controls_Manager::SWITCHER,
136	'label_on' => __('Show', 'betterdocs'),
137	'label_off' => __('Hide', 'betterdocs'),
138	'return_value' => 'true',
139	'default' => 'true'
140	]
141	);
142
143	$this->add_control(
144	'title_tag',
145	[
146	'label' => __('Select Tag', 'betterdocs'),
147	'type' => Controls_Manager::SELECT,
148	'default' => 'h2',
149	'options' => [
150	'h1' => __('H1', 'betterdocs'),
151	'h2' => __('H2', 'betterdocs'),
152	'h3' => __('H3', 'betterdocs'),
153	'h4' => __('H4', 'betterdocs'),
154	'h5' => __('H5', 'betterdocs'),
155	'h6' => __('H6', 'betterdocs'),
156	'span' => __('Span', 'betterdocs'),
157	'p' => __('P', 'betterdocs'),
158	'div' => __('Div', 'betterdocs'),
159	],
160	'condition' => [
161	'show_title' => 'true'
162	],
163	]
164	);
165
166	$this->add_control(
167	'show_count',
168	[
169	'label' => __('Show Count', 'betterdocs'),
170	'type' => Controls_Manager::SWITCHER,
171	'label_on' => __('Show', 'betterdocs'),
172	'label_off' => __('Hide', 'betterdocs'),
173	'return_value' => 'true',
174	'default' => 'true'
175	]
176	);
177
178	$this->add_control(
179	'listview-show-description',
180	[
181	'label' => __('Show Category Description', 'betterdocs'),
182	'type' => Controls_Manager::SWITCHER,
183	'label_on' => __('Show', 'betterdocs'),
184	'label_off' => __('Hide', 'betterdocs'),
185	'return_value' => 'true',
186	'default' => 'true',
187	'condition' => [
188	'layout_template' => 'layout-3'
189	]
190	]
191	);
192
193	$this->add_control(
194	'count_prefix',
195	[
196	'label' => __('Prefix', 'betterdocs'),
197	'type' => Controls_Manager::TEXT,
198	'dynamic' => ['active' => true],
199	'condition' => [
200	'show_count' => 'true',
201	'layout_template' => 'default'
202	]
203	]
204	);
205
206	$this->add_control(
207	'count_suffix',
208	[
209	'label' => __('Suffix', 'betterdocs'),
210	'type' => Controls_Manager::TEXT,
211	'dynamic' => ['active' => true],
212	'default' => __('articles', 'betterdocs'),
213	'condition' => [
214	'show_count' => 'true',
215	'layout_template' => 'default'
216	]
217	]
218	);
219
220	$this->add_control(
221	'count_suffix_singular',
222	[
223	'label' => __('Suffix Singular', 'betterdocs'),
224	'type' => Controls_Manager::TEXT,
225	'dynamic' => ['active' => true],
226	'default' => __('article', 'betterdocs'),
227	'condition' => [
228	'show_count' => 'true',
229	'layout_template' => 'default'
230	]
231	]
232	);
233
234	$this->end_controls_section();
235
236	/**
237	* ----------------------------------------------------------
238	* Section: Box Styles
239	* ----------------------------------------------------------
240	*/
241	$this->start_controls_section(
242	'section_card_settings',
243	[
244	'label' => __('Box', 'betterdocs'),
245	'tab' => Controls_Manager::TAB_STYLE,
246	'condition' => [
247	'layout_template' => [
248	'layout-2',
249	'default'
250	]
251	]
252	]
253	);
254
255	$this->add_responsive_control(
256	'column_space', // Legacy control id but new control
257	[
258	'label' => __('Box Spacing', 'betterdocs'),
259	'type' => Controls_Manager::DIMENSIONS,
260	'size_units' => ['px', '%', 'em'],
261	'selectors' => [
262	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
263	]
264	]
265	);
266
267	$this->add_responsive_control(
268	'column_padding',
269	[
270	'label' => __('Box Padding', 'betterdocs'),
271	'type' => Controls_Manager::DIMENSIONS,
272	'size_units' => ['px', 'em', '%'],
273	'selectors' => [
274	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
275	]
276	]
277	);
278
279	$this->start_controls_tabs('card_settings_tabs');
280
281	// Normal State Tab
282	$this->start_controls_tab(
283	'card_normal',
284	['label' => esc_html__('Normal', 'betterdocs')]
285	);
286
287	$this->add_group_control(
288	Group_Control_Background::get_type(),
289	[
290	'name' => 'card_bg_normal',
291	'types' => ['classic', 'gradient'],
292	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner'
293	]
294	);
295
296	$this->add_group_control(
297	Group_Control_Border::get_type(),
298	[
299	'name' => 'card_border_normal',
300	'label' => esc_html__('Border', 'betterdocs'),
301	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner'
302	]
303	);
304
305	$this->add_responsive_control(
306	'card_border_radius_normal',
307	[
308	'label' => esc_html__('Border Radius', 'betterdocs'),
309	'type' => Controls_Manager::DIMENSIONS,
310	'size_units' => ['px', 'em', '%'],
311	'selectors' => [
312	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
313	],
314	]
315	);
316
317	$this->add_group_control(
318	Group_Control_Box_Shadow::get_type(),
319	[
320	'name' => 'card_box_shadow_normal',
321	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner'
322	]
323	);
324
325	$this->end_controls_tab();
326
327	//Add Border Bottom Normal State
328	$this->add_control(
329	'category_box_border_bottom',
330	[
331	'label' => __('Border Bottom', 'betterdocs'),
332	'type' => Controls_Manager::SWITCHER,
333	'label_on' => __('Show', 'betterdocs'),
334	'label_off' => __('Hide', 'betterdocs'),
335	'return_value' => 'true',
336	'default' => 'false',
337	'condition' => [
338	'layout_template' => 'default'
339	]
340	]
341	);
342
343	$this->add_control(
344	'category_box_border_bottom_size',
345	[
346	'label' => __('Border Bottom Size', 'betterdocs'),
347	'type' => Controls_Manager::SLIDER,
348	'size_units' => ['px', 'em'],
349	'range' => [
350	'px' => [
351	'min' => 0,
352	'max' => 1000,
353	]
354	],
355	'default' => [
356	'size' => 10,
357	'unit' => 'px',
358	],
359	'condition' => [
360	'category_box_border_bottom' => 'true',
361	'layout_template' => 'default'
362	],
363	'selectors' => [
364	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner' => 'border-bottom:{{SIZE}}{{UNIT}} solid #880380D4;',
365	]
366	]
367	);
368
369	$this->add_control(
370	'category_box_border_color',
371	[
372	'label' => __('Border Bottom Color', 'betterdocs'),
373	'type' => Controls_Manager::COLOR,
374	'default' => ' #880380D4',
375	'condition' => [
376	'category_box_border_bottom' => 'true',
377	'layout_template' => 'default'
378	],
379	'selectors' => [
380	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner' => 'border-bottom-color:{{VALUE}};',
381	]
382	]
383	);
384
385	// Hover State Tab
386	$this->start_controls_tab(
387	'card_hover',
388	['label' => esc_html__('Hover', 'betterdocs')]
389	);
390
391	$this->add_control(
392	'card_transition',
393	[
394	'label' => __('Transition', 'betterdocs'),
395	'type' => Controls_Manager::SLIDER,
396	'default' => [
397	'size' => 300,
398	'unit' => '%',
399	],
400	'size_units' => ['%'],
401	'range' => [
402	'%' => [
403	'max' => 2500,
404	'step' => 1,
405	],
406	],
407	'selectors' => [
408	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner' => 'transition: {{SIZE}}ms;',
409	],
410	]
411	);
412
413	$this->add_group_control(
414	Group_Control_Background::get_type(),
415	[
416	'name' => 'card_bg_hover',
417	'types' => ['classic', 'gradient'],
418	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover'
419	]
420	);
421
422	$this->add_group_control(
423	Group_Control_Border::get_type(),
424	[
425	'name' => 'card_border_hover',
426	'label' => esc_html__('Border', 'betterdocs'),
427	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover'
428	]
429	);
430
431	$this->add_responsive_control(
432	'card_border_radius_hover',
433	[
434	'label' => esc_html__('Border Radius', 'betterdocs'),
435	'type' => Controls_Manager::DIMENSIONS,
436	'size_units' => ['px', 'em', '%'],
437	'selectors' => [
438	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
439	],
440	]
441	);
442
443	$this->add_group_control(
444	Group_Control_Box_Shadow::get_type(),
445	[
446	'name' => 'card_box_shadow_hover',
447	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover'
448	]
449	);
450
451	//Add Border Bottom On Hover
452	$this->add_control(
453	'category_box_border_bottom_hover',
454	[
455	'label' => __('Border Bottom Hover', 'betterdocs'),
456	'type' => Controls_Manager::SWITCHER,
457	'label_on' => __('Show', 'betterdocs'),
458	'label_off' => __('Hide', 'betterdocs'),
459	'return_value' => 'true',
460	'default' => 'false',
461	'condition' => [
462	'layout_template' => 'default'
463	]
464	]
465	);
466
467	$this->add_control(
468	'category_box_border_bottom_size_hover',
469	[
470	'label' => __('Border Bottom Size Hover', 'betterdocs'),
471	'type' => Controls_Manager::SLIDER,
472	'size_units' => ['px', 'em'],
473	'range' => [
474	'px' => [
475	'min' => 0,
476	'max' => 1000,
477	]
478	],
479	'default' => [
480	'size' => 10,
481	'unit' => 'px',
482	],
483	'condition' => [
484	'category_box_border_bottom_hover' => 'true',
485	'layout_template' => 'default'
486	],
487	'selectors' => [
488	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover' => 'border-bottom:{{SIZE}}{{UNIT}} solid #880380D4;',
489	]
490	]
491	);
492
493	$this->add_control(
494	'category_box_border_color_hover',
495	[
496	'label' => esc_html__('Border Color Hover', 'betterdocs'),
497	'type' => Controls_Manager::COLOR,
498	'condition' => [
499	'category_box_border_bottom_hover' => 'true',
500	'layout_template' => 'default'
501	],
502	'selectors' => [
503	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover' => 'border-bottom-color:{{VALUE}};',
504	]
505	]
506	);
507
508	$this->end_controls_tab();
509
510	$this->end_controls_tabs();
511	$this->end_controls_section(); # end of 'Card Settings'
512
513	/**
514	* ----------------------------------------------------------
515	* Section: Icon Styles
516	* ----------------------------------------------------------
517	*/
518	$this->start_controls_section(
519	'section_box_icon_style',
520	[
521	'label' => __('Icon', 'betterdocs'),
522	'tab' => Controls_Manager::TAB_STYLE,
523	'condition' => [
524	'layout_template' => [
525	'layout-2',
526	'default'
527	]
528	]
529	]
530	);
531
532	$this->add_control(
533	'category_settings_area',
534	[
535	'label' => __('Area', 'betterdocs'),
536	'type' => Controls_Manager::HEADING
537	]
538	);
539
540	$this->add_responsive_control(
541	'category_settings_icon_area_size_normal',
542	[
543	'label' => esc_html__('Size', 'betterdocs'),
544	'type' => Controls_Manager::SLIDER,
545	'size_units' => ['px', '%', 'em'],
546	'range' => [
547	'px' => [
548	'max' => 500,
549	],
550	],
551	'selectors' => [
552	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon' => 'height: {{SIZE}}{{UNIT}}; width: {{SIZE}}{{UNIT}};',
553	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon__layout-2' => 'flex-basis: {{SIZE}}{{UNIT}};'
554	],
555	]
556	);
557
558	$this->add_control(
559	'category_settings_icon',
560	[
561	'label' => __('Icon', 'betterdocs'),
562	'type' => Controls_Manager::HEADING,
563	'separator' => 'before',
564	]
565	);
566
567	$this->add_responsive_control(
568	'category_settings_icon_size_normal',
569	[
570	'label' => esc_html__('Size', 'betterdocs'),
571	'type' => Controls_Manager::SLIDER,
572	'size_units' => ['px', '%', 'em'],
573	'range' => [
574	'px' => [
575	'max' => 500,
576	],
577	],
578	'selectors' => [
579	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon img' => 'width: {{SIZE}}{{UNIT}};',
580	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon__layout-2 img' => 'width: {{SIZE}}{{UNIT}};'
581	],
582	]
583	);
584
585	$this->start_controls_tabs('box_icon_styles_tab');
586
587	// Normal State Tab
588	$this->start_controls_tab(
589	'icon_normal',
590	['label' => esc_html__('Normal', 'betterdocs')]
591	);
592
593	$this->add_group_control(
594	Group_Control_Background::get_type(),
595	[
596	'name' => 'icon_background_normal',
597	'types' => ['classic', 'gradient'],
598	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon, {{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon__layout-2',
599	'exclude' => [
600	'image'
601	]
602	]
603	);
604
605	$this->add_group_control(
606	Group_Control_Border::get_type(),
607	[
608	'name' => 'icon_border_normal',
609	'label' => esc_html__('Border', 'betterdocs'),
610	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon, {{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon__layout-2'
611	]
612	);
613
614	$this->add_responsive_control(
615	'icon_border_radius_normal',
616	[
617	'label' => esc_html__('Border Radius', 'betterdocs'),
618	'type' => Controls_Manager::DIMENSIONS,
619	'size_units' => ['px', 'em', '%'],
620	'selectors' => [
621	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
622	],
623	'condition' => [
624	'layout_template' => 'default'
625	]
626	]
627	);
628
629	$this->add_responsive_control(
630	'icon_padding',
631	[
632	'label' => esc_html__('Padding', 'betterdocs'),
633	'type' => Controls_Manager::DIMENSIONS,
634	'size_units' => ['px', 'em', '%'],
635	'selectors' => [
636	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
637	],
638	'condition' => [
639	'layout_template' => 'default'
640	]
641	]
642	);
643
644	$this->add_responsive_control(
645	'icon_spacing',
646	[
647	'label' => esc_html__('Spacing', 'betterdocs'),
648	'type' => Controls_Manager::DIMENSIONS,
649	'size_units' => ['px', 'em', '%'],
650	'allowed_dimensions' => [
651	'top',
652	'bottom'
653	],
654	'selectors' => [
655	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon' => 'margin: {{TOP}}{{UNIT}} auto {{BOTTOM}}{{UNIT}} auto;'
656	],
657	'condition' => [
658	'layout_template' => 'default'
659	]
660	]
661	);
662
663	$this->end_controls_tab();
664
665	// Hover State Tab
666	$this->start_controls_tab(
667	'icon_hover',
668	['label' => esc_html__('Hover', 'betterdocs')]
669	);
670
671	$this->add_group_control(
672	Group_Control_Background::get_type(),
673	[
674	'name' => 'icon_background_hover',
675	'types' => ['classic', 'gradient'],
676	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover .el-betterdocs-cb-cat-icon,
677	{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover .el-betterdocs-cb-cat-icon__layout-2'
678	]
679	);
680
681	$this->add_group_control(
682	Group_Control_Border::get_type(),
683	[
684	'name' => 'icon_border_hover',
685	'label' => esc_html__('Border', 'betterdocs'),
686	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover .el-betterdocs-cb-cat-icon,
687	{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover .el-betterdocs-cb-cat-icon__layout-2'
688	]
689	);
690
691	$this->add_responsive_control(
692	'icon_border_radius_hover',
693	[
694	'label' => esc_html__('Border Radius', 'betterdocs'),
695	'type' => Controls_Manager::DIMENSIONS,
696	'size_units' => ['px', 'em', '%'],
697	'selectors' => [
698	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover .el-betterdocs-cb-cat-icon' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
699	],
700	'condition' => [
701	'layout_template' => 'default'
702	]
703	]
704	);
705
706	$this->add_control(
707	'category_settings_icon_size_transition',
708	[
709	'label' => __('Transition', 'betterdocs'),
710	'type' => Controls_Manager::SLIDER,
711	'default' => [
712	'size' => 300,
713	'unit' => '%',
714	],
715	'size_units' => ['%'],
716	'range' => [
717	'%' => [
718	'max' => 2500,
719	'step' => 1,
720	],
721	],
722	'selectors' => [
723	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .el-betterdocs-cb-cat-icon' => 'transition: {{SIZE}}ms;',
724	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .el-betterdocs-cb-cat-icon img' => 'transition: {{SIZE}}ms;',
725	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon__layout-2' => 'transition: {{SIZE}}ms;',
726	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-icon__layout-2 img' => 'transition: {{SIZE}}ms;'
727	],
728	]
729	);
730
731	$this->end_controls_tab();
732
733	$this->end_controls_tabs();
734
735	$this->end_controls_section(); # end of 'Icon Styles'
736
737
738	/**
739	* ----------------------------------------------------------
740	* Section: Title Styles
741	* ----------------------------------------------------------
742	*/
743	$this->start_controls_section(
744	'section_box_title_styles',
745	[
746	'label' => __('Title', 'betterdocs'),
747	'tab' => Controls_Manager::TAB_STYLE,
748	'condition' => [
749	'layout_template' => [
750	'layout-2',
751	'default'
752	]
753	]
754	]
755	);
756
757	$this->add_control(
758	'title_styles_area_heading',
759	[
760	'label' => __('Area', 'betterdocs'),
761	'type' => Controls_Manager::HEADING,
762	'condition' => [
763	'layout_template' => 'Layout_2'
764	]
765	]
766	);
767
768	$this->add_responsive_control(
769	'title_area_size',
770	[
771	'label' => esc_html__('Area Size', 'betterdocs'),
772	'type' => Controls_Manager::SLIDER,
773	'size_units' => ['px', '%', 'em'],
774	'range' => [
775	'px' => [
776	'max' => 500,
777	],
778	],
779	'selectors' => [
780	'{{WRAPPER}} .layout__2 .el-betterdocs-cb-cat-title__layout-2' => 'flex-basis: {{SIZE}}{{UNIT}};'
781	],
782	'condition' => [
783	'layout_template' => 'Layout_2'
784	]
785	]
786	);
787
788	$this->add_group_control(
789	Group_Control_Typography::get_type(),
790	[
791	'name' => 'cat_title_typography_normal',
792	'selector' => '{{WRAPPER}} .el-betterdocs-cb-inner .el-betterdocs-cb-cat-title, {{WRAPPER}} .layout__2 .el-betterdocs-cb-cat-title__layout-2'
793	]
794	);
795
796	$this->add_responsive_control(
797	'title_alignment',
798	[
799	'label' => __('Text Alignment', 'betterdocs'),
800	'type' => Controls_Manager::CHOOSE,
801	'options' => [
802	'flex-start' => [
803	'title' => __('Left', 'betterdocs'),
804	'icon' => 'fa fa-align-left',
805	],
806	'center' => [
807	'title' => __('Center', 'betterdocs'),
808	'icon' => 'fa fa-align-center',
809	],
810	'flex-end' => [
811	'title' => __('Right', 'betterdocs'),
812	'icon' => 'fa fa-align-right',
813	],
814	],
815	'selectors' => [
816	'{{WRAPPER}} .layout__2 .el-betterdocs-cb-cat-title__layout-2' => 'justify-content: {{VALUE}};',
817	],
818	'condition' => [
819	'layout_template' => 'Layout_2'
820	],
821	'separator' => 'before'
822	]
823	);
824
825	$this->start_controls_tabs('box_title_styles_tab');
826
827	// Normal State Tab
828	$this->start_controls_tab(
829	'title_normal',
830	['label' => esc_html__('Normal', 'betterdocs')]
831	);
832
833	$this->add_control(
834	'cat_title_color_normal',
835	[
836	'label' => esc_html__('Color', 'betterdocs'),
837	'type' => Controls_Manager::COLOR,
838	'selectors' => [
839	'{{WRAPPER}} .el-betterdocs-cb-inner .el-betterdocs-cb-cat-title' => 'color: {{VALUE}};',
840	'{{WRAPPER}} .layout__2 .el-betterdocs-cb-cat-title__layout-2' => 'color: {{VALUE}};'
841	],
842	]
843	);
844
845	$this->add_responsive_control(
846	'title_spacing',
847	[
848	'label' => __('Spacing', 'betterdocs'),
849	'type' => Controls_Manager::DIMENSIONS,
850	'size_units' => ['px', '%', 'em'],
851	'selectors' => [
852	'{{WRAPPER}} .el-betterdocs-cb-inner .el-betterdocs-cb-cat-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
853	'{{WRAPPER}} .layout__2 .el-betterdocs-cb-cat-title__layout-2 span' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
854	]
855	]
856	);
857
858	$this->end_controls_tab();
859
860	// Hover State Tab
861	$this->start_controls_tab(
862	'title_hover',
863	['label' => esc_html__('Hover', 'betterdocs')]
864	);
865
866	$this->add_control(
867	'cat_title_color_hover',
868	[
869	'label' => esc_html__('Color', 'betterdocs'),
870	'type' => Controls_Manager::COLOR,
871	'selectors' => [
872	'{{WRAPPER}} .el-betterdocs-cb-inner:hover .el-betterdocs-cb-cat-title' => 'color: {{VALUE}};',
873	'{{WRAPPER}} .el-betterdocs-cb-inner:hover .el-betterdocs-cb-cat-title__layout-2' => 'color: {{VALUE}};'
874	],
875	]
876	);
877
878	$this->add_control(
879	'category_title_transition',
880	[
881	'label' => __('Transition', 'betterdocs'),
882	'type' => Controls_Manager::SLIDER,
883	'default' => [
884	'size' => 300,
885	'unit' => '%',
886	],
887	'size_units' => ['%'],
888	'range' => [
889	'%' => [
890	'max' => 2500,
891	'step' => 1,
892	],
893	],
894	'selectors' => [
895	'{{WRAPPER}} .el-betterdocs-cb-inner .el-betterdocs-cb-cat-title' => 'transition: {{SIZE}}ms;',
896	'{{WRAPPER}} .el-betterdocs-cb-inner:hover .el-betterdocs-cb-cat-title__layout-2' => 'transition: {{SIZE}}ms;',
897	],
898	]
899	);
900
901	$this->end_controls_tab();
902
903	$this->end_controls_tabs();
904
905	$this->end_controls_section(); # end of 'Icon Styles'
906
907	/**
908	* ----------------------------------------------------------
909	* Section: Count Styles
910	* ----------------------------------------------------------
911	*/
912	$this->start_controls_section(
913	'section_box_count_styles',
914	[
915	'label' => __('Count', 'betterdocs'),
916	'tab' => Controls_Manager::TAB_STYLE,
917	'condition' => [
918	'layout_template' => [
919	'layout-2',
920	'default'
921	]
922	]
923	]
924	);
925
926	$this->add_group_control(
927	Group_Control_Typography::get_type(),
928	[
929	'name' => 'count_typography_normal',
930	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .el-betterdocs-cb-cat-count, {{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .count-inner__layout-2'
931	]
932	);
933
934	$this->add_responsive_control(
935	'count_area_size',
936	[
937	'label' => esc_html__('Size', 'betterdocs'),
938	'type' => Controls_Manager::SLIDER,
939	'size_units' => ['px', '%', 'em'],
940	'range' => [
941	'px' => [
942	'max' => 500,
943	],
944	],
945	'selectors' => [
946	'{{WRAPPER}} .layout__2 .el-betterdocs-cb-cat-count__layout-2' => 'flex-basis: {{SIZE}}{{UNIT}};'
947	],
948	'condition' => [
949	'layout_template' => 'Layout_2'
950	]
951	]
952	);
953
954	$this->add_group_control(
955	Group_Control_Background::get_type(),
956	[
957	'name' => 'count_box_bg',
958	'types' => ['classic', 'gradient'],
959	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .count-inner__layout-2',
960	'condition' => [
961	'layout_template' => 'Layout_2'
962	]
963	]
964	);
965
966	$this->start_controls_tabs('box_count_styles_tab');
967
968	// Normal State Tab
969	$this->start_controls_tab(
970	'count_normal',
971	['label' => esc_html__('Normal', 'betterdocs')]
972	);
973
974	$this->add_control(
975	'count_color_normal',
976	[
977	'label' => esc_html__('Color', 'betterdocs'),
978	'type' => Controls_Manager::COLOR,
979	'selectors' => [
980	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .el-betterdocs-cb-cat-count' => 'color: {{VALUE}};',
981	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .count-inner__layout-2' => 'color: {{VALUE}};'
982	],
983	]
984	);
985
986	$this->add_group_control(
987	Group_Control_Border::get_type(),
988	[
989	'name' => 'count_box_border',
990	'label' => esc_html__('Border', 'betterdocs'),
991	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .count-inner__layout-2',
992	'condition' => [
993	'layout_template' => 'Layout_2'
994	]
995	]
996	);
997
998	$this->add_responsive_control(
999	'count_box_border_radius',
1000	[
1001	'label' => esc_html__('Border Radius', 'betterdocs'),
1002	'type' => Controls_Manager::DIMENSIONS,
1003	'size_units' => ['px', 'em', '%'],
1004	'selectors' => [
1005	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .count-inner__layout-2' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1006	],
1007	'condition' => [
1008	'layout_template' => 'Layout_2'
1009	]
1010	]
1011	);
1012
1013	$this->add_group_control(
1014	Group_Control_Box_Shadow::get_type(),
1015	[
1016	'name' => 'count_box_box_shadow',
1017	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .count-inner__layout-2',
1018	'condition' => [
1019	'layout_template' => 'Layout_2'
1020	]
1021	]
1022	);
1023
1024	$this->add_responsive_control(
1025	'count_box_size',
1026	[
1027	'label' => esc_html__('Size', 'betterdocs'),
1028	'type' => Controls_Manager::SLIDER,
1029	'size_units' => ['px', '%', 'em'],
1030	'range' => [
1031	'px' => [
1032	'max' => 500,
1033	],
1034	],
1035	'selectors' => [
1036	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .count-inner__layout-2' => 'height: {{SIZE}}{{UNIT}}; width: {{SIZE}}{{UNIT}};'
1037	],
1038	'condition' => [
1039	'layout_template' => 'Layout_2'
1040	]
1041	]
1042	);
1043
1044	$this->add_responsive_control(
1045	'count_spacing',
1046	[
1047	'label' => __('Spacing', 'betterdocs'),
1048	'type' => Controls_Manager::DIMENSIONS,
1049	'size_units' => ['px', '%', 'em'],
1050	'selectors' => [
1051	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner .el-betterdocs-cb-cat-count' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1052	],
1053	'condition' => [
1054	'layout_template!' => 'Layout_2'
1055	]
1056	]
1057	);
1058
1059	$this->end_controls_tab();
1060
1061	// Hover State Tab
1062	$this->start_controls_tab(
1063	'count_hover',
1064	['label' => esc_html__('Hover', 'betterdocs')]
1065	);
1066
1067	$this->add_control(
1068	'count_color_hover',
1069	[
1070	'label' => esc_html__('Color', 'betterdocs'),
1071	'type' => Controls_Manager::COLOR,
1072	'selectors' => [
1073	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover .el-betterdocs-cb-cat-count' => 'color: {{VALUE}};',
1074	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover .count-inner__layout-2' => 'color: {{VALUE}};'
1075	],
1076	]
1077	);
1078
1079	$this->add_group_control(
1080	Group_Control_Background::get_type(),
1081	[
1082	'name' => 'count_box_bg_hover',
1083	'types' => ['classic', 'gradient'],
1084	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover .count-inner__layout-2',
1085	'condition' => [
1086	'layout_template' => 'Layout_2'
1087	]
1088	]
1089	);
1090
1091	$this->add_group_control(
1092	Group_Control_Border::get_type(),
1093	[
1094	'name' => 'count_box_border_hover',
1095	'label' => esc_html__('Border', 'betterdocs'),
1096	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover .count-inner__layout-2',
1097	'condition' => [
1098	'layout_template' => 'Layout_2'
1099	]
1100	]
1101	);
1102
1103	$this->add_responsive_control(
1104	'count_box_border_radius_hover',
1105	[
1106	'label' => esc_html__('Border Radius', 'betterdocs'),
1107	'type' => Controls_Manager::DIMENSIONS,
1108	'size_units' => ['px', 'em', '%'],
1109	'selectors' => [
1110	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover .count-inner__layout-2' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1111	],
1112	'condition' => [
1113	'layout_template' => 'Layout_2'
1114	]
1115	]
1116	);
1117
1118	$this->add_group_control(
1119	Group_Control_Box_Shadow::get_type(),
1120	[
1121	'name' => 'count_box_box_shadow_hover',
1122	'selector' => '{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-inner:hover .count-inner__layout-2',
1123	'condition' => [
1124	'layout_template' => 'Layout_2'
1125	]
1126	]
1127	);
1128
1129	$this->add_control(
1130	'category_count_transition',
1131	[
1132	'label' => __('Transition', 'betterdocs'),
1133	'type' => Controls_Manager::SLIDER,
1134	'default' => [
1135	'size' => 300,
1136	'unit' => '%',
1137	],
1138	'size_units' => ['%'],
1139	'range' => [
1140	'%' => [
1141	'max' => 2500,
1142	'step' => 1,
1143	],
1144	],
1145	'selectors' => [
1146	'{{WRAPPER}} .el-betterdocs-category-box-post .el-betterdocs-cb-cat-count' => 'transition: {{SIZE}}ms;',
1147	'{{WRAPPER}} .layout__2 .el-betterdocs-cb-cat-count__layout-2 .count-inner__layout-2' => 'transition: {{SIZE}}ms;',
1148	],
1149	]
1150	);
1151
1152	$this->end_controls_tab();
1153
1154	$this->end_controls_tabs();
1155
1156	$this->end_controls_section(); # end of 'Count Styles'
1157
1158	/**
1159	* Layout 3 Controls (List View Category)
1160	*/
1161	$this->box_setting_style();
1162	$this->icon_setting_style();
1163	$this->category_title_style();
1164	$this->category_article_count();
1165	}
1166
1167
1168	protected function render()
1169	{
1170	$settings = $this->get_settings_for_display();
1171
1172	$this->add_render_attribute(
1173	'bd_category_box_wrapper',
1174	[
1175	'id' => 'el-betterdocs-cat-box-' . esc_attr($this->get_id()),
1176	'class' => [
1177	'el-betterdocs-category-box-wrapper',
1178	],
1179	]
1180	);
1181
1182	$this->add_render_attribute(
1183	'bd_category_box_inner',
1184	[
1185	'class' => [
1186	'el-betterdocs-category-box'
1187	]
1188	]
1189	);
1190
1191	$terms_object = array(
1192	'taxonomy' => 'doc_category',
1193	'order' => $settings['order'],
1194	'offset' => $settings['offset'],
1195	'number' => $settings['box_per_page'],
1196	);
1197
1198	if ($settings['nested_subcategory'] == true) {
1199	$terms_object['parent'] = 0;
1200	}
1201
1202	if ($settings['include']) {
1203	$terms_object['include'] = array_diff($settings['include'], (array) $settings['exclude']);
1204	}
1205
1206	if ($settings['exclude']) {
1207	$terms_object['exclude'] = $settings['exclude'];
1208	}
1209
1210	if ($settings['orderby'] == 'betterdocs_order') {
1211	$terms_object['meta_key'] = 'doc_category_order';
1212	$terms_object['orderby'] = 'meta_value_num';
1213	$terms_object['order'] = 'ASC';
1214	} else {
1215	$terms_object['orderby'] = $settings['orderby'];
1216	}
1217
1218
1219	$default_multiple_kb = BetterDocs_Elementor::get_betterdocs_multiple_kb_status();
1220
1221	if ($settings['layout_template'] == 'Layout_2') {
1222	$settings['layout_template'] = 'layout-2';
1223	}
1224	if ($default_multiple_kb) {
1225	$object = get_queried_object();
1226	if (empty($settings['selected_knowledge_base']) && is_tax('knowledge_base')) {
1227	$meta_value = $object->slug;
1228	} else {
1229	$meta_value = $settings['selected_knowledge_base'];
1230	}
1231
1232	$terms_object['meta_query'] = array(
1233	array(
1234	'relation' => 'OR',
1235	array(
1236	'key' => 'doc_category_knowledge_base',
1237	'value' => $meta_value,
1238	'compare' => 'LIKE'
1239	)
1240	),
1241	);
1242
1243	$taxonomy_objects = get_terms($terms_object);
1244
1245	$html = '<div ' . $this->get_render_attribute_string('bd_category_box_wrapper') . '>';
1246	$html .= '<div ' . $this->get_render_attribute_string('bd_category_box_inner') . '>';
1247
1248	if( $settings['layout_template'] === 'layout-3' ) {
1249	$html = '';
1250	$html .= '<div class="betterdocs-archive-list-view"><div class="betterdocs-categories-wrap betterdocs-category-box betterdocs-category-box-pro pro-layout-3 layout-flex betterdocs-list-view ash-bg">';
1251	}
1252
1253	if (file_exists($this->get_template($settings['layout_template'])))
1254	{
1255	if ($taxonomy_objects && !is_wp_error($taxonomy_objects))
1256	{
1257	foreach ($taxonomy_objects as $term)
1258	{
1259	$term_id = $term->term_id;
1260	$term_slug = $term->slug;
1261	$count = $term->count;
1262	$get_term_count = betterdocs_get_postcount($count, $term_id, $settings['nested_subcategory']);
1263	$term_count = apply_filters('betterdocs_postcount', $get_term_count, $default_multiple_kb, $term_id, $term_slug, $count, $settings['nested_subcategory']);
1264	if ($term_count > 0) {
1265	$html .= BetterDocs_Elementor::include_with_variable($this->get_template($settings['layout_template']), ['term' => $term, 'term_count' => $term_count, 'settings' => $settings, 'default_multiple_kb' => $default_multiple_kb]);
1266	}
1267	}
1268	} else {
1269	$html .= '<p class="no-posts-found">' . __('No posts found!', 'betterdocs') . '</p>';
1270	}
1271	wp_reset_postdata();
1272	} else {
1273	$html .= '<h4>' . __('File Not Found', 'betterdocs') . '</h4>';
1274	}
1275	$html .= '</div>';
1276	$html .= '</div>';
1277	echo $html;
1278	} else {
1279	$taxonomy_objects = get_terms($terms_object);
1280
1281	$html = '<div ' . $this->get_render_attribute_string('bd_category_box_wrapper') . '>';
1282	$html .= '<div ' . $this->get_render_attribute_string('bd_category_box_inner') . '>';
1283
1284	if( $settings['layout_template'] === 'layout-3' ) {
1285	$html = '';
1286	$html .= '<div class="betterdocs-archive-list-view"><div class="betterdocs-categories-wrap betterdocs-category-box betterdocs-category-box-pro pro-layout-3 layout-flex betterdocs-list-view ash-bg single-kb">';
1287	}
1288
1289	if (file_exists($this->get_template($settings['layout_template'])))
1290	{
1291	if ($taxonomy_objects && !is_wp_error($taxonomy_objects))
1292	{
1293	foreach ($taxonomy_objects as $term)
1294	{
1295	$term_id = $term->term_id;
1296	$term_slug = $term->slug;
1297	$count = $term->count;
1298	$get_term_count = betterdocs_get_postcount($count, $term_id, $settings['nested_subcategory']);
1299	$term_count = apply_filters('betterdocs_postcount', $get_term_count, $default_multiple_kb, $term_id, $term_slug, $count, $settings['nested_subcategory']);
1300	if ($term_count > 0) {
1301	$html .= BetterDocs_Elementor::include_with_variable($this->get_template($settings['layout_template']), ['term' => $term, 'term_count' => $term_count, 'settings' => $settings, 'default_multiple_kb' => $default_multiple_kb]);
1302	}
1303	}
1304	} else {
1305	$html .= '<p class="no-posts-found">' . __('No posts found!', 'betterdocs') . '</p>';
1306	}
1307	wp_reset_postdata();
1308	} else {
1309	$html .= '<h4>' . __('File Not Found', 'betterdocs') . '</h4>';
1310	}
1311
1312	$html .= '</div>';
1313	$html .= '</div>';
1314
1315	echo $html;
1316	}
1317	}
1318
1319	public function box_setting_style() {
1320	/**
1321	* ----------------------------------------------------------
1322	* Section: Box Styles
1323	* ----------------------------------------------------------
1324	*/
1325	$this->start_controls_section(
1326	'listview_box_secion',
1327	[
1328	'label' => __('Category Box', 'betterdocs'),
1329	'tab' => Controls_Manager::TAB_STYLE,
1330	'condition' => [
1331	'layout_template' => 'layout-3'
1332	]
1333	]
1334	);
1335
1336
1337	$this->start_controls_tabs('box_background_color_tabs');
1338
1339	/ Normal State Tab Start /
1340	$this->start_controls_tab(
1341	'box_background_color_normal',
1342	[
1343	'label' => esc_html__('Normal', 'betterdocs')
1344	]
1345	);
1346
1347	$this->add_responsive_control(
1348	'listview_wholebox_margin_normal',
1349	[
1350	'label' => __('Box Margin', 'betterdocs'),
1351	'type' => Controls_Manager::DIMENSIONS,
1352	'size_units' => ['px', '%', 'em'],
1353	'selectors' => [
1354	'{{WRAPPER}} .betterdocs-categories-wrap' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1355	]
1356	]
1357	);
1358
1359	$this->add_responsive_control(
1360	'listview_wholebox_padding_normal',
1361	[
1362	'label' => __('Box Padding', 'betterdocs'),
1363	'type' => Controls_Manager::DIMENSIONS,
1364	'size_units' => ['px', '%', 'em'],
1365	'selectors' => [
1366	'{{WRAPPER}} .betterdocs-categories-wrap' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1367	]
1368	]
1369	);
1370
1371	$this->add_control(
1372	'box_background_color_normal_heading',
1373	[
1374	'label' => __('Background Color', 'betterdocs'),
1375	'type' => Controls_Manager::HEADING,
1376	'separator' => 'before'
1377	]
1378	);
1379
1380	$this->add_group_control(
1381	Group_Control_Background::get_type(),
1382	[
1383	'name' => 'box_background_color_1',
1384	'types' => [ 'classic', 'gradient', 'video' ],
1385	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap'
1386	]
1387	);
1388
1389	$this->add_control(
1390	'box_border_color_normal_heading',
1391	[
1392	'label' => __('Box Border', 'betterdocs'),
1393	'type' => Controls_Manager::HEADING,
1394	'separator' => 'before'
1395	]
1396	);
1397
1398	$this->add_group_control(
1399	Group_Control_Border::get_type(),
1400	[
1401	'name' => 'box_border_normal',
1402	'label' => __( 'Border', 'betterdocs' ),
1403	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap'
1404	]
1405	);
1406
1407	$this->add_group_control(
1408	Group_Control_Box_Shadow::get_type(),
1409	[
1410	'name' => 'box_shadow_normal',
1411	'label' => __( 'Box Shadow', 'betterdocs' ),
1412	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap'
1413	]
1414	);
1415
1416
1417	$this->add_control(
1418	'inner_boxes_normal_heading',
1419	[
1420	'label' => __('Category Box', 'betterdocs'),
1421	'type' => Controls_Manager::HEADING,
1422	'separator' => 'before'
1423	]
1424	);
1425
1426	$this->add_responsive_control(
1427	'listview_inner_boxes_margin_normal',
1428	[
1429	'label' => __('Box Margin', 'betterdocs'),
1430	'type' => Controls_Manager::DIMENSIONS,
1431	'size_units' => ['px', '%', 'em'],
1432	'selectors' => [
1433	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1434	]
1435	]
1436	);
1437
1438	$this->add_responsive_control(
1439	'listview_inner_boxes_padding_normal',
1440	[
1441	'label' => __('Box Padding', 'betterdocs'),
1442	'type' => Controls_Manager::DIMENSIONS,
1443	'size_units' => ['px', '%', 'em'],
1444	'selectors' => [
1445	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1446	]
1447	]
1448	);
1449
1450	$this->add_group_control(
1451	Group_Control_Border::get_type(),
1452	[
1453	'name' => 'all_box_border_normal',
1454	'label' => __( 'All Boxes Border', 'betterdocs' ),
1455	'selector' => '{{WRAPPER}} .docs-single-cat-wrap'
1456	]
1457	);
1458
1459	$this->add_control(
1460	'all_box_background_color_normal',
1461	[
1462	'label' => esc_html__('Color', 'betterdocs'),
1463	'type' => Controls_Manager::COLOR,
1464	'selectors' => [
1465	'{{WRAPPER}} .docs-single-cat-wrap' => 'background-color: {{VALUE}};',
1466	]
1467	]
1468	);
1469
1470	$this->add_group_control(
1471	Group_Control_Box_Shadow::get_type(),
1472	[
1473	'name' => 'all_box_shadow_normal',
1474	'label' => __( 'Box Shadow', 'betterdocs' ),
1475	'selector' => '{{WRAPPER}} .docs-single-cat-wrap'
1476	]
1477	);
1478
1479	$this->end_controls_tab();
1480	/ Normal State Tab End /
1481
1482	/ Hover State Tab Start /
1483	$this->start_controls_tab(
1484	'box_background_color_hover',
1485	[
1486	'label' => esc_html__('Hover', 'betterdocs')
1487	]
1488	);
1489
1490	$this->add_responsive_control(
1491	'listview_wholebox_margin_hover',
1492	[
1493	'label' => __('Box Margin', 'betterdocs'),
1494	'type' => Controls_Manager::DIMENSIONS,
1495	'size_units' => ['px', '%', 'em'],
1496	'selectors' => [
1497	'{{WRAPPER}} .betterdocs-categories-wrap:hover' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1498	]
1499	]
1500	);
1501
1502	$this->add_responsive_control(
1503	'listview_wholebox_padding_hover',
1504	[
1505	'label' => __('Box Padding', 'betterdocs'),
1506	'type' => Controls_Manager::DIMENSIONS,
1507	'size_units' => ['px', '%', 'em'],
1508	'selectors' => [
1509	'{{WRAPPER}} .betterdocs-categories-wrap:hover' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1510	]
1511	]
1512	);
1513
1514	$this->add_control(
1515	'box_background_color_hover_heading',
1516	[
1517	'label' => __('Background Color Hover', 'betterdocs'),
1518	'type' => Controls_Manager::HEADING,
1519	'separator' => 'before'
1520	]
1521	);
1522
1523	$this->add_group_control(
1524	Group_Control_Background::get_type(),
1525	[
1526	'name' => 'box_background_color_2',
1527	'types' => [ 'classic', 'gradient'],
1528	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap:hover'
1529	]
1530	);
1531
1532	$this->add_control(
1533	'box_border_color_hover_heading',
1534	[
1535	'label' => __('Box Border Hover', 'betterdocs'),
1536	'type' => Controls_Manager::HEADING,
1537	'separator' => 'before'
1538	]
1539	);
1540
1541	$this->add_group_control(
1542	Group_Control_Border::get_type(),
1543	[
1544	'name' => 'box_border_hover',
1545	'label' => __( 'Border', 'betterdocs' ),
1546	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap:hover'
1547	]
1548	);
1549
1550	$this->add_group_control(
1551	Group_Control_Box_Shadow::get_type(),
1552	[
1553	'name' => 'box_shadow_hover',
1554	'label' => __( 'Box Shadow Hover', 'betterdocs' ),
1555	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap:hover'
1556	]
1557	);
1558	$this->add_control(
1559	'cat_boxes_hover_heading',
1560	[
1561	'label' => __('Category Box Hover', 'betterdocs'),
1562	'type' => Controls_Manager::HEADING,
1563	'separator' => 'before'
1564	]
1565	);
1566
1567	$this->add_responsive_control(
1568	'listview_inner_boxes_margin_hover',
1569	[
1570	'label' => __('Box Margin', 'betterdocs'),
1571	'type' => Controls_Manager::DIMENSIONS,
1572	'size_units' => ['px', '%', 'em'],
1573	'selectors' => [
1574	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap:hover' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1575	]
1576	]
1577	);
1578
1579	$this->add_responsive_control(
1580	'listview_inner_boxes_padding_hover',
1581	[
1582	'label' => __('Box Padding', 'betterdocs'),
1583	'type' => Controls_Manager::DIMENSIONS,
1584	'size_units' => ['px', '%', 'em'],
1585	'selectors' => [
1586	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap:hover' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1587	]
1588	]
1589	);
1590
1591
1592	$this->add_group_control(
1593	Group_Control_Border::get_type(),
1594	[
1595	'name' => 'all_box_border_hover',
1596	'label' => __( 'All Boxes Border', 'betterdocs' ),
1597	'selector' => '{{WRAPPER}} .docs-single-cat-wrap:hover'
1598	]
1599	);
1600
1601	$this->add_control(
1602	'all_box_background_color_hover',
1603	[
1604	'label' => esc_html__('Color', 'betterdocs'),
1605	'type' => Controls_Manager::COLOR,
1606	'selectors' => [
1607	'{{WRAPPER}} .docs-single-cat-wrap:hover' => 'background-color: {{VALUE}};',
1608	]
1609	]
1610	);
1611
1612	$this->add_group_control(
1613	Group_Control_Box_Shadow::get_type(),
1614	[
1615	'name' => 'all_box_shadow_hover',
1616	'label' => __( 'Box Shadow Hover', 'betterdocs' ),
1617	'selector' => '{{WRAPPER}} .docs-single-cat-wrap:hover'
1618	]
1619	);
1620	$this->end_controls_tab();
1621	/ Hover State Tab End /
1622
1623	$this->end_controls_tabs();
1624	$this->end_controls_section();
1625
1626	}
1627
1628	public function icon_setting_style() {
1629	/**
1630	* ----------------------------------------------------------
1631	* Section: Icon Styles
1632	* ----------------------------------------------------------
1633	*/
1634	$this->start_controls_section(
1635	'cat_boxes_icon_style',
1636	[
1637	'label' => __('Category Icon', 'betterdocs'),
1638	'tab' => Controls_Manager::TAB_STYLE,
1639	'condition' => [
1640	'layout_template' => 'layout-3'
1641	]
1642	]
1643	);
1644
1645	$this->add_responsive_control(
1646	'cat_boxes_icon_height',
1647	[
1648	'label' => esc_html__('Height', 'betterdocs'),
1649	'type' => Controls_Manager::SLIDER,
1650	'size_units' => ['px', '%', 'em'],
1651	'range' => [
1652	'px' => [
1653	'max' => 500,
1654	],
1655	],
1656	'selectors' => [
1657	'{{WRAPPER}} .docs-single-cat-wrap img' => 'width: {{SIZE}}{{UNIT}}; height: auto;',
1658	]
1659	]
1660	);
1661
1662	$this->start_controls_tabs('cat_boxes_icon_tabs');
1663
1664	/ Normal State Tab Start /
1665	$this->start_controls_tab(
1666	'cat_boxes_icon_normal',
1667	['label' => esc_html__('Normal', 'betterdocs')]
1668	);
1669
1670	$this->add_control(
1671	'cat_boxes_icon_bc_heading',
1672	[
1673	'label' => __('Icon Background Color', 'betterdocs'),
1674	'type' => Controls_Manager::HEADING,
1675	'separator' => 'before'
1676	]
1677	);
1678
1679	$this->add_group_control(
1680	Group_Control_Background::get_type(),
1681	[
1682	'name' => 'box_icon_background_colors',
1683	'types' => [ 'classic', 'gradient'],
1684	'selector' => '{{WRAPPER}} .docs-single-cat-wrap img',
1685	'exclude' => [
1686	'image'
1687	]
1688	]
1689	);
1690
1691	$this->add_control(
1692	'cat_boxes_icon_border_heading',
1693	[
1694	'label' => __('Icon Border', 'betterdocs'),
1695	'type' => Controls_Manager::HEADING,
1696	'separator' => 'before'
1697	]
1698	);
1699
1700	$this->add_group_control(
1701	Group_Control_Border::get_type(),
1702	[
1703	'name' => 'cat_boxes_icon_border',
1704	'label' => __( 'Border', 'betterdocs' ),
1705	'selector' => '{{WRAPPER}} .docs-single-cat-wrap img'
1706	]
1707	);
1708
1709	$this->add_responsive_control(
1710	'icon_border_radius_normal_layout_3',
1711	[
1712	'label' => esc_html__('Icon Border Radius', 'betterdocs'),
1713	'type' => Controls_Manager::DIMENSIONS,
1714	'size_units' => ['px', 'em', '%'],
1715	'selectors' => [
1716	'{{WRAPPER}} .docs-single-cat-wrap img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1717	]
1718	]
1719	);
1720
1721	$this->end_controls_tab();
1722	/ Normal State Tab End /
1723
1724	/ Hover State Tab Start /
1725	$this->start_controls_tab(
1726	'cat_boxes_icon_hover',
1727	[
1728	'label' => esc_html__('Hover', 'betterdocs')
1729	]
1730	);
1731
1732	$this->add_control(
1733	'cat_boxes_icon_bc_hover_heading',
1734	[
1735	'label' => __('Icon Background Hover Color', 'betterdocs'),
1736	'type' => Controls_Manager::HEADING,
1737	'separator' => 'before'
1738	]
1739	);
1740
1741	$this->add_group_control(
1742	Group_Control_Background::get_type(),
1743	[
1744	'name' => 'box_icon_background_colors_hover',
1745	'types' => [ 'classic', 'gradient'],
1746	'selector' => '{{WRAPPER}} .docs-single-cat-wrap img:hover',
1747	'exclude' => [
1748	'image'
1749	]
1750	]
1751	);
1752
1753	$this->add_control(
1754	'cat_boxes_icon_border_heading_hover',
1755	[
1756	'label' => __('Icon Border Hover', 'betterdocs'),
1757	'type' => Controls_Manager::HEADING,
1758	'separator' => 'before'
1759	]
1760	);
1761
1762	$this->add_group_control(
1763	Group_Control_Border::get_type(),
1764	[
1765	'name' => 'cat_boxes_icon_border_hover',
1766	'label' => __( 'Border', 'betterdocs' ),
1767	'selector' => '{{WRAPPER}} .docs-single-cat-wrap img:hover'
1768	]
1769	);
1770
1771
1772	$this->add_responsive_control(
1773	'cat_boxes_icon_border_radius_hover',
1774	[
1775	'label' => esc_html__('Icon Border Radius', 'betterdocs'),
1776	'type' => Controls_Manager::DIMENSIONS,
1777	'size_units' => ['px', 'em', '%'],
1778	'selectors' => [
1779	'{{WRAPPER}} .docs-single-cat-wrap img:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1780	]
1781	]
1782	);
1783
1784	/ Hover State Tab End /
1785	$this->end_controls_tabs();
1786	$this->end_controls_section();
1787
1788	}
1789
1790	public function category_title_style() {
1791	/**
1792	* ----------------------------------------------------------
1793	* Section: Category Title Styles
1794	* ----------------------------------------------------------
1795	*/
1796	$this->start_controls_section(
1797	'cat_boxes_title_style',
1798	[
1799	'label' => __('Category Title', 'betterdocs'),
1800	'tab' => Controls_Manager::TAB_STYLE,
1801	'condition' => [
1802	'layout_template' => 'layout-3'
1803	]
1804	]
1805	);
1806
1807	$this->start_controls_tabs('cat_boxes_title_icon_tabs');
1808
1809	/ Normal State Tab Start /
1810	$this->start_controls_tab(
1811	'cat_boxes_title_icon_normal',
1812	[
1813	'label' => esc_html__('Normal', 'betterdocs')
1814	]
1815	);
1816
1817	$this->add_control(
1818	'cat_boxes_title_color',
1819	[
1820	'label' => esc_html__('Category Title Color', 'betterdocs'),
1821	'type' => Controls_Manager::COLOR,
1822	'selectors' => [
1823	'{{WRAPPER}} .title-count .docs-cat-title' => 'color: {{VALUE}};',
1824	]
1825	]
1826	);
1827
1828	$this->add_group_control(
1829	Group_Control_Typography::get_type(),
1830	[
1831	'name' => 'cat_boxes_title_typo_normal',
1832	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .title-count .docs-cat-title'
1833	]
1834	);
1835
1836	$this->add_responsive_control(
1837	'cat_boxes_title_spacing_normal',
1838	[
1839	'label' => __('Title Spacing', 'betterdocs'),
1840	'type' => Controls_Manager::DIMENSIONS,
1841	'size_units' => ['px', '%', 'em'],
1842	'selectors' => [
1843	'{{WRAPPER}} .betterdocs-categories-wrap .title-count' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1844	]
1845	]
1846	);
1847
1848	$this->end_controls_tab();
1849	/ Normal State Tab End /
1850
1851	/ Hover State Tab Start /
1852	$this->start_controls_tab(
1853	'cat_boxes_title_icon_hover',
1854	[
1855	'label' => esc_html__('Hover', 'betterdocs')
1856	]
1857	);
1858
1859	$this->add_control(
1860	'cat_boxes_title_color_hover',
1861	[
1862	'label' => esc_html__('Category Title Hover Color', 'betterdocs'),
1863	'type' => Controls_Manager::COLOR,
1864	'selectors' => [
1865	'{{WRAPPER}} .title-count .docs-cat-title:hover' => 'color: {{VALUE}};',
1866	]
1867	]
1868	);
1869
1870	$this->add_group_control(
1871	Group_Control_Typography::get_type(),
1872	[
1873	'name' => 'cat_boxes_title_typo_normal_hover',
1874	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .title-count .docs-cat-title:hover'
1875	]
1876	);
1877
1878	$this->add_responsive_control(
1879	'cat_boxes_title_spacing_hover',
1880	[
1881	'label' => __('Title Spacing Hover', 'betterdocs'),
1882	'type' => Controls_Manager::DIMENSIONS,
1883	'size_units' => ['px', '%', 'em'],
1884	'selectors' => [
1885	'{{WRAPPER}} .betterdocs-categories-wrap .title-count:hover' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1886	]
1887	]
1888	);
1889
1890
1891	$this->end_controls_tab();
1892	/ Hover State Tab End /
1893
1894	$this->end_controls_tabs();
1895	$this->end_controls_section();
1896	}
1897
1898	public function category_article_count(){
1899	/**
1900	* ----------------------------------------------------------
1901	* Section: Category Articles Styles
1902	* ----------------------------------------------------------
1903	*/
1904	$this->start_controls_section(
1905	'cat_boxes_articles_style',
1906	[
1907	'label' => __('Category Article', 'betterdocs'),
1908	'tab' => Controls_Manager::TAB_STYLE,
1909	'condition' => [
1910	'layout_template' => 'layout-3'
1911	]
1912	]
1913	);
1914
1915	$this->start_controls_tabs('cat_articles_tabs');
1916
1917	/ Normal State Tab Start /
1918	$this->start_controls_tab(
1919	'cat_articles_normal',
1920	[
1921	'label' => esc_html__('Normal', 'betterdocs')
1922	]
1923	);
1924
1925	$this->add_control(
1926	'cat_boxes_articles_color',
1927	[
1928	'label' => esc_html__('Category Article Color', 'betterdocs'),
1929	'type' => Controls_Manager::COLOR,
1930	'selectors' => [
1931	'{{WRAPPER}} .betterdocs-categories-wrap .title-count span' => 'color: {{VALUE}};',
1932	]
1933	]
1934	);
1935
1936	$this->add_group_control(
1937	Group_Control_Typography::get_type(),
1938	[
1939	'name' => 'cat_boxex_articles_typo_normal',
1940	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .title-count span'
1941	]
1942	);
1943
1944	$this->add_control(
1945	'cat_boxex_articles_show_desc_color_normal',
1946	[
1947	'label' => esc_html__('Description Color', 'betterdocs'),
1948	'type' => Controls_Manager::COLOR,
1949	'selectors' => [
1950	'{{WRAPPER}} .betterdocs-categories-wrap .title-count .cat-description' => 'color: {{VALUE}};',
1951	]
1952	]
1953	);
1954
1955	$this->add_group_control(
1956	Group_Control_Typography::get_type(),
1957	[
1958	'name' => 'cat_boxex_articles_show_desc_typo_normal',
1959	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .title-count .cat-description',
1960	]
1961	);
1962
1963	$this->end_controls_tab();
1964	/ Normal State Tab End /
1965
1966	/ Hover State Tab Start /
1967	$this->start_controls_tab(
1968	'cat_articles_hover',
1969	[
1970	'label' => esc_html__('Hover', 'betterdocs')
1971	]
1972	);
1973
1974	$this->add_control(
1975	'cat_boxes_articles_color_hover',
1976	[
1977	'label' => esc_html__('Category Article Hover Color', 'betterdocs'),
1978	'type' => Controls_Manager::COLOR,
1979	'selectors' => [
1980	'{{WRAPPER}} .betterdocs-categories-wrap .title-count span:hover' => 'color: {{VALUE}};',
1981	]
1982	]
1983	);
1984
1985	$this->add_group_control(
1986	Group_Control_Typography::get_type(),
1987	[
1988	'name' => 'cat_boxex_articles_typo_hover',
1989	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .title-count span:hover'
1990	]
1991	);
1992
1993	$this->add_control(
1994	'cat_boxex_articles_show_desc_color_hover',
1995	[
1996	'label' => esc_html__('Description Color', 'betterdocs'),
1997	'type' => Controls_Manager::COLOR,
1998	'selectors' => [
1999	'{{WRAPPER}} .betterdocs-categories-wrap .title-count .cat-description:hover' => 'color: {{VALUE}};',
2000	]
2001	]
2002	);
2003
2004	$this->add_group_control(
2005	Group_Control_Typography::get_type(),
2006	[
2007	'name' => 'cat_boxex_articles_show_desc_typo_hover',
2008	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .title-count .cat-description:hover'
2009	]
2010	);
2011
2012	$this->end_controls_tab();
2013	/ Hover State Tab End /
2014
2015	$this->end_controls_tabs();
2016	$this->end_controls_section();
2017	}
2018	}
2019