betterdocs / includes / elementor / widgets / betterdocs-elementor-sidebar.php

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

1,549 lines 54.1 KB

Raw Download Zip

1	<?php
2
3	use Elementor\Controls_Manager;
4	use Elementor\Group_Control_Background;
5	use Elementor\Group_Control_Border as Group_Control_Border;
6	use Elementor\Group_Control_Box_Shadow as Group_Control_Box_Shadow;
7	use Elementor\Group_Control_Typography;
8	use Elementor\Widget_Base;
9
10	if (!defined('ABSPATH')) {
11	exit; // Exit if accessed directly
12	}
13
14	class BetterDocs_Elementor_Sidebar extends Widget_Base
15	{
16
17	public function get_name()
18	{
19	return 'betterdocs-sidebar';
20	}
21
22	public function get_title()
23	{
24	return __('Doc Sidebar', 'betterdocs');
25	}
26
27	public function get_icon()
28	{
29	return 'betterdocs-icon-Sidebar';
30	}
31
32	public function get_categories()
33	{
34	return ['betterdocs-elements', 'docs-archive'];
35	}
36
37	public function get_keywords()
38	{
39	return ['betterdocs-elements', 'sidebar', 'betterdocs', 'docs'];
40	}
41
42	public function get_custom_help_url()
43	{
44	return 'https://betterdocs.co/docs/single-doc-in-elementor';
45	}
46
47	protected function _register_controls()
48	{
49	do_action('betterdocs_elementor_sidebar_layout_select', $this);
50
51	$this->sidebar_layout_select();
52
53	if (!is_plugin_active('betterdocs-pro/betterdocs-pro.php')) {
54	$this->start_controls_section(
55	'betterdocs_section_pro',
56	[
57	'label' => __('Go Premium for More Features', 'betterdocs'),
58	]
59	);
60
61	$this->add_control(
62	'betterdocs_control_get_pro',
63	[
64	'label' => __('Unlock more possibilities', 'betterdocs'),
65	'type' => Controls_Manager::CHOOSE,
66	'options' => [
67	'1' => [
68	'title' => '',
69	'icon' => 'fa fa-unlock-alt',
70	],
71	],
72	'default' => '1',
73	'description' => '<span class="pro-feature"> Get the <a href="https://betterdocs.co/upgrade" target="_blank">Pro version</a> for more stunning layouts and customization options.</span>',
74	]
75	);
76
77	$this->end_controls_section();
78	}
79
80	$this->box_setting_style();
81
82	$this->icon_style();
83
84	$this->title_style();
85
86	$this->count_style();
87
88	$this->list_setting();
89
90	$this->sub_list_setting();
91
92	$this->sticky_toc();
93	}
94
95	public function sidebar_layout_select()
96	{
97	/**
98	* ----------------------------------------------------------
99	* Section: Select Layout
100	* ----------------------------------------------------------
101	*/
102	$this->start_controls_section(
103	'section_layout_settings',
104	[
105	'label' => __('Layout', 'betterdocs')
106	]
107	);
108
109	$this->add_control(
110	'betterdocs_sidebar_layout',
111	[
112	'label' => esc_html__('Select layout', 'betterdocs'),
113	'type' => Controls_Manager::SELECT,
114	'default' => 'layout-1',
115	'label_block' => false,
116	'options' => [
117	'layout-1' => esc_html__('Layout 1', 'betterdocs'),
118	'layout-2' => esc_html__('Layout 2', 'betterdocs'),
119	'layout-3' => esc_html__('Layout 3', 'betterdocs'),
120	'layout-4' => esc_html__('Layout 4', 'betterdocs')
121	],
122	]
123	);
124
125	if (!is_plugin_active('betterdocs-pro/betterdocs-pro.php')) {
126	$this->add_control(
127	'betterdocs_sidebar_layout_warning_text',
128	[
129	'type' => Controls_Manager::RAW_HTML,
130	'raw' => __('This layout is available in pro version only!', 'betterdocs'),
131	'content_classes' => 'betterdocs-ea-warning',
132	'condition' => [
133	'betterdocs_sidebar_layout' => ['layout-2', 'layout-3'],
134	],
135	]
136	);
137	}
138
139	$this->add_control(
140	'category_title_tag',
141	[
142	'label' => __('Category Title Tag', 'betterdocs'),
143	'type' => Controls_Manager::SELECT,
144	'default' => 'h2',
145	'options' => [
146	'h1' => __('H1', 'betterdocs'),
147	'h2' => __('H2', 'betterdocs'),
148	'h3' => __('H3', 'betterdocs'),
149	'h4' => __('H4', 'betterdocs'),
150	'h5' => __('H5', 'betterdocs'),
151	'h6' => __('H6', 'betterdocs'),
152	]
153	]
154	);
155
156	$this->end_controls_section(); # end of 'Select Layout'
157
158	}
159
160	public function sticky_toc()
161	{
162	/**
163	* ----------------------------------------------------------
164	* Section: Box Styles
165	* ----------------------------------------------------------
166	*/
167	$this->start_controls_section(
168	'section_sticky_toc',
169	[
170	'label' => __('Sticky TOC', 'betterdocs'),
171	'tab' => Controls_Manager::TAB_STYLE,
172	]
173	);
174
175	$this->add_control(
176	'enable_sticky_toc',
177	[
178	'label' => __('Enable Sticky TOC', 'betterdocs'),
179	'type' => Controls_Manager::SWITCHER,
180	'label_on' => __('Show', 'betterdocs'),
181	'label_off' => __('Hide', 'betterdocs'),
182	'return_value' => '1',
183	'default' => '',
184	]
185	);
186
187	$this->add_responsive_control(
188	'toc_width',
189	[
190	'label' => __('TOC Width', 'betterdocs'),
191	'type' => Controls_Manager::SLIDER,
192	'size_units' => ['px', '%', 'em'],
193	'range' => [
194	'px' => [
195	'max' => 1000,
196	'step' => 1,
197	],
198	'%' => [
199	'max' => 100,
200	'step' => 1,
201	],
202	],
203	'selectors' => [
204	'{{WRAPPER}} .sticky-toc-container .betterdocs-toc' => 'width: {{SIZE}}{{UNIT}};'
205	],
206	]
207	);
208
209	$this->add_responsive_control(
210	'toc_zindex', // Legacy control id but new control
211	[
212	'label' => __('Z index', 'betterdocs'),
213	'type' => Controls_Manager::NUMBER,
214	'min' => 0,
215	'max' => 1000,
216	'step' => 5,
217	'default' => 320,
218	'selectors' => [
219	'{{WRAPPER}} .sticky-toc-container .betterdocs-toc' => 'z-index: {{VALUE}}%;',
220	]
221	]
222	);
223
224	$this->end_controls_section(); # end of 'Card Settings'
225	}
226
227	public function box_setting_style()
228	{
229	/**
230	* ----------------------------------------------------------
231	* Section: Box Styles
232	* ----------------------------------------------------------
233	*/
234	$this->start_controls_section(
235	'section_card_settings',
236	[
237	'label' => __('Box', 'betterdocs'),
238	'tab' => Controls_Manager::TAB_STYLE,
239	]
240	);
241
242	$this->add_responsive_control(
243	'column_space', // Legacy control id but new control
244	[
245	'label' => __('Box Spacing', 'betterdocs'),
246	'type' => Controls_Manager::DIMENSIONS,
247	'size_units' => ['px', '%', 'em'],
248	'selectors' => [
249	'{{WRAPPER}} .betterdocs-categories-wrap' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
250	]
251	]
252	);
253
254	$this->add_responsive_control(
255	'column_padding',
256	[
257	'label' => __('Box Padding', 'betterdocs'),
258	'type' => Controls_Manager::DIMENSIONS,
259	'size_units' => ['px', 'em', '%'],
260	'selectors' => [
261	'{{WRAPPER}} .betterdocs-categories-wrap' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
262	],
263	]
264	);
265	$this->add_control(
266	'column_height',
267	[
268	'label' => __( 'Height', 'plugin-domain' ),
269	'type' => Controls_Manager::SLIDER,
270	'size_units' => [ 'px', '%' ],
271	'range' => [
272	'px' => [
273	'min' => 0,
274	'max' => 1000,
275	'step' => 5,
276	],
277	'%' => [
278	'min' => 0,
279	'max' => 100,
280	],
281	],
282	'selectors' => [
283	'{{WRAPPER}} .betterdocs-categories-wrap' => 'height: {{SIZE}}{{UNIT}};',
284	],
285	]
286	);
287
288
289	$this->add_responsive_control(
290	'box_seperator_color',
291	[
292	'label' => esc_html__('Separator Color', 'betterdocs'),
293	'type' => Controls_Manager::COLOR,
294	'selectors' => [
295	'{{WRAPPER}} .betterdocs-categories-wrap' => 'background-color: {{VALUE}};'
296	],
297	]
298	);
299
300	$this->start_controls_tabs('card_settings_tabs');
301
302	// Normal State Tab
303	$this->start_controls_tab(
304	'card_normal',
305	['label' => esc_html__('Normal', 'betterdocs')]
306	);
307
308	$this->add_control(
309	'box_section_header',
310	[
311	'label' => __('Header', 'betterdocs'),
312	'type' => Controls_Manager::HEADING,
313	'separator' => 'before',
314	]
315	);
316
317	$this->add_group_control(
318	Group_Control_Background::get_type(),
319	[
320	'name' => 'card_bg_normal_header',
321	'types' => ['classic', 'gradient'],
322	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-title-wrap, .docs-single-cat-wrap-2 .docs-cat-title-inner'
323	]
324	);
325
326	$this->add_control(
327	'box_section_body',
328	[
329	'label' => __('Body', 'betterdocs'),
330	'type' => Controls_Manager::HEADING,
331	'separator' => 'before',
332	]
333	);
334
335	$this->add_group_control(
336	Group_Control_Background::get_type(),
337	[
338	'name' => 'card_bg_normal',
339	'types' => ['classic', 'gradient'],
340	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-item-container, .docs-single-cat-wrap-2 .docs-item-container'
341	]
342	);
343
344	$this->add_group_control(
345	Group_Control_Border::get_type(),
346	[
347	'name' => 'card_border_normal',
348	'label' => esc_html__('Border', 'betterdocs'),
349	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap'
350	]
351	);
352
353	$this->add_responsive_control(
354	'card_border_radius_normal',
355	[
356	'label' => esc_html__('Border Radius', 'betterdocs'),
357	'type' => Controls_Manager::DIMENSIONS,
358	'size_units' => ['px', 'em', '%'],
359	'selectors' => [
360	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-item-container' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
361	],
362	]
363	);
364
365	$this->add_group_control(
366	Group_Control_Box_Shadow::get_type(),
367	[
368	'name' => 'card_box_shadow_normal',
369	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap'
370	]
371	);
372
373	$this->end_controls_tab();
374
375	// Hover State Tab
376	$this->start_controls_tab(
377	'card_hover',
378	['label' => esc_html__('Hover', 'betterdocs')]
379	);
380
381	$this->add_control(
382	'card_transition',
383	[
384	'label' => __('Transition', 'betterdocs'),
385	'type' => Controls_Manager::SLIDER,
386	'default' => [
387	'size' => 300,
388	'unit' => '%',
389	],
390	'size_units' => ['%'],
391	'range' => [
392	'%' => [
393	'max' => 2500,
394	'step' => 1,
395	],
396	],
397	'selectors' => [
398	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap' => 'transition: {{SIZE}}ms;',
399	],
400	]
401	);
402
403	$this->add_control(
404	'box_section_header_hover',
405	[
406	'label' => __('Header', 'betterdocs'),
407	'type' => Controls_Manager::HEADING,
408	'separator' => 'before',
409	]
410	);
411
412	$this->add_group_control(
413	Group_Control_Background::get_type(),
414	[
415	'name' => 'card_bg_hover_header',
416	'types' => ['classic', 'gradient'],
417	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap:hover .docs-cat-title-wrap, .docs-single-cat-wrap-2:hover .docs-cat-title-inner'
418	]
419	);
420
421	$this->add_control(
422	'box_section_body_hover',
423	[
424	'label' => __('Body', 'betterdocs'),
425	'type' => Controls_Manager::HEADING,
426	'separator' => 'before',
427	]
428	);
429
430	$this->add_group_control(
431	Group_Control_Background::get_type(),
432	[
433	'name' => 'card_bg_hover',
434	'types' => ['classic', 'gradient'],
435	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap:hover .docs-item-container'
436	]
437	);
438
439	$this->add_group_control(
440	Group_Control_Border::get_type(),
441	[
442	'name' => 'card_border_hover',
443	'label' => esc_html__('Border', 'betterdocs'),
444	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap:hover'
445	]
446	);
447
448	$this->add_responsive_control(
449	'card_border_radius_hover',
450	[
451	'label' => esc_html__('Border Radius', 'betterdocs'),
452	'type' => Controls_Manager::DIMENSIONS,
453	'size_units' => ['px', 'em', '%'],
454	'selectors' => [
455	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
456	],
457	]
458	);
459
460	$this->add_group_control(
461	Group_Control_Box_Shadow::get_type(),
462	[
463	'name' => 'card_box_shadow_hover',
464	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap:hover'
465	]
466	);
467
468	$this->end_controls_tab();
469
470	$this->end_controls_tabs();
471	$this->end_controls_section(); # end of 'Card Settings'
472	}
473
474	public function icon_style()
475	{
476	/**
477	* ----------------------------------------------------------
478	* Section: Icon Styles
479	* ----------------------------------------------------------
480	*/
481	$this->start_controls_section(
482	'section_box_icon_style',
483	[
484	'label' => __('Icon', 'betterdocs'),
485	'tab' => Controls_Manager::TAB_STYLE,
486	]
487	);
488
489	$this->add_responsive_control(
490	'category_settings_icon_size_normal',
491	[
492	'label' => esc_html__('Size', 'betterdocs'),
493	'type' => Controls_Manager::SLIDER,
494	'size_units' => ['px', '%', 'em'],
495	'range' => [
496	'px' => [
497	'max' => 500,
498	],
499	],
500	'selectors' => [
501	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap img' => 'width: {{SIZE}}{{UNIT}}; height: auto;',
502	],
503	]
504	);
505
506	$this->add_responsive_control(
507	'category_settings_arrow_width_normal',
508	[
509	'label' => esc_html__('Arrow Width', 'betterdocs'),
510	'type' => Controls_Manager::SLIDER,
511	'size_units' => ['px', '%', 'em'],
512	'range' => [
513	'px' => [
514	'max' => 500,
515	],
516	],
517	'selectors' => [
518	'{{WRAPPER}} .betterdocs-single-layout4 .betterdocs-full-sidebar-left .cat-list-arrow-down' => 'width: {{SIZE}}{{UNIT}};',
519	],
520	]
521	);
522
523	$this->add_responsive_control(
524	'category_settings_arrow_height_normal',
525	[
526	'label' => esc_html__('Arrow Height', 'betterdocs'),
527	'type' => Controls_Manager::SLIDER,
528	'size_units' => ['px', '%', 'em'],
529	'range' => [
530	'px' => [
531	'max' => 500,
532	],
533	],
534	'selectors' => [
535	'{{WRAPPER}} .betterdocs-single-layout4 .betterdocs-full-sidebar-left .cat-list-arrow-down' => 'height: {{SIZE}}{{UNIT}};',
536	],
537	]
538	);
539
540	$this->start_controls_tabs('box_icon_styles_tab');
541
542	// Normal State Tab
543	$this->start_controls_tab(
544	'icon_normal',
545	['label' => esc_html__('Normal', 'betterdocs')]
546	);
547
548	$this->add_control(
549	'arrow_color',
550	[
551	'label' => __( 'Arrow Color', 'plugin-domain' ),
552	'type' => Controls_Manager::COLOR,
553	'selectors' => [
554	'{{WRAPPER}} .betterdocs-single-layout4 .betterdocs-full-sidebar-left .cat-list-arrow-down' => 'color: {{VALUE}}',
555	],
556	]
557	);
558
559	$this->add_group_control(
560	Group_Control_Background::get_type(),
561	[
562	'name' => 'icon_background_normal',
563	'types' => ['classic', 'gradient'],
564	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-icon',
565	'exclude' => [
566	'image'
567	]
568	]
569	);
570
571	$this->add_group_control(
572	Group_Control_Border::get_type(),
573	[
574	'name' => 'icon_border_normal',
575	'label' => esc_html__('Border', 'betterdocs'),
576	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-icon'
577	]
578	);
579
580	$this->add_responsive_control(
581	'icon_border_radius_normal',
582	[
583	'label' => esc_html__('Border Radius', 'betterdocs'),
584	'type' => Controls_Manager::DIMENSIONS,
585	'size_units' => ['px', 'em', '%'],
586	'selectors' => [
587	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-icon' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
588	]
589	]
590	);
591
592	$this->add_responsive_control(
593	'icon_padding',
594	[
595	'label' => esc_html__('Padding', 'betterdocs'),
596	'type' => Controls_Manager::DIMENSIONS,
597	'size_units' => ['px', 'em', '%'],
598	'selectors' => [
599	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-icon' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
600	],
601	]
602	);
603
604	$this->add_responsive_control(
605	'icon_spacing',
606	[
607	'label' => esc_html__('Spacing', 'betterdocs'),
608	'type' => Controls_Manager::DIMENSIONS,
609	'size_units' => ['px', 'em', '%'],
610	'allowed_dimensions' => [
611	'top',
612	'bottom'
613	],
614	'selectors' => [
615	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-icon' => 'margin: {{TOP}}{{UNIT}} auto {{BOTTOM}}{{UNIT}} auto;'
616	]
617	]
618	);
619
620
621	$this->add_responsive_control(
622	'arrow_padding_normal',
623	[
624	'label' => esc_html__('Arrow Padding', 'betterdocs'),
625	'type' => Controls_Manager::DIMENSIONS,
626	'size_units' => ['px', 'em', '%'],
627	'selectors' => [
628	'{{WRAPPER}} .betterdocs-single-layout4 .betterdocs-full-sidebar-left .cat-list-arrow-down' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
629	]
630	]
631	);
632
633	$this->add_responsive_control(
634	'arrow_margin_normal',
635	[
636	'label' => esc_html__('Arrow Margin', 'betterdocs'),
637	'type' => Controls_Manager::DIMENSIONS,
638	'size_units' => ['px', 'em', '%'],
639	'selectors' => [
640	'{{WRAPPER}} .betterdocs-single-layout4 .betterdocs-full-sidebar-left .cat-list-arrow-down' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
641	]
642	]
643	);
644
645	$this->end_controls_tab();
646
647	// Hover State Tab
648	$this->start_controls_tab(
649	'icon_hover',
650	['label' => esc_html__('Hover', 'betterdocs')]
651	);
652
653	$this->add_control(
654	'arrow_color_hover',
655	[
656	'label' => __( 'Arrow Color', 'plugin-domain' ),
657	'type' => Controls_Manager::COLOR,
658	'selectors' => [
659	'{{WRAPPER}} .betterdocs-single-layout4 .betterdocs-full-sidebar-left .cat-list-arrow-down:hover' => 'color: {{VALUE}}',
660	],
661	]
662	);
663
664	$this->add_group_control(
665	Group_Control_Background::get_type(),
666	[
667	'name' => 'icon_background_hover',
668	'types' => ['classic', 'gradient'],
669	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-icon:hover'
670	]
671	);
672
673	$this->add_group_control(
674	Group_Control_Border::get_type(),
675	[
676	'name' => 'icon_border_hover',
677	'label' => esc_html__('Border', 'betterdocs'),
678	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-icon:hover'
679	]
680	);
681
682	$this->add_responsive_control(
683	'icon_border_radius_hover',
684	[
685	'label' => esc_html__('Border Radius', 'betterdocs'),
686	'type' => Controls_Manager::DIMENSIONS,
687	'size_units' => ['px', 'em', '%'],
688	'selectors' => [
689	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-icon:hover:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
690	],
691
692	]
693	);
694
695	$this->add_responsive_control(
696	'arrow_padding_hover',
697	[
698	'label' => esc_html__('Arrow Padding', 'betterdocs'),
699	'type' => Controls_Manager::DIMENSIONS,
700	'size_units' => ['px', 'em', '%'],
701	'selectors' => [
702	'{{WRAPPER}} .betterdocs-single-layout4 .betterdocs-full-sidebar-left .cat-list-arrow-down:hover' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
703	]
704	]
705	);
706
707	$this->add_responsive_control(
708	'arrow_margin_hover',
709	[
710	'label' => esc_html__('Arrow Margin', 'betterdocs'),
711	'type' => Controls_Manager::DIMENSIONS,
712	'size_units' => ['px', 'em', '%'],
713	'selectors' => [
714	'{{WRAPPER}} .betterdocs-single-layout4 .betterdocs-full-sidebar-left .cat-list-arrow-down:hover' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
715	]
716	]
717	);
718
719
720	$this->add_control(
721	'category_settings_icon_size_transition',
722	[
723	'label' => __('Transition', 'betterdocs'),
724	'type' => Controls_Manager::SLIDER,
725	'default' => [
726	'size' => 300,
727	'unit' => '%',
728	],
729	'size_units' => ['%'],
730	'range' => [
731	'%' => [
732	'max' => 2500,
733	'step' => 1,
734	],
735	],
736	'selectors' => [
737	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-icon:hover' => 'transition: {{SIZE}}ms;'
738	],
739	]
740	);
741
742	$this->end_controls_tab();
743
744	$this->end_controls_tabs();
745
746	$this->end_controls_section(); # end of 'Icon Styles'
747	}
748
749
750	public function title_style()
751	{
752	/**
753	* ----------------------------------------------------------
754	* Section: Title Styles
755	* ----------------------------------------------------------
756	*/
757	$this->start_controls_section(
758	'section_box_title_styles',
759	[
760	'label' => __('Title', 'betterdocs'),
761	'tab' => Controls_Manager::TAB_STYLE,
762	]
763	);
764
765	$this->start_controls_tabs('box_title_styles_tab');
766
767	// Normal State Tab
768	$this->start_controls_tab(
769	'title_normal',
770	['label' => esc_html__('Normal', 'betterdocs')]
771	);
772
773	$this->add_control(
774	'cat_title_color_normal',
775	[
776	'label' => esc_html__('Color', 'betterdocs'),
777	'type' => Controls_Manager::COLOR,
778	'selectors' => [
779	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-title .docs-cat-heading, .docs-single-cat-wrap-2 .docs-cat-title-inner .docs-cat-heading' => 'color: {{VALUE}};',
780	],
781	]
782	);
783
784	$this->add_group_control(
785	Group_Control_Typography::get_type(),
786	[
787	'name' => 'cat_title_typography_normal',
788	'selector' => '{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-title .docs-cat-heading, .docs-single-cat-wrap-2 .docs-cat-title-inner .docs-cat-heading'
789	]
790	);
791
792	$this->add_responsive_control(
793	'title_spacing',
794	[
795	'label' => __('Spacing', 'betterdocs'),
796	'type' => Controls_Manager::DIMENSIONS,
797	'size_units' => ['px', '%', 'em'],
798	'selectors' => [
799	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-title .docs-cat-heading, .docs-single-cat-wrap-2 .docs-cat-title-inner .docs-cat-heading' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
800	]
801	]
802	);
803
804	$this->add_responsive_control(
805	'title_padding',
806	[
807	'label' => __('Padding', 'betterdocs'),
808	'type' => Controls_Manager::DIMENSIONS,
809	'size_units' => ['px', '%', 'em'],
810	'selectors' => [
811	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-title .docs-cat-heading, .docs-single-cat-wrap-2 .docs-cat-title-inner .docs-cat-heading' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
812	]
813	]
814	);
815
816	$this->end_controls_tab();
817
818	// Hover State Tab
819	$this->start_controls_tab(
820	'title_hover',
821	['label' => esc_html__('Hover', 'betterdocs')]
822	);
823
824	$this->add_control(
825	'cat_title_color_hover',
826	[
827	'label' => esc_html__('Color', 'betterdocs'),
828	'type' => Controls_Manager::COLOR,
829	'selectors' => [
830	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap:hover .docs-cat-title .docs-cat-heading, .docs-single-cat-wrap-2 .docs-cat-title-inner .docs-cat-heading' => 'color: {{VALUE}};'
831	],
832	]
833	);
834
835	$this->add_control(
836	'category_title_transition',
837	[
838	'label' => __('Transition', 'betterdocs'),
839	'type' => Controls_Manager::SLIDER,
840	'default' => [
841	'size' => 300,
842	'unit' => '%',
843	],
844	'size_units' => ['%'],
845	'range' => [
846	'%' => [
847	'max' => 2500,
848	'step' => 1,
849	],
850	],
851	'selectors' => [
852	'{{WRAPPER}} .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-title .docs-cat-heading, .docs-single-cat-wrap-2 .docs-cat-title-inner .docs-cat-heading' => 'transition: {{SIZE}}ms;',
853	],
854	]
855	);
856
857	$this->end_controls_tab();
858
859	$this->end_controls_tabs();
860
861	$this->end_controls_section(); # end of 'Icon Styles'
862	}
863
864	public function count_style()
865	{
866	/**
867	* ----------------------------------------------------------
868	* Section: Count Styles
869	* ----------------------------------------------------------
870	*/
871	$this->start_controls_section(
872	'section_box_count_styles',
873	[
874	'label' => __('Count', 'betterdocs'),
875	'tab' => Controls_Manager::TAB_STYLE,
876	]
877	);
878
879	$this->add_group_control(
880	Group_Control_Typography::get_type(),
881	[
882	'name' => 'count_typography_normal',
883	'selector' => '{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count span'
884	]
885	);
886
887	$this->start_controls_tabs('box_count_styles_tab');
888
889	// Normal State Tab
890	$this->start_controls_tab(
891	'count_normal',
892	['label' => esc_html__('Normal', 'betterdocs')]
893	);
894
895	$this->add_control(
896	'count_color_normal',
897	[
898	'label' => esc_html__('Color', 'betterdocs'),
899	'type' => Controls_Manager::COLOR,
900	'selectors' => [
901	'{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count span' => 'color: {{VALUE}};',
902	],
903	]
904	);
905
906	$this->add_group_control(
907	Group_Control_Background::get_type(),
908	[
909	'name' => 'count_box_bg',
910	'types' => ['classic', 'gradient'],
911	'selector' => '{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count',
912	]
913	);
914
915	$this->add_group_control(
916	Group_Control_Border::get_type(),
917	[
918	'name' => 'count_box_border',
919	'label' => esc_html__('Border', 'betterdocs'),
920	'selector' => '{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count',
921	]
922	);
923
924	$this->add_responsive_control(
925	'count_box_border_radius',
926	[
927	'label' => esc_html__('Border Radius', 'betterdocs'),
928	'type' => Controls_Manager::DIMENSIONS,
929	'size_units' => ['px', 'em', '%'],
930	'selectors' => [
931	'{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
932	]
933	]
934	);
935
936	$this->add_group_control(
937	Group_Control_Box_Shadow::get_type(),
938	[
939	'name' => 'count_box_box_shadow',
940	'selector' => '{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count',
941	]
942	);
943
944	$this->add_responsive_control(
945	'count_box_size',
946	[
947	'label' => esc_html__('Size', 'betterdocs'),
948	'type' => Controls_Manager::SLIDER,
949	'size_units' => ['px', '%', 'em'],
950	'range' => [
951	'px' => [
952	'max' => 500,
953	],
954	],
955	'selectors' => [
956	'{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count' => 'height: {{SIZE}}{{UNIT}}; width: {{SIZE}}{{UNIT}};'
957	]
958	]
959	);
960
961	$this->add_responsive_control(
962	'count_spacing',
963	[
964	'label' => __('Spacing', 'betterdocs'),
965	'type' => Controls_Manager::DIMENSIONS,
966	'size_units' => ['px', '%', 'em'],
967	'selectors' => [
968	'{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
969	]
970	]
971	);
972
973	$this->end_controls_tab();
974
975	// Hover State Tab
976	$this->start_controls_tab(
977	'count_hover',
978	['label' => esc_html__('Hover', 'betterdocs')]
979	);
980
981	$this->add_control(
982	'count_color_hover',
983	[
984	'label' => esc_html__('Color', 'betterdocs'),
985	'type' => Controls_Manager::COLOR,
986	'selectors' => [
987	'{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count:hover span' => 'color: {{VALUE}};',
988	],
989	]
990	);
991
992	$this->add_group_control(
993	Group_Control_Background::get_type(),
994	[
995	'name' => 'count_box_bg_hover',
996	'types' => ['classic', 'gradient'],
997	'selector' => '{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count:hover',
998
999	]
1000	);
1001
1002	$this->add_group_control(
1003	Group_Control_Border::get_type(),
1004	[
1005	'name' => 'count_box_border_hover',
1006	'label' => esc_html__('Border', 'betterdocs'),
1007	'selector' => '{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count:hover',
1008
1009	]
1010	);
1011
1012	$this->add_responsive_control(
1013	'count_box_border_radius_hover',
1014	[
1015	'label' => esc_html__('Border Radius', 'betterdocs'),
1016	'type' => Controls_Manager::DIMENSIONS,
1017	'size_units' => ['px', 'em', '%'],
1018	'selectors' => [
1019	'{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1020	],
1021
1022	]
1023	);
1024
1025	$this->add_group_control(
1026	Group_Control_Box_Shadow::get_type(),
1027	[
1028	'name' => 'count_box_box_shadow_hover',
1029	'selector' => '{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count:hover',
1030	]
1031	);
1032
1033	$this->add_control(
1034	'category_count_transition',
1035	[
1036	'label' => __('Transition', 'betterdocs'),
1037	'type' => Controls_Manager::SLIDER,
1038	'default' => [
1039	'size' => 300,
1040	'unit' => '%',
1041	],
1042	'size_units' => ['%'],
1043	'range' => [
1044	'%' => [
1045	'max' => 2500,
1046	'step' => 1,
1047	],
1048	],
1049	'selectors' => [
1050	'{{WRAPPER}} .docs-single-cat-wrap .docs-cat-title-wrap .docs-item-count:hover' => 'transition: {{SIZE}}ms;',
1051
1052	],
1053	]
1054	);
1055
1056	$this->end_controls_tab();
1057
1058	$this->end_controls_tabs();
1059
1060	$this->end_controls_section(); # end of 'Count Styles'
1061	}
1062
1063	public function list_setting()
1064	{
1065	/**
1066	* ----------------------------------------------------------
1067	* Section: List Settinggs
1068	* ----------------------------------------------------------
1069	*/
1070	$this->start_controls_section(
1071	'section_article_settings',
1072	[
1073	'label' => __('Category List', 'betterdocs'),
1074	'tab' => Controls_Manager::TAB_STYLE
1075	]
1076	);
1077
1078
1079	$this->add_group_control(
1080	Group_Control_Typography::get_type(),
1081	[
1082	'name' => 'list_item_typography',
1083	'selector' => '{{WRAPPER}} .docs-item-container ul li a',
1084	]
1085	);
1086
1087	$this->add_control(
1088	'list_color',
1089	[
1090	'label' => esc_html__('Color', 'betterdocs'),
1091	'type' => Controls_Manager::COLOR,
1092	'selectors' => [
1093	'{{WRAPPER}} .docs-item-container ul li a' => 'color: {{VALUE}};',
1094	],
1095	]
1096	);
1097
1098	$this->add_control(
1099	'list_hover_color',
1100	[
1101	'label' => esc_html__('Hover Color', 'betterdocs'),
1102	'type' => Controls_Manager::COLOR,
1103	'selectors' => [
1104	'{{WRAPPER}} .docs-item-container ul li a:hover' => 'color: {{VALUE}};',
1105	],
1106	]
1107	);
1108
1109	$this->add_responsive_control(
1110	'list_margin',
1111	[
1112	'label' => esc_html__('List Item Spacing', 'betterdocs'),
1113	'type' => Controls_Manager::DIMENSIONS,
1114	'size_units' => ['px', 'em', '%'],
1115	'selectors' => [
1116	'{{WRAPPER}} .docs-item-container ul li' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1117	],
1118	]
1119	);
1120
1121
1122	$this->add_responsive_control(
1123	'list_area_padding',
1124	[
1125	'label' => esc_html__('List Area Padding', 'betterdocs'),
1126	'type' => Controls_Manager::DIMENSIONS,
1127	'allowed_dimensions' => 'vertical',
1128	'size_units' => ['px', 'em', '%'],
1129	'selectors' => [
1130	'{{WRAPPER}} .docs-item-container' => 'padding-top: {{TOP}}{{UNIT}}; padding-bottom: {{BOTTOM}}{{UNIT}};',
1131	],
1132	]
1133	);
1134
1135	$this->add_control(
1136	'icon_settings_heading',
1137	[
1138	'label' => esc_html__('Icon', 'betterdocs'),
1139	'type' => Controls_Manager::HEADING,
1140	'separator' => 'before',
1141	]
1142	);
1143
1144
1145	$this->add_control(
1146	'list_icon_color',
1147	[
1148	'label' => esc_html__('Color', 'betterdocs'),
1149	'type' => Controls_Manager::COLOR,
1150	'selectors' => [
1151	'{{WRAPPER}} .docs-item-container li svg' => 'fill: {{VALUE}};',
1152	],
1153	]
1154	);
1155
1156	$this->add_responsive_control(
1157	'list_icon_size',
1158	[
1159	'label' => __('Size', 'betterdocs'),
1160	'type' => Controls_Manager::SLIDER,
1161	'size_units' => ['px', '%', 'em'],
1162	'range' => [
1163	'%' => [
1164	'max' => 100,
1165	'step' => 1,
1166	],
1167	],
1168	'selectors' => [
1169	'{{WRAPPER}} .docs-item-container li svg' => 'font-size: {{SIZE}}{{UNIT}};'
1170	],
1171	]
1172	);
1173
1174	$this->add_responsive_control(
1175	'list_icon_spacing',
1176	[
1177	'label' => esc_html__('Spacing', 'betterdocs'),
1178	'type' => Controls_Manager::DIMENSIONS,
1179	'size_units' => ['px', 'em', '%'],
1180	'selectors' => [
1181	'{{WRAPPER}} .docs-item-container li svg' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1182	],
1183	]
1184	);
1185
1186	$this->end_controls_section(); # end of 'Column Settings'
1187
1188	}
1189
1190	/**
1191	* ----------------------------------------------------------
1192	* Section: Sub List Settinggs
1193	* ----------------------------------------------------------
1194	*/
1195	public function sub_list_setting()
1196	{
1197
1198	$this->start_controls_section(
1199	'section_sub_list_settings',
1200	[
1201	'label' => __('Sub-Category List', 'betterdocs'),
1202	'tab' => Controls_Manager::TAB_STYLE
1203	]
1204	);
1205
1206
1207	$this->add_group_control(
1208	Group_Control_Typography::get_type(),
1209	[
1210	'name' => 'sub_list_item_typography',
1211	'selector' => '{{WRAPPER}} .docs-item-container .docs-sub-cat-title a',
1212	]
1213	);
1214
1215	$this->add_control(
1216	'sub_list_color',
1217	[
1218	'label' => esc_html__('Color', 'betterdocs'),
1219	'type' => Controls_Manager::COLOR,
1220	'selectors' => [
1221	'{{WRAPPER}} .docs-item-container .docs-sub-cat-title a' => 'color: {{VALUE}};',
1222	],
1223	]
1224	);
1225
1226	$this->add_control(
1227	'sub_list_hover_color',
1228	[
1229	'label' => esc_html__('Hover Color', 'betterdocs'),
1230	'type' => Controls_Manager::COLOR,
1231	'selectors' => [
1232	'{{WRAPPER}} .docs-item-container .docs-sub-cat-title a:hover' => 'color: {{VALUE}};',
1233	],
1234	]
1235	);
1236
1237	$this->add_responsive_control(
1238	'sub_list_margin',
1239	[
1240	'label' => esc_html__('List Item Spacing', 'betterdocs'),
1241	'type' => Controls_Manager::DIMENSIONS,
1242	'size_units' => ['px', 'em', '%'],
1243	'selectors' => [
1244	'{{WRAPPER}} .docs-item-container .docs-sub-cat-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1245	],
1246	]
1247	);
1248
1249
1250	$this->add_responsive_control(
1251	'sub_list_area_padding',
1252	[
1253	'label' => esc_html__('List Area Padding', 'betterdocs'),
1254	'type' => Controls_Manager::DIMENSIONS,
1255	'allowed_dimensions' => 'vertical',
1256	'size_units' => ['px', 'em', '%'],
1257	'selectors' => [
1258	'{{WRAPPER}} .docs-item-container .docs-sub-cat-title' => 'padding-top: {{TOP}}{{UNIT}}; padding-bottom: {{BOTTOM}}{{UNIT}};',
1259	],
1260	]
1261	);
1262
1263	$this->add_control(
1264	'sub_list_icon_settings_heading',
1265	[
1266	'label' => esc_html__('Icon', 'betterdocs'),
1267	'type' => Controls_Manager::HEADING,
1268	'separator' => 'before',
1269	]
1270	);
1271
1272	$this->add_responsive_control(
1273	'sub_list_icon_size',
1274	[
1275	'label' => __('Size', 'betterdocs'),
1276	'type' => Controls_Manager::SLIDER,
1277	'size_units' => ['px', '%', 'em'],
1278	'range' => [
1279	'%' => [
1280	'max' => 100,
1281	'step' => 1,
1282	],
1283	],
1284	'selectors' => [
1285	'{{WRAPPER}} .docs-item-container .docs-sub-cat-title svg' => 'font-size: {{SIZE}}{{UNIT}};'
1286	],
1287	]
1288	);
1289
1290	$this->add_control(
1291	'sub_list_icon_color',
1292	[
1293	'label' => esc_html__('Color', 'betterdocs'),
1294	'type' => Controls_Manager::COLOR,
1295	'selectors' => [
1296	'{{WRAPPER}} .docs-item-container .docs-sub-cat .sub-list svg' => 'fill: {{VALUE}};',
1297	],
1298	]
1299	);
1300
1301	$this->add_responsive_control(
1302	'sub_list_icon_spacing',
1303	[
1304	'label' => esc_html__('Spacing', 'betterdocs'),
1305	'type' => Controls_Manager::DIMENSIONS,
1306	'size_units' => ['px', 'em', '%'],
1307	'selectors' => [
1308	'{{WRAPPER}} .docs-item-container .docs-sub-cat-title svg' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1309	],
1310	]
1311	);
1312
1313	$this->end_controls_section(); # end of 'Column Settings'
1314	}
1315
1316	public function button_setting()
1317	{
1318	/**
1319	* ----------------------------------------------------------
1320	* Section: Button Settings
1321	* ----------------------------------------------------------
1322	*/
1323	$this->start_controls_section(
1324	'section_button_settings',
1325	[
1326	'label' => __('Button', 'betterdocs'),
1327	'tab' => Controls_Manager::TAB_STYLE,
1328	]
1329	);
1330
1331
1332	$this->start_controls_tabs(
1333	'button_settings_tabs'
1334	);
1335
1336	// Normal State Tab
1337	$this->start_controls_tab(
1338	'button_normal',
1339	['label' => esc_html__('Normal', 'betterdocs')]
1340	);
1341
1342	$this->add_group_control(
1343	Group_Control_Typography::get_type(),
1344	[
1345	'name' => 'button_typography_normal',
1346	'selector' => '{{WRAPPER}} .docs-cat-link-btn',
1347	]
1348	);
1349
1350	$this->add_control(
1351	'button_color_normal',
1352	[
1353	'label' => esc_html__('Color', 'betterdocs'),
1354	'type' => Controls_Manager::COLOR,
1355	'selectors' => [
1356	'{{WRAPPER}} .docs-cat-link-btn' => 'color: {{VALUE}};',
1357	],
1358	]
1359	);
1360
1361	$this->add_group_control(
1362	Group_Control_Background::get_type(),
1363	[
1364	'name' => 'button_background_normal',
1365	'types' => ['classic', 'gradient'],
1366	'selector' => '{{WRAPPER}} .docs-cat-link-btn',
1367	'exclude' => [
1368	'image',
1369	],
1370	]
1371	);
1372
1373	$this->add_group_control(
1374	Group_Control_Border::get_type(),
1375	[
1376	'name' => 'button_border_normal',
1377	'label' => esc_html__('Border', 'betterdocs'),
1378	'selector' => '{{WRAPPER}} .docs-cat-link-btn',
1379	]
1380	);
1381
1382	$this->add_responsive_control(
1383	'button_border_radius',
1384	[
1385	'label' => esc_html__('Border Radius', 'betterdocs'),
1386	'type' => Controls_Manager::DIMENSIONS,
1387	'size_units' => ['px', 'em', '%'],
1388	'selectors' => [
1389	'{{WRAPPER}} .docs-cat-link-btn' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1390	],
1391	]
1392	);
1393
1394	$this->add_responsive_control(
1395	'button_padding',
1396	[
1397	'label' => esc_html__('Padding', 'betterdocs'),
1398	'type' => Controls_Manager::DIMENSIONS,
1399	'size_units' => ['px', 'em', '%'],
1400	'selectors' => [
1401	'{{WRAPPER}} .docs-cat-link-btn' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1402	],
1403	]
1404	);
1405
1406	$this->add_responsive_control(
1407	'button_area_margin',
1408	[
1409	'label' => esc_html__('Area Spacing', 'betterdocs'),
1410	'type' => Controls_Manager::DIMENSIONS,
1411	'size_units' => ['px', 'em', '%'],
1412	'selectors' => [
1413	'{{WRAPPER}} .docs-cat-link-btn' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1414	],
1415	]
1416	);
1417
1418	$this->end_controls_tab();
1419
1420	// Normal State Tab
1421	$this->start_controls_tab(
1422	'button_hover',
1423	['label' => esc_html__('Hover', 'betterdocs')]
1424	);
1425
1426	$this->add_control(
1427	'button_color_hover',
1428	[
1429	'label' => esc_html__('Color', 'betterdocs'),
1430	'type' => Controls_Manager::COLOR,
1431	'selectors' => [
1432	'{{WRAPPER}} .docs-cat-link-btn:hover' => 'color: {{VALUE}};',
1433	],
1434	]
1435	);
1436
1437	$this->add_group_control(
1438	Group_Control_Background::get_type(),
1439	[
1440	'name' => 'button_background_hover',
1441	'types' => ['classic', 'gradient'],
1442	'selector' => '{{WRAPPER}} .docs-cat-link-btn:hover',
1443	'exclude' => [
1444	'image',
1445	],
1446	]
1447	);
1448
1449	$this->add_group_control(
1450	Group_Control_Border::get_type(),
1451	[
1452	'name' => 'button_border_hover',
1453	'label' => esc_html__('Border', 'betterdocs'),
1454	'selector' => '{{WRAPPER}} .docs-cat-link-btn:hover',
1455	]
1456	);
1457
1458	$this->add_responsive_control(
1459	'button_hover_border_radius',
1460	[
1461	'label' => esc_html__('Border Radius', 'betterdocs'),
1462	'type' => Controls_Manager::DIMENSIONS,
1463	'size_units' => ['px', 'em', '%'],
1464	'selectors' => [
1465	'{{WRAPPER}} .docs-cat-link-btn:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1466	],
1467	]
1468	);
1469
1470	$this->end_controls_tab();
1471
1472	$this->end_controls_tabs();
1473
1474	$this->add_responsive_control(
1475	'button_text_alignment',
1476	[
1477	'label' => __('Text Alignment', 'betterdocs'),
1478	'type' => Controls_Manager::CHOOSE,
1479	'options' => [
1480	'left' => [
1481	'title' => __('Left', 'betterdocs'),
1482	'icon' => 'fa fa-align-left',
1483	],
1484	'center' => [
1485	'title' => __('Center', 'betterdocs'),
1486	'icon' => 'fa fa-align-center',
1487	],
1488	'right' => [
1489	'title' => __('Right', 'betterdocs'),
1490	'icon' => 'fa fa-align-right',
1491	],
1492	],
1493	'selectors' => [
1494	'{{WRAPPER}} .docs-cat-link-btn' => 'text-align: {{VALUE}};',
1495	],
1496	]
1497	);
1498
1499	$this->add_responsive_control(
1500	'button_alignment',
1501	[
1502	'label' => __('Button Alignment', 'betterdocs'),
1503	'type' => Controls_Manager::CHOOSE,
1504	'options' => [
1505	'left' => [
1506	'title' => __('Left', 'betterdocs'),
1507	'icon' => 'fa fa-align-left',
1508	],
1509	'center' => [
1510	'title' => __('Center', 'betterdocs'),
1511	'icon' => 'fa fa-align-center',
1512	],
1513	'right' => [
1514	'title' => __('Right', 'betterdocs'),
1515	'icon' => 'fa fa-align-right',
1516	],
1517	],
1518	'selectors' => [
1519	'{{WRAPPER}} .docs-item-container .docs-cat-link-btn' => 'text-align: {{VALUE}};',
1520	],
1521	]
1522	);
1523
1524	$this->end_controls_section(); # end of 'Button Settings'
1525	}
1526
1527	protected function render()
1528	{
1529	$settings = $this->get_settings_for_display();
1530	$sticky_toc = ($settings['enable_sticky_toc'] == '1') ? $this->get_toc() : '';
1531	$shortcode = do_shortcode('[betterdocs_category_grid disable_customizer_style="true" sidebar_list="true" posts_per_grid="-1" title_tag="'.$settings['category_title_tag'].'"]');
1532	$sidebar = '<aside id="betterdocs-sidebar" class="betterdocs-el-single-sidebar"><div class="betterdocs-sidebar-content">' . $shortcode . '</div>' . $sticky_toc . '</aside>';
1533	echo apply_filters('betterdocs_elementor_sidebar', $sidebar, $settings);
1534	}
1535
1536	public function get_toc()
1537	{
1538	ob_start();
1539	echo '<div class="sticky-toc-container">
1540	<a class="close-toc" href="#">
1541	<svg xmlns="http://www.w3.org/2000/svg" width="16px" viewBox="0 0 24 24">
1542	<path style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;isolation:auto;mix-blend-mode:normal" d="M 4.9902344 3.9902344 A 1.0001 1.0001 0 0 0 4.2929688 5.7070312 L 10.585938 12 L 4.2929688 18.292969 A 1.0001 1.0001 0 1 0 5.7070312 19.707031 L 12 13.414062 L 18.292969 19.707031 A 1.0001 1.0001 0 1 0 19.707031 18.292969 L 13.414062 12 L 19.707031 5.7070312 A 1.0001 1.0001 0 0 0 18.980469 3.9902344 A 1.0001 1.0001 0 0 0 18.292969 4.2929688 L 12 10.585938 L 5.7070312 4.2929688 A 1.0001 1.0001 0 0 0 4.9902344 3.9902344 z" font-weight="400" font-family="sans-serif" white-space="normal" overflow="visible"></path>
1543	</svg>
1544	</a>
1545	</div>';
1546	return ob_get_clean();
1547	}
1548	}
1549