Simple_Menu.php — Essential Addons for Elementor – Popular Elementor Templates & Widgets 6.0.10

essential-addons-for-elementor-lite / includes / Elements / Simple_Menu.php

essential-addons-for-elementor-lite / includes / Elements Last commit date

Adv_Accordion.php 1 year ago Adv_Tabs.php 1 year ago Advanced_Data_Table.php 1 year ago Better_Payment.php 4 years ago Betterdocs_Category_Box.php 1 year ago Betterdocs_Category_Grid.php 1 year ago Betterdocs_Search_Form.php 1 year ago Business_Reviews.php 1 year ago Caldera_Forms.php 1 year ago Career_Page.php 4 years ago Contact_Form_7.php 1 year ago Content_Ticker.php 1 year ago Countdown.php 1 year ago Creative_Button.php 1 year ago Cta_Box.php 1 year ago Data_Table.php 1 year ago Dual_Color_Header.php 1 year ago EmbedPress.php 4 years ago Event_Calendar.php 1 year ago Facebook_Feed.php 1 year ago Fancy_Text.php 1 year ago Feature_List.php 1 year ago Filterable_Gallery.php 1 year ago Flip_Box.php 1 year ago FluentForm.php 1 year ago Formstack.php 1 year ago GravityForms.php 1 year ago Image_Accordion.php 1 year ago Info_Box.php 1 year ago Interactive_Circle.php 1 year ago Login_Register.php 1 year ago NFT_Gallery.php 1 year ago NinjaForms.php 1 year ago Post_Grid.php 1 year ago Post_Timeline.php 1 year ago Pricing_Table.php 1 year ago Product_Grid.php 1 year ago Progress_Bar.php 1 year ago SVG_Draw.php 1 year ago Simple_Menu.php 1 year ago Sticky_Video.php 1 year ago Team_Member.php 1 year ago Testimonial.php 1 year ago Tooltip.php 1 year ago Twitter_Feed.php 1 year ago TypeForm.php 1 year ago WeForms.php 2 years ago Woo_Cart.php 1 year ago Woo_Checkout.php 1 year ago Woo_Product_Carousel.php 1 year ago Woo_Product_Compare.php 2 years ago Woo_Product_Gallery.php 1 year ago Woo_Product_List.php 1 year ago WpForms.php 1 year ago index.php 3 years ago

Simple_Menu.php

1647 lines

1	<?php
2	namespace Essential_Addons_Elementor\Elements;
3	use Elementor\Controls_Manager;
4	use Elementor\Core\Kits\Documents\Tabs\Global_Typography;
5	use Elementor\Group_Control_Border;
6	use Elementor\Group_Control_Box_Shadow;
7	use Elementor\Group_Control_Typography;
8	use Elementor\Icons_Manager;
9	use Elementor\Plugin;
10	use Elementor\Widget_Base;
11	use Essential_Addons_Elementor\Classes\Helper as HelperClass;
12	use Essential_Addons_Elementor\Traits\Helper;
13
14	// If this file is called directly, abort.
15	if (!defined('ABSPATH')) {
16	exit;
17	}
18
19	class Simple_Menu extends Widget_Base
20	{
21
22	use Helper;
23
24	protected $_has_template_content = false;
25
26	public function get_name()
27	{
28	return 'eael-simple-menu';
29	}
30
31	public function get_title()
32	{
33	return esc_html__('Simple Menu', 'essential-addons-for-elementor-lite');
34	}
35
36	public function get_icon()
37	{
38	return 'eaicon-simple-menu';
39	}
40
41	/**
42	* Forcefully enqueue elementor icon library
43	*
44	* @return string[]
45	*/
46	public function get_style_depends()
47	{
48	return ['elementor-icons'];
49	}
50
51	public function get_categories() {
52	return [ 'essential-addons-elementor' ];
53	}
54
55	public function get_keywords()
56	{
57	return [
58	'simple menu',
59	'ea simple menu',
60	'nav menu',
61	'ea nav menu',
62	'navigation',
63	'ea navigation',
64	'navigation menu',
65	'ea navigation menu',
66	'header menu',
67	'ea',
68	'essential addons',
69	];
70	}
71
72	public function get_custom_help_url()
73	{
74	return 'https://essential-addons.com/elementor/docs/simple-menu/';
75	}
76
77	/**
78	* Get all registered menus.
79	*
80	* @return array of menus.
81	*/
82	private function get_simple_menus()
83	{
84	$menus = wp_get_nav_menus();
85	$options = [];
86
87	if (empty($menus)) {
88	return $options;
89	}
90
91	foreach ($menus as $menu) {
92	$options[$menu->term_id] = $menu->name;
93	}
94
95	return $options;
96	}
97
98	protected function register_controls()
99	{
100	/**
101	* Content: General
102	*/
103	$this->start_controls_section(
104	'eael_simple_menu_section_general',
105	[
106	'label' => esc_html__('General', 'essential-addons-for-elementor-lite'),
107	]
108	);
109
110	$simple_menus = $this->get_simple_menus();
111
112	if ($simple_menus) {
113	$this->add_control(
114	'eael_simple_menu_menu',
115	[
116	'label' => esc_html__('Select Menu', 'essential-addons-for-elementor-lite'),
117	'description' => sprintf(__('Go to the <a href="%s" target="_blank">Menu screen</a> to manage your menus.', 'essential-addons-for-elementor-lite'), admin_url('nav-menus.php')),
118	'type' => Controls_Manager::SELECT,
119	'label_block' => false,
120	'options' => $simple_menus,
121	'default' => array_keys($simple_menus)[0],
122	]
123	);
124	} else {
125	$this->add_control(
126	'menu',
127	[
128	'type' => Controls_Manager::RAW_HTML,
129	'raw' => sprintf(__('<strong>There are no menus in your site.</strong><br>Go to the <a href="%s" target="_blank">Menus screen</a> to create one.', 'essential-addons-for-elementor-lite'), admin_url('nav-menus.php?action=edit&menu=0')),
130	'separator' => 'after',
131	]
132	);
133	}
134
135	$this->add_control(
136	'eael_simple_menu_preset',
137	[
138	'label' => esc_html__('Preset', 'essential-addons-for-elementor-lite'),
139	'type' => Controls_Manager::SELECT,
140	'default' => 'preset-1',
141	'options' => [
142	'preset-1' => esc_html__('Preset 1', 'essential-addons-for-elementor-lite'),
143	'preset-2' => esc_html__('Preset 2', 'essential-addons-for-elementor-lite'),
144	'preset-3' => esc_html__('Preset 3', 'essential-addons-for-elementor-lite'),
145	],
146	]
147	);
148
149	$this->add_control(
150	'eael_simple_menu_layout',
151	[
152	'label' => esc_html__('Layout', 'essential-addons-for-elementor-lite'),
153	'type' => Controls_Manager::SELECT,
154	'label_block' => false,
155	'options' => [
156	'horizontal' => __('Horizontal', 'essential-addons-for-elementor-lite'),
157	'vertical' => __('Vertical', 'essential-addons-for-elementor-lite'),
158	],
159	'default' => 'horizontal',
160	]
161	);
162
163	$this->end_controls_section();
164
165	$this->start_controls_section(
166	'eael_simple_menu_section_hamburger',
167	[
168	'label' => esc_html__('Hamburger Options', 'essential-addons-for-elementor-lite'),
169	]
170	);
171
172	$this->add_control(
173	'eael_simple_menu_hamburger_disable_selected_menu',
174	[
175	'label' => esc_html__('Disable Selected Menu', 'essential-addons-for-elementor-lite'),
176	'type' => \Elementor\Controls_Manager::SWITCHER,
177	'label_on' => __('Yes', 'essential-addons-for-elementor-lite'),
178	'label_off' => __('No', 'essential-addons-for-elementor-lite'),
179	'return_value' => 'hide',
180	'default' => 'no',
181	'prefix_class' => 'eael_simple_menu_hamburger_disable_selected_menu_',
182	]
183	);
184
185	$this->add_control(
186	'eael_simple_menu_hamburger_alignment',
187	[
188	'label' => __('Hamburger Alignment', 'essential-addons-for-elementor-lite'),
189	'type' => Controls_Manager::CHOOSE,
190	'options' => [
191	'left' => [
192	'title' => __('Left', 'essential-addons-for-elementor-lite'),
193	'icon' => 'eicon-text-align-left',
194	],
195	'center' => [
196	'title' => __('Center', 'essential-addons-for-elementor-lite'),
197	'icon' => 'eicon-text-align-center',
198	],
199	'right' => [
200	'title' => __('Right', 'essential-addons-for-elementor-lite'),
201	'icon' => 'eicon-text-align-right',
202	],
203	],
204	'default' => 'right',
205	'prefix_class' => 'eael-simple-menu-hamburger-align-',
206	// 'condition' => [
207	// 'eael_simple_menu_hamburger_disable_selected_menu' => 'hide',
208	// ],
209	]
210	);
211
212	$this->add_control(
213	'eael_simple_menu_full_width',
214	[
215	'label' => __('Full Width', 'essential-addons-for-elementor-lite'),
216	'type' => Controls_Manager::SWITCHER,
217	'description' => __('Stretch the dropdown of the menu to full width.', 'essential-addons-for-elementor-lite'),
218	'label_on' => __('Yes', 'essential-addons-for-elementor-lite'),
219	'label_off' => __('No', 'essential-addons-for-elementor-lite'),
220	'default' => 'no',
221	]
222	);
223
224	$this->add_control(
225	'eael_simple_menu_hamburger_icon',
226	[
227	'label' => esc_html__('Icon', 'essential-addons-for-elementor-lite'),
228	'type' => Controls_Manager::ICONS,
229	'default' => [
230	'value' => 'fas fa-bars',
231	'library' => 'fa-solid',
232	],
233	]
234	);
235
236	$this->add_control(
237	'eael_simple_menu_heading_mobile_dropdown',
238	[
239	'label' => esc_html__( 'Mobile Dropdown', 'essential-addons-for-elementor-lite' ),
240	'type' => Controls_Manager::HEADING,
241	'separator' => 'before',
242	]
243	);
244
245	$default_value = 'tablet';
246
247	$this->add_control(
248	'eael_simple_menu_dropdown',
249	[
250	'label' => esc_html__( 'Breakpoint', 'essential-addons-for-elementor-lite' ),
251	'type' => Controls_Manager::SELECT,
252	'default' => esc_html( $default_value ),
253	'options' => $this->get_dropdown_options(),
254	'prefix_class' => 'eael-hamburger--',
255	]
256	);
257
258	$this->end_controls_section();
259
260	/**
261	* Style: Main Menu
262	*/
263
264	$this->style_menu();
265
266	/**
267	* Style: Top Level Items
268	*/
269	$this->style_top_level_item();
270
271	/**
272	* Style: Mobile Menu
273	*/
274	$this->start_controls_section(
275	'eael_simple_menu_section_style_mobile_menu',
276	[
277	'label' => __('Hamburger Menu', 'essential-addons-for-elementor-lite'),
278	'tab' => Controls_Manager::TAB_STYLE,
279	]
280	);
281	$this->add_responsive_control(
282	'eael_simple_menu_hamburger_min_height',
283	[
284	'label' => esc_html__( 'Min Height', 'essential-addons-for-elementor-lite' ),
285	'type' => Controls_Manager::SLIDER,
286	// 'devices' => [ 'tablet', 'mobile' ],
287	// 'devices' => [ 'desktop', 'mobile' ],
288	'range' => [
289	'px' => [
290	'max' => 500,
291	],
292	],
293	'selectors' => [
294	'{{WRAPPER}} .eael-simple-menu-container.eael-simple-menu-hamburger' => 'min-height: {{SIZE}}{{UNIT}};',
295	],
296	]
297	);
298
299	$this->add_control(
300	'eael_simple_menu_hamburger_bg',
301	[
302	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
303	'type' => Controls_Manager::COLOR,
304	'default' => '#000000',
305	'selectors' => [
306	'{{WRAPPER}} .eael-simple-menu-container .eael-simple-menu-toggle' => 'background-color: {{VALUE}}',
307	],
308	]
309	);
310
311	$this->add_control(
312	'eael_simple_menu_hamburger_size',
313	[
314	'label' => esc_html__( 'Icon Size', 'essential-addons-for-elementor-lite' ),
315	'type' => Controls_Manager::SLIDER,
316	'range' => [
317	'px' => [
318	'max' => 30,
319	],
320	],
321	'selectors' => [
322	'{{WRAPPER}} .eael-simple-menu-container .eael-simple-menu-toggle i' => 'font-size: {{SIZE}}{{UNIT}};',
323	'{{WRAPPER}} .eael-simple-menu-container .eael-simple-menu-toggle svg' => 'width: {{SIZE}}{{UNIT}};',
324	],
325	]
326	);
327
328	$this->add_control(
329	'eael_simple_menu_hamburger_icon_color',
330	[
331	'label' => __('Icon Color', 'essential-addons-for-elementor-lite'),
332	'type' => Controls_Manager::COLOR,
333	'default' => '#ffffff',
334	'selectors' => [
335	'{{WRAPPER}} .eael-simple-menu-container .eael-simple-menu-toggle i' => 'color: {{VALUE}}',
336	'{{WRAPPER}} .eael-simple-menu-container .eael-simple-menu-toggle svg' => 'fill: {{VALUE}}',
337	],
338
339	]
340	);
341
342	$this->add_responsive_control(
343	'eael_simple_menu_hamburger_padding',
344	[
345	'label' => __('Padding', 'essential-addons-for-elementor-lite'),
346	'type' => Controls_Manager::DIMENSIONS,
347	'size_units' => ['px', '%', 'em'],
348	'selectors' => [
349	'{{WRAPPER}} .eael-simple-menu-container .eael-simple-menu-toggle' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
350	],
351	]
352	);
353
354	$this->add_control(
355	'eael_simple_menu_hamburger_item_heading',
356	[
357	'label' => __('Items', 'essential-addons-for-elementor-lite'),
358	'type' => Controls_Manager::HEADING,
359	'separator' => 'before',
360	]
361	);
362
363	$this->add_control(
364	'eael_hamburger_menu_item_alignment',
365	[
366	'label' => __('Alignment', 'essential-addons-for-elementor-lite'),
367	'type' => Controls_Manager::CHOOSE,
368	'options' => [
369	'eael-hamburger-left' => [
370	'title' => __('Left', 'essential-addons-for-elementor-lite'),
371	'icon' => 'eicon-text-align-left',
372	],
373	'eael-hamburger-center' => [
374	'title' => __('Center', 'essential-addons-for-elementor-lite'),
375	'icon' => 'eicon-text-align-center',
376	],
377	'eael-hamburger-right' => [
378	'title' => __('Right', 'essential-addons-for-elementor-lite'),
379	'icon' => 'eicon-text-align-right',
380	],
381	],
382	'condition' => [
383	'eael_simple_menu_preset!' => ['preset-2', 'preset-3']
384	]
385	]
386	);
387
388	$this->start_controls_tabs('eael_simple_menu_hamburger_top_level_item');
389
390	$this->start_controls_tab(
391	'eael_simple_menu_hamburger_top_level_item_default',
392	[
393	'label' => __('Default', 'essential-addons-for-elementor-lite'),
394	]
395	);
396
397	$this->add_control(
398	'eael_simple_menu_hamburger_top_level_item_color',
399	[
400	'label' => __('Text Color', 'essential-addons-for-elementor-lite'),
401	'type' => Controls_Manager::COLOR,
402	// 'default' => '#ffffff',
403	'selectors' => [
404	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li > a' => 'color: {{VALUE}}',
405	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li > a > span svg' => 'fill: {{VALUE}}',
406	],
407	]
408	);
409
410	$this->add_control(
411	'eael_simple_menu_hamburger_top_level_item_background',
412	[
413	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
414	'type' => Controls_Manager::COLOR,
415	'default' => '',
416	'selectors' => [
417	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li > a' => 'background-color: {{VALUE}}',
418	],
419	]
420	);
421
422	$this->end_controls_tab();
423
424	$this->start_controls_tab(
425	'eael_simple_menu_hamburger_top_level_item_hover',
426	[
427	'label' => __('Hover', 'essential-addons-for-elementor-lite'),
428	]
429	);
430
431	$this->add_control(
432	'eael_simple_menu_hamburger_top_level_item_color_hover',
433	[
434	'label' => __('Text Color', 'essential-addons-for-elementor-lite'),
435	'type' => Controls_Manager::COLOR,
436	// 'default' => '#ffffff',
437	'selectors' => [
438	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li:hover > a' => 'color: {{VALUE}}',
439	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li:hover > a > span svg' => 'fill: {{VALUE}}',
440	],
441	]
442	);
443
444	$this->add_control(
445	'eael_simple_menu_hamburger_top_level_item_bg_hover',
446	[
447	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
448	'type' => Controls_Manager::COLOR,
449	'default' => '',
450	'selectors' => [
451	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li:hover > a' => 'background-color: {{VALUE}}',
452	],
453	]
454	);
455
456	$this->end_controls_tab();
457
458	$this->start_controls_tab(
459	'eael_simple_menu_hamburger_top_level_item_active',
460	[
461	'label' => __('Active', 'essential-addons-for-elementor-lite'),
462	]
463	);
464
465	$this->add_control(
466	'eael_simple_menu_hamburger_top_level_item_color_active',
467	[
468	'label' => __('Text Color', 'essential-addons-for-elementor-lite'),
469	'type' => Controls_Manager::COLOR,
470	// 'default' => '#ffffff',
471	'selectors' => [
472	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li.current-menu-item > a.eael-item-active' => 'color: {{VALUE}}',
473	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li.current-menu-item > a.eael-item-active > span svg' => 'fill: {{VALUE}}',
474	],
475	]
476	);
477
478	$this->add_control(
479	'eael_simple_menu_hamburger_top_level_item_bg_active',
480	[
481	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
482	'type' => Controls_Manager::COLOR,
483	'default' => '',
484	'selectors' => [
485	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li.current-menu-item > a.eael-item-active' => 'background-color: {{VALUE}}',
486	],
487	]
488	);
489
490	$this->end_controls_tab();
491	$this->end_controls_tabs();
492
493	$this->add_control(
494	'eael_simple_menu_hamburger_dropdown_heading',
495	[
496	'label' => __('Dropdown Items', 'essential-addons-for-elementor-lite'),
497	'type' => Controls_Manager::HEADING,
498	'separator' => 'before',
499	]
500	);
501
502	$this->add_responsive_control(
503	'eael_simple_menu_hamburger_dropdown_item_padding',
504	[
505	'label' => __('Padding', 'essential-addons-for-elementor-lite'),
506	'type' => Controls_Manager::DIMENSIONS,
507	'size_units' => ['px', '%', 'em'],
508	'selectors' => [
509	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li ul li a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
510	],
511	]
512	);
513
514	$this->start_controls_tabs('eael_simple_menu_hamburger_dropdown_item');
515
516	$this->start_controls_tab(
517	'eael_simple_menu_hamburger_dropdown_item_default',
518	[
519	'label' => __('Default', 'essential-addons-for-elementor-lite'),
520	]
521	);
522
523	$this->add_control(
524	'eael_simple_menu_hamburger_dropdown_item_color',
525	[
526	'label' => __('Text Color', 'essential-addons-for-elementor-lite'),
527	'type' => Controls_Manager::COLOR,
528	// 'default' => '#ffffff',
529	'selectors' => [
530	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li ul li a' => 'color: {{VALUE}}',
531	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li ul li > span svg' => 'fill: {{VALUE}}',
532	],
533	]
534	);
535
536	$this->add_control(
537	'eael_simple_menu_hamburger_dropdown_item_background',
538	[
539	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
540	'type' => Controls_Manager::COLOR,
541	'default' => '',
542	'selectors' => [
543	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li ul li a' => 'background-color: {{VALUE}}',
544	],
545	]
546	);
547
548	$this->end_controls_tab();
549
550	$this->start_controls_tab(
551	'eael_simple_menu_hamburger_dropdown_item_hover',
552	[
553	'label' => __('Hover', 'essential-addons-for-elementor-lite'),
554	]
555	);
556
557	$this->add_control(
558	'eael_simple_menu_hamburger_dropdown_item_color_hover',
559	[
560	'label' => __('Text Color', 'essential-addons-for-elementor-lite'),
561	'type' => Controls_Manager::COLOR,
562	// 'default' => '#ffffff',
563	'selectors' => [
564	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li ul li:hover a' => 'color: {{VALUE}}',
565	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li ul li:hover a > span svg' => 'fill: {{VALUE}}',
566	],
567	]
568	);
569
570	$this->add_control(
571	'eael_simple_menu_hamburger_dropdown_item_bg_hover',
572	[
573	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
574	'type' => Controls_Manager::COLOR,
575	'default' => '',
576	'selectors' => [
577	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive li ul li:hover a' => 'background-color: {{VALUE}}',
578	],
579	]
580	);
581
582	$this->end_controls_tab();
583	$this->end_controls_tabs();
584
585	$this->add_control(
586	'eael_simple_menu_hamburger_dropdown_a',
587	[
588	'label' => __('Dropdown Indicator', 'essential-addons-for-elementor-lite'),
589	'type' => Controls_Manager::HEADING,
590	'separator' => 'before',
591	]
592	);
593
594	$this->add_control(
595	'eael_simple_menu_hamburger_indicator_possition',
596	[
597	'label' => esc_html__( 'Top Position', 'essential-addons-for-elementor-lite' ),
598	'type' => Controls_Manager::SLIDER,
599	// 'range' => [
600	// 'px' => [
601	// 'max' => 30,
602	// ],
603	// ],
604	'size_units' => ['px', '%'],
605	'selectors' => [
606	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-responsive .eael-simple-menu-indicator' => 'top: {{SIZE}}{{UNIT}};',
607	],
608	]
609	);
610
611	$this->end_controls_section();
612
613	/**
614	* Style: Dropdown Menu
615	*/
616	$this->start_controls_section(
617	'eael_simple_menu_section_style_dropdown',
618	[
619	'label' => __('Dropdown Menu', 'essential-addons-for-elementor-lite'),
620	'tab' => Controls_Manager::TAB_STYLE,
621	]
622	);
623
624	$this->add_control(
625	'eael_simple_menu_dropdown_animation',
626	[
627	'label' => __('Animation', 'essential-addons-for-elementor-lite'),
628	'type' => Controls_Manager::SELECT,
629	'options' => [
630	'eael-simple-menu-dropdown-animate-fade' => __('Fade', 'essential-addons-for-elementor-lite'),
631	'eael-simple-menu-dropdown-animate-to-top' => __('To Top', 'essential-addons-for-elementor-lite'),
632	'eael-simple-menu-dropdown-animate-zoom-in' => __('ZoomIn', 'essential-addons-for-elementor-lite'),
633	'eael-simple-menu-dropdown-animate-zoom-out' => __('ZoomOut', 'essential-addons-for-elementor-lite'),
634	],
635	'default' => 'eael-simple-menu-dropdown-animate-to-top',
636	'condition' => [
637	'eael_simple_menu_layout' => ['horizontal'],
638	],
639	]
640	);
641
642	$this->add_control(
643	'eael_simple_menu_dropdown_background',
644	[
645	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
646	'type' => Controls_Manager::COLOR,
647	// 'default' => '#ffffff',
648	'selectors' => [
649	'{{WRAPPER}} .eael-simple-menu li ul' => 'background-color: {{VALUE}}',
650	],
651	]
652	);
653
654	$this->add_group_control(
655	Group_Control_Border::get_type(),
656	[
657	'name' => 'eael_simple_menu_dropdown_border',
658	'label' => __('Border', 'essential-addons-for-elementor-lite'),
659	'selector' => '{{WRAPPER}} .eael-simple-menu li ul',
660	]
661	);
662
663	$this->add_responsive_control(
664	'eael_simple_menu_dropdown_border_radius',
665	[
666	'label' => __('Border Radius', 'essential-addons-for-elementor-lite'),
667	'type' => Controls_Manager::DIMENSIONS,
668	'size_units' => ['px', '%', 'em'],
669	'selectors' => [
670	'{{WRAPPER}} .eael-simple-menu li ul' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
671	],
672	]
673	);
674
675	$this->add_responsive_control(
676	'eael_simple_menu_dropdown_padding',
677	[
678	'label' => __('Padding', 'essential-addons-for-elementor-lite'),
679	'type' => Controls_Manager::DIMENSIONS,
680	'size_units' => ['px', '%', 'em'],
681	'selectors' => [
682	'{{WRAPPER}} .eael-simple-menu li ul' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
683	],
684	]
685	);
686
687	$this->add_group_control(
688	Group_Control_Box_Shadow::get_type(),
689	[
690	'name' => 'eael_simple_menu_dropdown_box_shadow',
691	'label' => __('Shadow', 'essential-addons-for-elementor-lite'),
692	'selector' => '{{WRAPPER}} .eael-simple-menu li ul',
693	]
694	);
695
696	$this->end_controls_section();
697
698	/**
699	* Style: Main Menu (Hover)
700	*/
701	$this->style_dropdown_item();
702	}
703
704	protected function style_menu()
705	{
706	$this->start_controls_section(
707	'eael_simple_menu_section_style_menu',
708	[
709	'label' => __('Main Menu', 'essential-addons-for-elementor-lite'),
710	'tab' => Controls_Manager::TAB_STYLE,
711	]
712	);
713
714	$this->add_responsive_control(
715	'eael_simple_menu_background',
716	[
717	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
718	'type' => Controls_Manager::COLOR,
719	// 'default' => '#54595f',
720	'selectors' => [
721	'{{WRAPPER}} .eael-simple-menu-container' => 'background-color: {{VALUE}}',
722	'{{WRAPPER}} .eael-simple-menu-container .eael-simple-menu.eael-simple-menu-horizontal' => 'background-color: {{VALUE}}',
723	],
724	]
725	);
726
727	$this->add_group_control(
728	Group_Control_Border::get_type(),
729	[
730	'name' => 'eael_simple_menu_border',
731	'label' => __('Border', 'essential-addons-for-elementor-lite'),
732	'selector' => '{{WRAPPER}} .eael-simple-menu-container, {{WRAPPER}} .eael-simple-menu-container .eael-simple-menu-toggle, {{WRAPPER}} .eael-simple-menu.eael-simple-menu-horizontal.eael-simple-menu-responsive',
733	]
734	);
735
736	$this->add_group_control(
737	Group_Control_Box_Shadow::get_type(),
738	[
739	'name' => 'eael_simple_menu_box_shadow',
740	'label' => __('Shadow', 'essential-addons-for-elementor-lite'),
741	'selector' => '{{WRAPPER}} .eael-simple-menu-container',
742	]
743	);
744
745	$this->end_controls_section();
746	}
747
748	protected function style_top_level_item()
749	{
750	$this->start_controls_section(
751	'eael_simple_menu_section_style_top_level_item',
752	[
753	'label' => __('Top Level Item', 'essential-addons-for-elementor-lite'),
754	'tab' => Controls_Manager::TAB_STYLE,
755	]
756	);
757
758	$this->add_responsive_control(
759	'eael_simple_menu_item_padding',
760	[
761	'label' => __('Item Padding', 'essential-addons-for-elementor-lite'),
762	'type' => Controls_Manager::DIMENSIONS,
763	'size_units' => ['px', '%', 'em'],
764	'selectors' => [
765	'{{WRAPPER}} .eael-simple-menu li a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
766	],
767	]
768	);
769
770	$this->add_control(
771	'eael_simple_menu_item_alignment',
772	[
773	'label' => __('Alignment', 'essential-addons-for-elementor-lite'),
774	'type' => Controls_Manager::CHOOSE,
775	'options' => [
776	'eael-simple-menu-align-left' => [
777	'title' => __('Left', 'essential-addons-for-elementor-lite'),
778	'icon' => 'eicon-text-align-left',
779	],
780	'eael-simple-menu-align-center' => [
781	'title' => __('Center', 'essential-addons-for-elementor-lite'),
782	'icon' => 'eicon-text-align-center',
783	],
784	'eael-simple-menu-align-right' => [
785	'title' => __('Right', 'essential-addons-for-elementor-lite'),
786	'icon' => 'eicon-text-align-right',
787	],
788	],
789	'default' => 'eael-simple-menu-align-left',
790	'condition' => [
791	'eael_simple_menu_preset!' => ['preset-2', 'preset-3']
792	]
793	]
794	);
795
796	$this->add_control(
797	'eael_simple_menu_item_alignment_right',
798	[
799	'label' => __('Alignment', 'essential-addons-for-elementor-lite'),
800	'type' => Controls_Manager::CHOOSE,
801	'options' => [
802	'eael-simple-menu-align-left' => [
803	'title' => __('Left', 'essential-addons-for-elementor-lite'),
804	'icon' => 'eicon-text-align-left',
805	],
806	'eael-simple-menu-align-center' => [
807	'title' => __('Center', 'essential-addons-for-elementor-lite'),
808	'icon' => 'eicon-text-align-center',
809	],
810	'eael-simple-menu-align-right' => [
811	'title' => __('Right', 'essential-addons-for-elementor-lite'),
812	'icon' => 'eicon-text-align-right',
813	],
814	],
815	'default' => 'eael-simple-menu-align-right',
816	'condition' => [
817	'eael_simple_menu_preset' => ['preset-3']
818	]
819	]
820	);
821	$this->add_control(
822	'eael_simple_menu_item_alignment_center',
823	[
824	'label' => __('Alignment', 'essential-addons-for-elementor-lite'),
825	'type' => Controls_Manager::CHOOSE,
826	'options' => [
827	'eael-simple-menu-align-left' => [
828	'title' => __('Left', 'essential-addons-for-elementor-lite'),
829	'icon' => 'eicon-text-align-left',
830	],
831	'eael-simple-menu-align-center' => [
832	'title' => __('Center', 'essential-addons-for-elementor-lite'),
833	'icon' => 'eicon-text-align-center',
834	],
835	'eael-simple-menu-align-right' => [
836	'title' => __('Right', 'essential-addons-for-elementor-lite'),
837	'icon' => 'eicon-text-align-right',
838	],
839	],
840	'default' => 'eael-simple-menu-align-center',
841	'condition' => [
842	'eael_simple_menu_preset' => ['preset-2']
843	]
844	]
845	);
846
847	$this->add_control(
848	'eael_simple_menu_item_divider_color',
849	[
850	'label' => __('Divider Color', 'essential-addons-for-elementor-lite'),
851	'type' => Controls_Manager::COLOR,
852	'default' => '',
853	'selectors' => [
854	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-horizontal:not(.eael-simple-menu-responsive) > li > a' => 'border-right: 1px solid {{VALUE}}',
855	'{{WRAPPER}} .eael-simple-menu-align-center .eael-simple-menu.eael-simple-menu-horizontal:not(.eael-simple-menu-responsive) > li:first-child > a' => 'border-left: 1px solid {{VALUE}}',
856	'{{WRAPPER}} .eael-simple-menu-align-right .eael-simple-menu.eael-simple-menu-horizontal:not(.eael-simple-menu-responsive) > li:first-child > a' => 'border-left: 1px solid {{VALUE}}',
857	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-horizontal.eael-simple-menu-responsive > li:not(:last-child) > a' => 'border-bottom: 1px solid {{VALUE}}',
858	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-vertical > li:not(:last-child) > a' => 'border-bottom: 1px solid {{VALUE}}',
859	],
860
861	]
862	);
863
864	$this->add_group_control(
865	Group_Control_Typography::get_type(),
866	[
867	'name' => 'eael_simple_menu_item_typography',
868	'label' => __('Typography', 'essential-addons-for-elementor-lite'),
869	'global' => [
870	'default' => Global_Typography::TYPOGRAPHY_PRIMARY
871	],
872	'selector' => '{{WRAPPER}} .eael-simple-menu >li > a, .eael-simple-menu-container .eael-simple-menu-toggle-text',
873	]
874	);
875
876	$this->start_controls_tabs('eael_simple_menu_top_level_item');
877
878	$this->start_controls_tab(
879	'eael_simple_menu_top_level_item_default',
880	[
881	'label' => __('Default', 'essential-addons-for-elementor-lite'),
882	]
883	);
884
885	$this->add_control(
886	'eael_simple_menu_item_color',
887	[
888	'label' => __('Text Color', 'essential-addons-for-elementor-lite'),
889	'type' => Controls_Manager::COLOR,
890	// 'default' => '#ffffff',
891	'selectors' => [
892	'{{WRAPPER}} .eael-simple-menu li > a' => 'color: {{VALUE}}',
893	'{{WRAPPER}} .eael-simple-menu li > a > span svg' => 'fill: {{VALUE}}',
894	'{{WRAPPER}} .eael-simple-menu-toggle-text' => 'color: {{VALUE}}',
895	],
896	]
897	);
898
899	$this->add_control(
900	'eael_simple_menu_item_background',
901	[
902	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
903	'type' => Controls_Manager::COLOR,
904	'default' => '',
905	'selectors' => [
906	'{{WRAPPER}} .eael-simple-menu li > a' => 'background-color: {{VALUE}}',
907	],
908	]
909	);
910
911	$this->add_control(
912	'eael_simple_menu_item_indicator_heading',
913	[
914	'label' => __('Dropdown Indicator', 'essential-addons-for-elementor-lite'),
915	'type' => Controls_Manager::HEADING,
916	'separator' => 'before',
917	]
918	);
919
920	$this->add_control(
921	'eael_simple_menu_item_indicator',
922	[
923	'label' => __('Icon', 'essential-addons-for-elementor-lite'),
924	'type' => Controls_Manager::ICONS,
925	'recommended' => [
926	'fa-solid' => [
927	'fas fa-angle-down',
928	]
929	],
930	'default' => [
931	'value' => 'fas fa-angle-down',
932	'library' => 'fa-solid',
933	],
934	]
935	);
936
937	$this->add_control(
938	'eael_simple_menu_item_indicator_size',
939	[
940	'label' => esc_html__( 'Icon Size', 'essential-addons-for-elementor-lite' ),
941	'type' => Controls_Manager::SLIDER,
942	'default' => [
943	'size' => '15'
944	],
945	'range' => [
946	'px' => [
947	'max' => 30,
948	],
949	],
950	'selectors' => [
951	'{{WRAPPER}} .eael-simple-menu li a span, {{WRAPPER}} .eael-simple-menu li span.eael-simple-menu-indicator' => 'font-size: {{SIZE}}{{UNIT}};',
952	'{{WRAPPER}} .eael-simple-menu li a span, {{WRAPPER}} .eael-simple-menu li span.eael-simple-menu-indicator i' => 'font-size: {{SIZE}}{{UNIT}};',
953	'{{WRAPPER}} .eael-simple-menu li span.eael-simple-menu-indicator svg' => 'width: {{SIZE}}{{UNIT}};height:{{SIZE}}{{UNIT}};line-height:{{SIZE}}{{UNIT}};',
954	'{{WRAPPER}} .eael-simple-menu li span svg' => 'width: {{SIZE}}{{UNIT}};height:{{SIZE}}{{UNIT}};line-height:{{SIZE}}{{UNIT}};',
955	],
956	]
957	);
958
959	$this->add_control(
960	'eael_simple_menu_item_indicator_note',
961	[
962	'label' => __('Important Note', 'essential-addons-for-elementor-lite'),
963	'show_label' => false,
964	'type' => Controls_Manager::RAW_HTML,
965	'raw' => __('<div style="font-size: 11px;font-style:italic;line-height:1.4;color:#a4afb7;">Following options are only available in the <span style="color:#d30c5c"><strong>Small</strong></span> screens for <span style="color:#d30c5c"><strong>Horizontal</strong></span> Layout, and all screens for <span style="color:#d30c5c"><strong>Vertical</strong></span> Layout</div>', 'essential-addons-for-elementor-lite'),
966	]
967	);
968
969	$this->add_control(
970	'eael_simple_menu_item_indicator_color',
971	[
972	'label' => __('Color', 'essential-addons-for-elementor-lite'),
973	'type' => Controls_Manager::COLOR,
974	'selectors' => [
975	'{{WRAPPER}} .eael-simple-menu li a span' => 'color: {{VALUE}} !important',
976	'{{WRAPPER}} .eael-simple-menu li a span svg path' => 'fill: {{VALUE}} !important',
977	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator:before' => 'color: {{VALUE}} !important',
978	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator i' => 'color: {{VALUE}} !important',
979	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator svg path' => 'fill: {{VALUE}} !important',
980	],
981	]
982	);
983
984	$this->add_control(
985	'eael_simple_menu_item_indicator_background',
986	[
987	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
988	'type' => Controls_Manager::COLOR,
989	'selectors' => [
990	'{{WRAPPER}} .eael-simple-menu li a span' => 'background-color: {{VALUE}} !important',
991	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator' => 'background-color: {{VALUE}} !important',
992	],
993	]
994	);
995
996	$this->add_control(
997	'eael_simple_menu_item_indicator_border',
998	[
999	'label' => __('Border Color', 'essential-addons-for-elementor-lite'),
1000	'type' => Controls_Manager::COLOR,
1001	'selectors' => [
1002	'{{WRAPPER}} .eael-simple-menu li a span' => 'border-color: {{VALUE}} !important',
1003	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator' => 'border-color: {{VALUE}} !important',
1004	],
1005	]
1006	);
1007
1008	$this->end_controls_tab();
1009
1010	$this->start_controls_tab(
1011	'eael_simple_menu_top_level_item_hover',
1012	[
1013	'label' => __('Hover', 'essential-addons-for-elementor-lite'),
1014	]
1015	);
1016
1017	$this->add_control(
1018	'eael_simple_menu_item_color_hover',
1019	[
1020	'label' => __('Text Color', 'essential-addons-for-elementor-lite'),
1021	'type' => Controls_Manager::COLOR,
1022	// 'default' => '#ffffff',
1023	'selectors' => [
1024	'{{WRAPPER}} .eael-simple-menu li:hover > a' => 'color: {{VALUE}}',
1025	'{{WRAPPER}} .eael-simple-menu li:hover > a > span svg' => 'fill: {{VALUE}}',
1026	],
1027	]
1028	);
1029
1030	$this->add_control(
1031	'eael_simple_menu_item_background_hover',
1032	[
1033	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
1034	'type' => Controls_Manager::COLOR,
1035	// 'default' => '#ee355f',
1036	'selectors' => [
1037	'{{WRAPPER}} .eael-simple-menu li:hover > a' => 'background-color: {{VALUE}}',
1038	],
1039	]
1040	);
1041
1042	$this->add_control(
1043	'eael_simple_menu_item_hover_indicator_heading',
1044	[
1045	'label' => __('Dropdown Indicator', 'essential-addons-for-elementor-lite'),
1046	'type' => Controls_Manager::HEADING,
1047	'separator' => 'before',
1048	]
1049	);
1050
1051	$this->add_control(
1052	'eael_simple_menu_item_hover_indicator_note',
1053	[
1054	'label' => __('Important Note', 'essential-addons-for-elementor-lite'),
1055	'show_label' => false,
1056	'type' => Controls_Manager::RAW_HTML,
1057	'raw' => __('<div style="font-size: 11px;font-style:italic;line-height:1.4;color:#a4afb7;">Following options are only available in the <span style="color:#d30c5c"><strong>Small</strong></span> screens for <span style="color:#d30c5c"><strong>Horizontal</strong></span> Layout, and all screens for <span style="color:#d30c5c"><strong>Vertical</strong></span> Layout</div>', 'essential-addons-for-elementor-lite'),
1058
1059	]
1060	);
1061
1062	$this->add_control(
1063	'eael_simple_menu_item_indicator_color_hover',
1064	[
1065	'label' => __('Color', 'essential-addons-for-elementor-lite'),
1066	'type' => Controls_Manager::COLOR,
1067	'default' => '#f44336',
1068	'selectors' => [
1069	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator:hover:before' => 'color: {{VALUE}}',
1070	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator:hover i' => 'color: {{VALUE}}',
1071	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator:hover svg' => 'fill: {{VALUE}}', ],
1072	]
1073	);
1074
1075	$this->add_control(
1076	'eael_simple_menu_item_indicator_background_hover',
1077	[
1078	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
1079	'type' => Controls_Manager::COLOR,
1080	'default' => '#ffffff',
1081	'selectors' => [
1082	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator:hover' => 'background-color: {{VALUE}}',
1083	],
1084	]
1085	);
1086
1087	$this->add_control(
1088	'eael_simple_menu_item_indicator_border_hover',
1089	[
1090	'label' => __('Border Color', 'essential-addons-for-elementor-lite'),
1091	'type' => Controls_Manager::COLOR,
1092	'default' => '#f44336',
1093	'selectors' => [
1094	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator:hover' => 'border-color: {{VALUE}}',
1095	],
1096	]
1097	);
1098
1099	$this->end_controls_tab();
1100
1101	$this->start_controls_tab(
1102	'eael_simple_menu_top_level_item_active',
1103	[
1104	'label' => __('Active', 'essential-addons-for-elementor-lite'),
1105	]
1106	);
1107
1108	$this->add_control(
1109	'eael_simple_menu_item_color_active',
1110	[
1111	'label' => __('Text Color', 'essential-addons-for-elementor-lite'),
1112	'type' => Controls_Manager::COLOR,
1113	// 'default' => '#ffffff',
1114	'selectors' => [
1115	'{{WRAPPER}} .eael-simple-menu li > a.eael-item-active' => 'color: {{VALUE}}',
1116	'{{WRAPPER}} .eael-simple-menu li.current-menu-item > a > span svg' => 'fill: {{VALUE}}',
1117	'{{WRAPPER}} .eael-simple-menu li.current-menu-item > a.eael-item-active' => 'color: {{VALUE}}',
1118	'{{WRAPPER}} .eael-simple-menu li.current-menu-ancestor > a.eael-item-active' => 'color: {{VALUE}}',
1119	],
1120	]
1121	);
1122
1123	$this->add_control(
1124	'eael_simple_menu_item_background_active',
1125	[
1126	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
1127	'type' => Controls_Manager::COLOR,
1128	// 'default' => '#ee355f',
1129	'selectors' => [
1130	'{{WRAPPER}} .eael-simple-menu li > a.eael-item-active' => 'background-color: {{VALUE}}',
1131	'{{WRAPPER}} .eael-simple-menu li.current-menu-item > a.eael-item-active' => 'background-color: {{VALUE}}',
1132	'{{WRAPPER}} .eael-simple-menu li.current-menu-ancestor > a.eael-item-active' => 'background-color: {{VALUE}}',
1133	],
1134	]
1135	);
1136
1137	$this->add_control(
1138	'eael_simple_menu_item_hover_indicator_heading_active',
1139	[
1140	'label' => __('Dropdown Indicator', 'essential-addons-for-elementor-lite'),
1141	'type' => Controls_Manager::HEADING,
1142	'separator' => 'before',
1143	]
1144	);
1145
1146	$this->add_control(
1147	'eael_simple_menu_item_hover_indicator_note_active',
1148	[
1149	'label' => __('Important Note', 'essential-addons-for-elementor-lite'),
1150	'show_label' => false,
1151	'type' => Controls_Manager::RAW_HTML,
1152	'raw' => __('<div style="font-size: 11px;font-style:italic;line-height:1.4;color:#a4afb7;">Following options are only available in the <span style="color:#d30c5c"><strong>Small</strong></span> screens for <span style="color:#d30c5c"><strong>Horizontal</strong></span> Layout, and all screens for <span style="color:#d30c5c"><strong>Vertical</strong></span> Layout</div>', 'essential-addons-for-elementor-lite'),
1153
1154	]
1155	);
1156
1157	$this->add_control(
1158	'eael_simple_menu_item_indicator_color_active',
1159	[
1160	'label' => __('Color', 'essential-addons-for-elementor-lite'),
1161	'type' => Controls_Manager::COLOR,
1162	'default' => '#f44336',
1163	'selectors' => [
1164	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator.eael-simple-menu-indicator-open:before' => 'color: {{VALUE}} !important',
1165	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator.eael-simple-menu-indicator-open svg' => 'fill: {{VALUE}} !important',
1166	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator.eael-simple-menu-indicator-open i' => 'color: {{VALUE}} !important', ],
1167	]
1168	);
1169
1170	$this->add_control(
1171	'eael_simple_menu_item_indicator_background_active',
1172	[
1173	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
1174	'type' => Controls_Manager::COLOR,
1175	'default' => '#ffffff',
1176	'selectors' => [
1177	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator.eael-simple-menu-indicator-open' => 'background-color: {{VALUE}} !important',
1178	],
1179	]
1180	);
1181
1182	$this->add_control(
1183	'eael_simple_menu_item_indicator_border_active',
1184	[
1185	'label' => __('Border Color', 'essential-addons-for-elementor-lite'),
1186	'type' => Controls_Manager::COLOR,
1187	'default' => '#f44336',
1188	'selectors' => [
1189	'{{WRAPPER}} .eael-simple-menu li .eael-simple-menu-indicator.eael-simple-menu-indicator-open' => 'border-color: {{VALUE}} !important',
1190	],
1191	]
1192	);
1193
1194	$this->end_controls_tab();
1195
1196	$this->end_controls_tabs();
1197
1198	$this->end_controls_section();
1199
1200	}
1201
1202	protected function style_dropdown_item()
1203	{
1204	$this->start_controls_section(
1205	'eael_simple_menu_section_style_dropdown_item',
1206	[
1207	'label' => __('Dropdown Item', 'essential-addons-for-elementor-lite'),
1208	'tab' => Controls_Manager::TAB_STYLE,
1209	]
1210	);
1211
1212	$this->add_control(
1213	'eael_simple_menu_dropdown_item_alignment',
1214	[
1215	'label' => __('Alignment', 'essential-addons-for-elementor-lite'),
1216	'type' => Controls_Manager::CHOOSE,
1217	'options' => [
1218	'eael-simple-menu-dropdown-align-left' => [
1219	'title' => __('Left', 'essential-addons-for-elementor-lite'),
1220	'icon' => 'eicon-text-align-left',
1221	],
1222	'eael-simple-menu-dropdown-align-center' => [
1223	'title' => __('Center', 'essential-addons-for-elementor-lite'),
1224	'icon' => 'eicon-text-align-center',
1225	],
1226	'eael-simple-menu-dropdown-align-right' => [
1227	'title' => __('Right', 'essential-addons-for-elementor-lite'),
1228	'icon' => 'eicon-text-align-right',
1229	],
1230	],
1231	'default' => 'eael-simple-menu-dropdown-align-left',
1232	]
1233	);
1234
1235	$this->add_responsive_control(
1236	'eael_simple_menu_dropdown_item_padding',
1237	[
1238	'label' => __('Padding', 'essential-addons-for-elementor-lite'),
1239	'type' => Controls_Manager::SLIDER,
1240	'size_units' => ['px'],
1241	'range' => [
1242	'px' => [
1243	'min' => 0,
1244	'max' => 100,
1245	'step' => 1,
1246	],
1247	],
1248	'default' => [
1249	'unit' => 'px',
1250	'size' => 20,
1251	],
1252	'selectors' => [
1253	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-horizontal li ul li a' => 'padding-left: {{SIZE}}{{UNIT}}; padding-right: {{SIZE}}{{UNIT}};',
1254	],
1255	]
1256	);
1257
1258	$this->add_control(
1259	'eael_simple_menu_dropdown_item_divider_color',
1260	[
1261	'label' => __('Divider Color', 'essential-addons-for-elementor-lite'),
1262	'type' => Controls_Manager::COLOR,
1263	'default' => '#f2f2f2',
1264	'selectors' => [
1265	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-horizontal li ul li > a' => 'border-bottom: 1px solid {{VALUE}}',
1266	'{{WRAPPER}} .eael-simple-menu.eael-simple-menu-vertical li ul li > a' => 'border-bottom: 1px solid {{VALUE}}',
1267	],
1268	]
1269	);
1270
1271	$this->add_group_control(
1272	Group_Control_Typography::get_type(),
1273	[
1274	'name' => 'eael_simple_menu_dropdown_item_typography',
1275	'label' => __('Typography', 'essential-addons-for-elementor-lite'),
1276	'global' => [
1277	'default' => Global_Typography::TYPOGRAPHY_PRIMARY
1278	],
1279	'selector' => '{{WRAPPER}} .eael-simple-menu li ul li > a',
1280	]
1281	);
1282
1283	$this->start_controls_tabs('eael_simple_menu_dropdown_item');
1284
1285	$this->start_controls_tab(
1286	'eael_simple_menu_dropdown_item_default',
1287	[
1288	'label' => __('Default', 'essential-addons-for-elementor-lite'),
1289	]
1290	);
1291
1292	$this->add_control(
1293	'eael_simple_menu_dropdown_item_color',
1294	[
1295	'label' => __('Text Color', 'essential-addons-for-elementor-lite'),
1296	'type' => Controls_Manager::COLOR,
1297	// 'default' => '#000000',
1298	'selectors' => [
1299	'{{WRAPPER}} .eael-simple-menu li ul li > a' => 'color: {{VALUE}}',
1300	],
1301	]
1302	);
1303
1304	$this->add_control(
1305	'eael_simple_menu_dropdown_item_background',
1306	[
1307	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
1308	'type' => Controls_Manager::COLOR,
1309	// 'default' => 'rgba(255,255,255,0)',
1310	'selectors' => [
1311	'{{WRAPPER}} .eael-simple-menu li ul li > a' => 'background-color: {{VALUE}}',
1312	],
1313	]
1314	);
1315
1316	$this->add_control(
1317	'eael_simple_menu_dropdown_item_indicator_heading',
1318	[
1319	'label' => __('Dropdown Indicator', 'essential-addons-for-elementor-lite'),
1320	'type' => Controls_Manager::HEADING,
1321	'separator' => 'before',
1322	]
1323	);
1324
1325	$this->add_control(
1326	'eael_simple_menu_dropdown_item_indicator',
1327	[
1328	'label' => __('Icon', 'essential-addons-for-elementor-lite'),
1329	'type' => Controls_Manager::ICONS,
1330	'recommended' => [
1331	'fa-solid' => [
1332	'fas fa-angle-down',
1333	]
1334	],
1335	'default' => [
1336	'value' => 'fas fa-angle-down',
1337	'library' => 'fa-solid',
1338	],
1339	]
1340	);
1341
1342	$this->add_control(
1343	'eael_simple_menu_dropdown_item_indicator_size',
1344	[
1345	'label' => esc_html__( 'Icon Size', 'essential-addons-for-elementor-lite' ),
1346	'type' => Controls_Manager::SLIDER,
1347	'default' => [
1348	'size' => '12'
1349	],
1350	'range' => [
1351	'px' => [
1352	'max' => 30,
1353	],
1354	],
1355	'selectors' => [
1356	'{{WRAPPER}} .eael-simple-menu li ul li a span' => 'font-size: {{SIZE}}{{UNIT}};',
1357	'{{WRAPPER}} .eael-simple-menu li ul li span.eael-simple-menu-indicator' => 'font-size: {{SIZE}}{{UNIT}};',
1358	'{{WRAPPER}} .eael-simple-menu li ul li span.eael-simple-menu-indicator i' => 'font-size: {{SIZE}}{{UNIT}};',
1359	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator svg' => 'width: {{SIZE}}{{UNIT}};height: {{SIZE}}{{UNIT}};line-height: {{SIZE}}{{UNIT}};',
1360	],
1361	]
1362	);
1363
1364	$this->add_control(
1365	'eael_simple_menu_dropdown_item_indicator_note',
1366	[
1367	'label' => __('Important Note', 'essential-addons-for-elementor-lite'),
1368	'show_label' => false,
1369	'type' => Controls_Manager::RAW_HTML,
1370	'raw' => __('<div style="font-size: 11px;font-style:italic;line-height:1.4;color:#a4afb7;">Following options are only available in the <span style="color:#d30c5c"><strong>Small</strong></span> screens for <span style="color:#d30c5c"><strong>Horizontal</strong></span> Layout, and all screens for <span style="color:#d30c5c"><strong>Vertical</strong></span> Layout</div>', 'essential-addons-for-elementor-lite'),
1371	]
1372	);
1373
1374	$this->add_control(
1375	'eael_simple_menu_dropdown_item_indicator_color',
1376	[
1377	'label' => __('Color', 'essential-addons-for-elementor-lite'),
1378	'type' => Controls_Manager::COLOR,
1379	'selectors' => [
1380	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator:before' => 'color: {{VALUE}} !important',
1381	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator svg' => 'fill: {{VALUE}} !important',
1382	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator i' => 'color: {{VALUE}} !important',
1383	'{{WRAPPER}} .eael-simple-menu li ul li a span.eael-simple-menu-dropdown-indicator' => 'color: {{VALUE}} !important',
1384	],
1385	]
1386	);
1387
1388	$this->add_control(
1389	'eael_simple_menu_dropdown_item_indicator_background',
1390	[
1391	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
1392	'type' => Controls_Manager::COLOR,
1393	'selectors' => [
1394	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator' => 'background-color: {{VALUE}} !important',
1395	'{{WRAPPER}} .eael-simple-menu li ul li a span.eael-simple-menu-dropdown-indicator' => 'background-color: {{VALUE}} !important',
1396	],
1397	]
1398	);
1399
1400	$this->add_control(
1401	'eael_simple_menu_dropdown_item_indicator_border',
1402	[
1403	'label' => __('Border Color', 'essential-addons-for-elementor-lite'),
1404	'type' => Controls_Manager::COLOR,
1405	'selectors' => [
1406	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator' => 'border-color: {{VALUE}} !important',
1407	'{{WRAPPER}} .eael-simple-menu li ul li a span.eael-simple-menu-dropdown-indicator' => 'border-color: {{VALUE}} !important',
1408	],
1409	]
1410	);
1411
1412	$this->end_controls_tab();
1413
1414	$this->start_controls_tab(
1415	'eael_simple_menu_dropdown_item_hover',
1416	[
1417	'label' => __('Hover', 'essential-addons-for-elementor-lite'),
1418	]
1419	);
1420
1421	$this->add_control(
1422	'eael_simple_menu_dropdown_item_color_hover',
1423	[
1424	'label' => __('Text Color', 'essential-addons-for-elementor-lite'),
1425	'type' => Controls_Manager::COLOR,
1426	// 'default' => '#ee355f',
1427	'selectors' => [
1428	'{{WRAPPER}} .eael-simple-menu li ul li:hover > a' => 'color: {{VALUE}}',
1429	'{{WRAPPER}} .eael-simple-menu li ul li.current-menu-item > a.eael-item-active' => 'color: {{VALUE}}',
1430	'{{WRAPPER}} .eael-simple-menu li ul li.current-menu-ancestor > a.eael-item-active' => 'color: {{VALUE}}',
1431	],
1432	]
1433	);
1434
1435	$this->add_control(
1436	'eael_simple_menu_dropdown_item_background_hover',
1437	[
1438	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
1439	'type' => Controls_Manager::COLOR,
1440	// 'default' => 'rgba(255,255,255,0)',
1441	'selectors' => [
1442	'{{WRAPPER}} .eael-simple-menu li ul li:hover > a' => 'background-color: {{VALUE}}',
1443	'{{WRAPPER}} .eael-simple-menu li ul li.current-menu-item > a.eael-item-active' => 'background-color: {{VALUE}}',
1444	'{{WRAPPER}} .eael-simple-menu li ul li.current-menu-ancestor > a.eael-item-active' => 'background-color: {{VALUE}}',
1445	],
1446	]
1447	);
1448
1449	$this->add_control(
1450	'eael_simple_menu_dropdown_item_hover_indicator_heading',
1451	[
1452	'label' => __('Dropdown Indicator', 'essential-addons-for-elementor-lite'),
1453	'type' => Controls_Manager::HEADING,
1454	'separator' => 'before',
1455	]
1456	);
1457
1458	$this->add_control(
1459	'eael_simple_menu_dropdown_item_hover_indicator_note',
1460	[
1461	'label' => __('Important Note', 'essential-addons-for-elementor-lite'),
1462	'show_label' => false,
1463	'type' => Controls_Manager::RAW_HTML,
1464	'raw' => __('<div style="font-size: 11px;font-style:italic;line-height:1.4;color:#a4afb7;">Following options are only available in the <span style="color:#d30c5c"><strong>Small</strong></span> screens for <span style="color:#d30c5c"><strong>Horizontal</strong></span> Layout, and all screens for <span style="color:#d30c5c"><strong>Vertical</strong></span> Layout</div>', 'essential-addons-for-elementor-lite'),
1465
1466	]
1467	);
1468
1469	$this->add_control(
1470	'eael_simple_menu_dropdown_item_indicator_color_hover',
1471	[
1472	'label' => __('Color', 'essential-addons-for-elementor-lite'),
1473	'type' => Controls_Manager::COLOR,
1474	'default' => '#f44336',
1475	'selectors' => [
1476	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator:hover:before' => 'color: {{VALUE}} !important',
1477	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator.eael-simple-menu-indicator-open:before' => 'color: {{VALUE}} !important',
1478	],
1479	]
1480	);
1481
1482	$this->add_control(
1483	'eael_simple_menu_dropdown_item_indicator_background_hover',
1484	[
1485	'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
1486	'type' => Controls_Manager::COLOR,
1487	'default' => '#ffffff',
1488	'selectors' => [
1489	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator:hover' => 'background-color: {{VALUE}} !important',
1490	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator.eael-simple-menu-indicator-open' => 'background-color: {{VALUE}} !important',
1491	],
1492	]
1493	);
1494
1495	$this->add_control(
1496	'eael_simple_menu_dropdown_item_indicator_border_hover',
1497	[
1498	'label' => __('Border Color', 'essential-addons-for-elementor-lite'),
1499	'type' => Controls_Manager::COLOR,
1500	'default' => '#f44336',
1501	'selectors' => [
1502	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator:hover' => 'border-color: {{VALUE}} !important',
1503	'{{WRAPPER}} .eael-simple-menu li ul li .eael-simple-menu-indicator.eael-simple-menu-indicator-open' => 'border-color: {{VALUE}} !important',
1504	],
1505	]
1506	);
1507
1508	$this->end_controls_tab();
1509
1510	$this->end_controls_tabs();
1511
1512	$this->end_controls_section();
1513	}
1514
1515	public function get_dropdown_options(){
1516	$breakpoints = Plugin::$instance->breakpoints->get_active_breakpoints();
1517
1518	$dropdown_options = [];
1519	$excluded_breakpoints = [
1520	'laptop',
1521	'widescreen',
1522	];
1523
1524	foreach ( $breakpoints as $breakpoint_key => $breakpoint_instance ) {
1525	// Do not include laptop and widscreen in the options since this feature is for mobile devices.
1526	if ( in_array( $breakpoint_key, $excluded_breakpoints, true ) ) {
1527	continue;
1528	}
1529
1530	$dropdown_options[ $breakpoint_key ] = sprintf(
1531	/* translators: 1: Breakpoint label, 2: `>` character, 3: Breakpoint value */
1532	esc_html__( '%1$s (%2$s %3$dpx)', 'essential-addons-for-elementor-lite' ),
1533	$breakpoint_instance->get_label(),
1534	'>',
1535	$breakpoint_instance->get_value()
1536	);
1537	}
1538
1539	$dropdown_options['desktop'] = esc_html__( 'Desktop (> 2400px)', 'essential-addons-for-elementor-lite' );
1540	$dropdown_options['none'] = esc_html__( 'None', 'essential-addons-for-elementor-lite' );
1541
1542	return $dropdown_options;
1543	}
1544
1545	protected function render()
1546	{
1547	$settings = $this->get_settings();
1548	$hamburger_device = !empty( $settings['eael_simple_menu_dropdown'] ) ? esc_html( $settings['eael_simple_menu_dropdown'] ) : esc_html( 'tablet' );
1549
1550	if ( $settings['eael_simple_menu_preset'] == 'preset-2' ) {
1551	$align = $settings['eael_simple_menu_item_alignment_center'];
1552	} elseif ( $settings['eael_simple_menu_preset'] == 'preset-3' ) {
1553	$align = $settings['eael_simple_menu_item_alignment_right'];
1554	} else {
1555	$align = $settings['eael_simple_menu_item_alignment'];
1556	}
1557
1558	if ( $settings['eael_simple_menu_full_width'] == 'yes' ) {
1559	$fullWidth = 'eael-simple-menu--stretch';
1560	} else {
1561	$fullWidth = '';
1562	}
1563
1564	$menu_classes = ['eael-simple-menu', $settings['eael_simple_menu_dropdown_animation'], 'eael-simple-menu-indicator', $settings['eael_hamburger_menu_item_alignment']];
1565	$container_classes = ['eael-simple-menu-container', $align, $fullWidth, $settings['eael_simple_menu_dropdown_item_alignment'], $settings['eael_simple_menu_preset']];
1566
1567	if ($settings['eael_simple_menu_layout'] == 'horizontal') {
1568	$menu_classes[] = 'eael-simple-menu-horizontal';
1569	} else {
1570	$menu_classes[] = 'eael-simple-menu-vertical';
1571	}
1572
1573	if (isset($settings['eael_simple_menu_item_dropdown_indicator']) && $settings['eael_simple_menu_item_dropdown_indicator'] == 'yes') {
1574	$menu_classes[] = 'eael-simple-menu-indicator';
1575	}
1576
1577	if (isset($settings['eael_simple_menu_hamburger_icon'])) {
1578	ob_start();
1579	Icons_Manager::render_icon( $settings['eael_simple_menu_hamburger_icon'], [ 'aria-hidden' => 'true' ] );
1580	$hamburger_icon = ob_get_clean();
1581	$this->add_render_attribute( 'eael-simple-menu', 'data-hamburger-icon', $hamburger_icon );
1582	}
1583
1584	ob_start();
1585	Icons_Manager::render_icon( $settings['eael_simple_menu_item_indicator'], [ 'aria-hidden' => 'true' ] );
1586	$indicator_icon = ob_get_clean();
1587	$this->add_render_attribute( 'eael-simple-menu', 'data-indicator-icon', $indicator_icon );
1588
1589	ob_start();
1590	Icons_Manager::render_icon( $settings['eael_simple_menu_dropdown_item_indicator'] );
1591	$dropdown_indicator_icon = ob_get_clean();
1592	$this->add_render_attribute( 'eael-simple-menu', 'data-dropdown-indicator-icon', $dropdown_indicator_icon );
1593
1594	$this->add_render_attribute( 'eael-simple-menu', [
1595	'class' => implode( ' ', array_filter( $container_classes ) ),
1596	'data-hamburger-breakpoints' => wp_json_encode( $this->get_dropdown_options() ),
1597	'data-hamburger-device' => $hamburger_device,
1598	] );
1599
1600	if ($settings['eael_simple_menu_menu']) {
1601	$args = [
1602	'menu' => $settings['eael_simple_menu_menu'],
1603	'menu_class' => implode(' ', array_filter($menu_classes)),
1604	'fallback_cb' => '__return_empty_string',
1605	'container' => false,
1606	'echo' => false,
1607	];
1608
1609	//Check breakpoint form hamburger options
1610	if ( ! empty( $hamburger_device ) && 'none' !== $hamburger_device ) {
1611	if ( 'desktop' === $hamburger_device ) {
1612	$breakpoints = method_exists( Plugin::$instance->breakpoints, 'get_breakpoints_config' ) ? Plugin::$instance->breakpoints->get_breakpoints_config() : [];
1613	$eael_get_breakpoint_from_option = isset( $breakpoints['widescreen'] ) ? $breakpoints['widescreen']['value'] - 1 : 2400;
1614	} else {
1615	$eael_get_breakpoint_from_option = Plugin::$instance->breakpoints->get_breakpoints( $hamburger_device )->get_value();
1616	}
1617
1618	echo "<style>
1619	@media screen and (max-width: " . esc_html( $eael_get_breakpoint_from_option ) . "px) {
1620	.eael-hamburger--" . esc_html( $hamburger_device ) . " {
1621	.eael-simple-menu-horizontal,
1622	.eael-simple-menu-vertical {
1623	display: none;
1624	}
1625	}
1626	.eael-hamburger--" . esc_html( $hamburger_device ) . " {
1627	.eael-simple-menu-container .eael-simple-menu-toggle {
1628	display: block;
1629	}
1630	}
1631	}
1632	</style>";
1633	}
1634	?>
1635	<div <?php $this->print_render_attribute_string('eael-simple-menu'); ?>>
1636	<?php echo wp_nav_menu( $args ); ?>
1637	<button class="eael-simple-menu-toggle">
1638	<span class="sr-only "><?php esc_html_e( 'Hamburger Toggle Menu', 'essential-addons-for-elementor-lite' ); ?></span>
1639	<?php Icons_Manager::render_icon( $settings['eael_simple_menu_hamburger_icon'], [ 'aria-hidden' => 'true' ] ); ?>
1640	</button>
1641	</div>
1642	<?php
1643	}
1644	}
1645
1646	}
1647