heading-modern.php — Shortcodes and extra features for Phlox theme 2.17.14

auxin-elements / includes / elementor / widgets / heading-modern.php

auxin-elements / includes / elementor / widgets Last commit date

heading-modern.php

1257 lines

1	<?php
2	namespace Auxin\Plugin\CoreElements\Elementor\Elements;
3
4	use Elementor\Plugin;
5	use Elementor\Widget_Base;
6	use Elementor\Controls_Manager;
7	use Elementor\Group_Control_Typography;
8	use Elementor\Group_Control_Text_Stroke;
9	use Elementor\Core\Kits\Documents\Tabs\Global_Typography;
10	use Elementor\Group_Control_Box_Shadow;
11	use Elementor\Group_Control_Text_Shadow;
12	use Elementor\Group_Control_Background;
13
14
15	if ( ! defined( 'ABSPATH' ) ) {
16	exit; // Exit if accessed directly.
17	}
18
19	/**
20	* Elementor 'ModernHeading' widget.
21	*
22	* Elementor widget that displays an 'ModernHeading' with lightbox.
23	*
24	* @since 1.0.0
25	*/
26	class ModernHeading extends Widget_Base {
27
28	public $allowed_tags = [
29	'h1' => 'H1',
30	'h2' => 'H2',
31	'h3' => 'H3',
32	'h4' => 'H4',
33	'h5' => 'H5',
34	'h6' => 'H6',
35	'div' => 'div',
36	'span' => 'span',
37	'p' => 'p'
38	];
39
40	/**
41	* Get widget name.
42	*
43	* Retrieve 'ModernHeading' widget name.
44	*
45	* @since 1.0.0
46	* @access public
47	*
48	* @return string Widget name.
49	*/
50	public function get_name() {
51	return 'aux_modern_heading';
52	}
53
54	/**
55	* Get widget title.
56	*
57	* Retrieve 'ModernHeading' widget title.
58	*
59	* @since 1.0.0
60	* @access public
61	*
62	* @return string Widget title.
63	*/
64	public function get_title() {
65	return __('Modern Heading', 'auxin-elements' );
66	}
67
68	public function has_widget_inner_wrapper(): bool {
69	return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
70	}
71
72
73	/**
74	* Get widget icon.
75	*
76	* Retrieve 'ModernHeading' widget icon.
77	*
78	* @since 1.0.0
79	* @access public
80	*
81	* @return string Widget icon.
82	*/
83	public function get_icon() {
84	return 'eicon-heading auxin-badge';
85	}
86
87	/**
88	* Get widget categories.
89	*
90	* Retrieve 'ModernHeading' widget icon.
91	*
92	* @since 1.0.0
93	* @access public
94	*
95	* @return string Widget icon.
96	*/
97	public function get_categories() {
98	return array( 'auxin-core' );
99	}
100
101	/**
102	* Register 'ModernHeading' widget controls.
103	*
104	* Adds different input fields to allow the user to change and customize the widget settings.
105	*
106	* @since 1.0.0
107	* @access protected
108	*/
109	protected function register_controls() {
110
111	/-----------------------------------------------------------------------------------/
112	/* Content TAB
113	/-----------------------------------------------------------------------------------/
114
115	$this->start_controls_section(
116	'title_section',
117	array(
118	'label' => __('Heading', 'auxin-elements' ),
119	)
120	);
121
122	$this->add_control(
123	'title',
124	array(
125	'label' => __( 'Title', 'auxin-elements' ),
126	'type' => Controls_Manager::TEXTAREA,
127	'dynamic' => array(
128	'active' => true
129	),
130	'default' => __( 'Add your heading text here ..', 'auxin-elements' ),
131	'label_block' => true
132	)
133	);
134
135	$this->add_control(
136	'link',
137	array(
138	'label' => __('Link','auxin-elements' ),
139	'type' => Controls_Manager::URL,
140	'placeholder' => 'http://your-link.com',
141	'show_external' => true,
142	'label_block' => true,
143	'dynamic' => array(
144	'active' => true
145	)
146	)
147	);
148
149	$this->add_control(
150	'title_tag',
151	array(
152	'label' => __( 'HTML Tag', 'auxin-elements' ),
153	'type' => Controls_Manager::SELECT,
154	'options' => $this->allowed_tags,
155	'default' => 'h2',
156	)
157	);
158
159	$this->add_responsive_control(
160	'alignment',
161	array(
162	'label' => __('Alignment', 'auxin-elements'),
163	'type' => Controls_Manager::CHOOSE,
164	'default' => '',
165	'options' => array(
166	'left' => array(
167	'title' => __( 'Left', 'auxin-elements' ),
168	'icon' => 'eicon-text-align-left',
169	),
170	'center' => array(
171	'title' => __( 'Center', 'auxin-elements' ),
172	'icon' => 'eicon-text-align-center',
173	),
174	'right' => array(
175	'title' => __( 'Right', 'auxin-elements' ),
176	'icon' => 'eicon-text-align-right',
177	)
178	),
179	'selectors_dictionary' => [
180	'left' => '',
181	'center' => 'text-align:center;margin-left:auto !important;margin-right:auto !important;',
182	'right' => 'text-align:right;margin-left:auto !important;'
183	],
184	'selectors' => [
185	'{{WRAPPER}} .aux-widget-inner > *' => '{{VALUE}}'
186	]
187	)
188	);
189
190	/* Divider
191	/-------------------------------------/
192
193	$this->add_control(
194	'divider',
195	array(
196	'label' => __( 'Display Divider', 'auxin-elements' ),
197	'type' => Controls_Manager::SWITCHER,
198	'label_on' => __( 'On', 'auxin-elements' ),
199	'label_off' => __( 'Off', 'auxin-elements' ),
200	'return_value' => 'yes',
201	'default' => 'yes',
202	'separator' => 'before'
203	)
204	);
205
206	$this->add_control(
207	'divider_position',
208	array(
209	'label' => __( 'Divider Position', 'auxin-elements' ),
210	'type' => Controls_Manager::SELECT,
211	'options' => array(
212	'before' => __( 'Before Heading', 'auxin-elements' ),
213	'between' => __( 'Between Headings', 'auxin-elements' ),
214	'after' => __( 'After Headings', 'auxin-elements' )
215	),
216	'default' => 'after',
217	'condition' => array(
218	'divider' => 'yes'
219	)
220	)
221	);
222
223	$this->end_controls_section();
224
225
226	/* Secondary heading
227	/-------------------------------------/
228
229	$this->start_controls_section(
230	'title_secondary_section',
231	array(
232	'label' => __('Secondary Heading', 'auxin-elements' ),
233	)
234	);
235
236	$this->add_control(
237	'title_secondary_before',
238	array(
239	'label' => __( 'Before Text', 'auxin-elements' ),
240	'type' => Controls_Manager::TEXT,
241	'dynamic' => array(
242	'active' => true
243	),
244	'default' => '',
245	'label_block' => true
246	)
247	);
248
249	$this->add_control(
250	'title_secondary_highlight',
251	array(
252	'label' => __( 'Highlighted Text', 'auxin-elements' ),
253	'type' => Controls_Manager::TEXT,
254	'dynamic' => array(
255	'active' => true
256	),
257	'default' => '',
258	'label_block' => true
259	)
260	);
261
262	$this->add_control(
263	'title_secondary_after',
264	array(
265	'label' => __( 'After Text', 'auxin-elements' ),
266	'type' => Controls_Manager::TEXT,
267	'dynamic' => array(
268	'active' => true
269	),
270	'default' => '',
271	'label_block' => true
272	)
273	);
274
275	$this->add_control(
276	'link_secondary',
277	array(
278	'label' => __('Link','auxin-elements' ),
279	'type' => Controls_Manager::URL,
280	'placeholder' => 'http://your-link.com',
281	'show_external' => true,
282	'label_block' => true,
283	'dynamic' => array(
284	'active' => true
285	)
286	)
287	);
288
289	$this->add_control(
290	'title_tag_secondary',
291	array(
292	'label' => __( 'HTML Tag', 'auxin-elements' ),
293	'type' => Controls_Manager::SELECT,
294	'options' => $this->allowed_tags,
295	'default' => 'h3'
296	)
297	);
298
299	$this->end_controls_section();
300
301	/* Description
302	/-------------------------------------/
303
304	$this->start_controls_section(
305	'description_primary_section',
306	array(
307	'label' => __('Description', 'auxin-elements' ),
308	)
309	);
310
311	$this->add_control(
312	'description',
313	array(
314	'label' => __( 'Description', 'auxin-elements' ),
315	'type' => Controls_Manager::WYSIWYG,
316	'dynamic' => array(
317	'active' => true
318	),
319	'label_block' => true,
320	'separator' => 'before'
321	)
322	);
323
324	$this->end_controls_section();
325
326
327	/-----------------------------------------------------------------------------------/
328	/* Style TAB
329	/-----------------------------------------------------------------------------------/
330
331	/* Title Section
332	/-------------------------------------/
333
334	$this->start_controls_section(
335	'title_style_section',
336	array(
337	'label' => __( 'Heading', 'auxin-elements' ),
338	'tab' => Controls_Manager::TAB_STYLE,
339	'condition' => ['title!' => '']
340	)
341	);
342
343	$this->add_group_control(
344	Group_Control_Typography::get_type(),
345	array(
346	'name' => 'title_typography',
347	'global' => [
348	'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
349	],
350	'selector' => '{{WRAPPER}} .aux-modern-heading-primary'
351	)
352	);
353
354	if ( class_exists( 'Elementor\Group_Control_Text_Stroke' ) ) {
355	$this->add_group_control(
356	Group_Control_Text_Stroke::get_type(),
357	[
358	'name' => 'title_stroke',
359	'selector' => '{{WRAPPER}} .aux-modern-heading-primary'
360	]
361	);
362	}
363
364	$this->start_controls_tabs( 'title_tabs' );
365
366	$this->start_controls_tab(
367	'title_tab_normal_state',
368	[
369	'label' => __( 'Normal', 'auxin-elements' ),
370	]
371	);
372
373	$this->add_responsive_control(
374	'title_color',
375	array(
376	'label' => __( 'Color', 'auxin-elements' ),
377	'type' => Controls_Manager::COLOR,
378	'selectors' => array(
379	'{{WRAPPER}} .aux-modern-heading-primary' => 'color: {{VALUE}};'
380	)
381	)
382	);
383
384	$this->add_group_control(
385	Group_Control_Text_Shadow::get_type(),
386	[
387	'name' => 'title_text_shadow',
388	'label' => __( 'Text Shadow', 'auxin-elements' ),
389	'selector' => '{{WRAPPER}} .aux-modern-heading-primary'
390	]
391	);
392
393	$this->add_group_control(
394	Group_Control_Background::get_type(),
395	[
396	'name' => 'title_background',
397	'selector' => '{{WRAPPER}} .aux-modern-heading-primary',
398	'types' => [ 'classic', 'gradient']
399	]
400	);
401
402	$this->end_controls_tab();
403
404	$this->start_controls_tab(
405	'title_tab_hover_state',
406	[
407	'label' => __( 'Hover', 'auxin-elements' ),
408	]
409	);
410
411	$this->add_responsive_control(
412	'title_hover_color',
413	array(
414	'label' => __( 'Color', 'auxin-elements' ),
415	'type' => Controls_Manager::COLOR,
416	'selectors' => array(
417	'{{WRAPPER}} .aux-modern-heading-primary:hover' => 'color: {{VALUE}};',
418	),
419	)
420	);
421
422	$this->add_group_control(
423	Group_Control_Text_Shadow::get_type(),
424	[
425	'name' => 'title_hover_text_shadow',
426	'label' => __( 'Text Shadow', 'auxin-elements' ),
427	'selector' => '{{WRAPPER}} .aux-modern-heading-primary:hover'
428	]
429	);
430
431	$this->add_group_control(
432	Group_Control_Background::get_type(),
433	[
434	'name' => 'title_hover_background',
435	'selector' => '{{WRAPPER}} .aux-modern-heading-primary:hover',
436	'types' => [ 'classic', 'gradient']
437	]
438	);
439
440	$this->end_controls_tab();
441
442	$this->end_controls_tabs();
443
444	$this->add_responsive_control(
445	'title_margin',
446	[
447	'label' => __( 'Margin', 'auxin-elements' ),
448	'type' => Controls_Manager::DIMENSIONS,
449	'size_units' => [ 'px', 'em', '%' ],
450	'selectors' => [
451	'{{WRAPPER}} .aux-modern-heading-primary' => 'margin:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
452	],
453	'separator' => 'before'
454	]
455	);
456
457	$this->add_responsive_control(
458	'title_padding',
459	[
460	'label' => __( 'Padding', 'auxin-elements' ),
461	'type' => Controls_Manager::DIMENSIONS,
462	'size_units' => [ 'px', 'em', '%' ],
463	'selectors' => [
464	'{{WRAPPER}} .aux-modern-heading-primary' => 'padding:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
465	]
466	]
467	);
468
469	$this->add_responsive_control(
470	'title_border_radius',
471	[
472	'label' => __( 'Border radius', 'auxin-elements' ),
473	'type' => Controls_Manager::DIMENSIONS,
474	'size_units' => [ 'px', 'em', '%' ],
475	'allowed_dimensions' => 'all',
476	'selectors' => [
477	'{{WRAPPER}} .aux-modern-heading-primary' => 'border-radius:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
478	]
479	]
480	);
481
482	$this->add_responsive_control(
483	'title_width',
484	array(
485	'label' => __('Max Width','auxin-elements' ),
486	'type' => Controls_Manager::SLIDER,
487	'size_units' => array('px', 'em','%'),
488	'range' => array(
489	'%' => array(
490	'min' => 1,
491	'max' => 100,
492	'step' => 1
493	),
494	'em' => array(
495	'min' => 1,
496	'max' => 100,
497	'step' => 1
498	),
499	'px' => array(
500	'min' => 1,
501	'max' => 1600,
502	'step' => 1
503	)
504	),
505	'selectors' => array(
506	'{{WRAPPER}} .aux-modern-heading-primary' => 'max-width:{{SIZE}}{{UNIT}};'
507	)
508	)
509	);
510
511	$this->end_controls_section();
512
513	/* Secondary title Section
514	/-------------------------------------/
515
516	$this->start_controls_section(
517	'title2_style_heading',
518	[
519	'label' => __( 'Secondary Heading', 'auxin-elements' ),
520	'tab' => Controls_Manager::TAB_STYLE,
521
522	'conditions' =>
523	[
524	'relation' => 'or',
525	'terms' => [
526	[
527	'name' => 'title_secondary_before',
528	'operator' => '!==',
529	'value' => '',
530	], [
531	'name' => 'title_secondary_after',
532	'operator' => '!==',
533	'value' => '',
534	]
535	]
536	]
537	]
538	);
539
540	$this->add_group_control(
541	Group_Control_Typography::get_type(),
542	array(
543	'name' => 'title2_typography',
544	'global' => [
545	'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
546	],
547	'selector' => '{{WRAPPER}} .aux-modern-heading-secondary'
548	)
549	);
550
551	$this->start_controls_tabs( 'title2_tabs' );
552
553	$this->start_controls_tab(
554	'title2_tab_normal_state',
555	[
556	'label' => __( 'Normal', 'auxin-elements' ),
557	]
558	);
559
560	$this->add_responsive_control(
561	'title2_color',
562	array(
563	'label' => __( 'Color', 'auxin-elements' ),
564	'type' => Controls_Manager::COLOR,
565	'selectors' => array(
566	'{{WRAPPER}} .aux-modern-heading-secondary' => 'color: {{VALUE}};'
567	)
568	)
569	);
570
571	$this->add_group_control(
572	Group_Control_Text_Shadow::get_type(),
573	[
574	'name' => 'title2_text_shadow',
575	'label' => __( 'Text Shadow', 'auxin-elements' ),
576	'selector' => '{{WRAPPER}} .aux-modern-heading-secondary'
577	]
578	);
579
580	$this->add_group_control(
581	Group_Control_Background::get_type(),
582	[
583	'name' => 'title2_background',
584	'selector' => '{{WRAPPER}} .aux-modern-heading-secondary',
585	'types' => [ 'classic', 'gradient']
586	]
587	);
588
589	$this->end_controls_tab();
590
591	$this->start_controls_tab(
592	'title2_tab_hover_state',
593	[
594	'label' => __( 'Hover', 'auxin-elements' ),
595	]
596	);
597
598	$this->add_responsive_control(
599	'title2_hover_color',
600	array(
601	'label' => __( 'Color', 'auxin-elements' ),
602	'type' => Controls_Manager::COLOR,
603	'selectors' => array(
604	'{{WRAPPER}} .aux-modern-heading-secondary:hover' => 'color: {{VALUE}};',
605	),
606	)
607	);
608
609	$this->add_group_control(
610	Group_Control_Text_Shadow::get_type(),
611	[
612	'name' => 'title2_hover_text_shadow',
613	'label' => __( 'Text Shadow', 'auxin-elements' ),
614	'selector' => '{{WRAPPER}} .aux-modern-heading-secondary:hover'
615	]
616	);
617
618	$this->add_group_control(
619	Group_Control_Background::get_type(),
620	[
621	'name' => 'title2_hover_background',
622	'selector' => '{{WRAPPER}} .aux-modern-heading-secondary:hover',
623	'types' => [ 'classic', 'gradient']
624	]
625	);
626
627	$this->end_controls_tab();
628
629	$this->end_controls_tabs();
630
631	$this->add_responsive_control(
632	'title2_margin',
633	[
634	'label' => __( 'Margin', 'auxin-elements' ),
635	'type' => Controls_Manager::DIMENSIONS,
636	'size_units' => [ 'px', 'em', '%' ],
637	'selectors' => [
638	'{{WRAPPER}} .aux-modern-heading-secondary' => 'margin:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
639	],
640	'separator' => 'before'
641	]
642	);
643
644	$this->add_responsive_control(
645	'title2_padding',
646	[
647	'label' => __( 'Padding', 'auxin-elements' ),
648	'type' => Controls_Manager::DIMENSIONS,
649	'size_units' => [ 'px', 'em', '%' ],
650	'selectors' => [
651	'{{WRAPPER}} .aux-modern-heading-secondary' => 'padding:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
652	]
653	]
654	);
655
656	$this->add_responsive_control(
657	'title2_border_radius',
658	[
659	'label' => __( 'Border radius', 'auxin-elements' ),
660	'type' => Controls_Manager::DIMENSIONS,
661	'size_units' => [ 'px', 'em', '%' ],
662	'allowed_dimensions' => 'all',
663	'selectors' => [
664	'{{WRAPPER}} .aux-modern-heading-secondary' => 'border-radius:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
665	]
666	]
667	);
668
669	$this->add_responsive_control(
670	'title2_width',
671	array(
672	'label' => __('Max Width','auxin-elements' ),
673	'type' => Controls_Manager::SLIDER,
674	'size_units' => array('px', 'em','%'),
675	'range' => array(
676	'%' => array(
677	'min' => 1,
678	'max' => 100,
679	'step' => 1
680	),
681	'em' => array(
682	'min' => 1,
683	'max' => 100,
684	'step' => 1
685	),
686	'px' => array(
687	'min' => 1,
688	'max' => 1600,
689	'step' => 1
690	)
691	),
692	'selectors' => array(
693	'{{WRAPPER}} .aux-modern-heading-secondary' => 'max-width:{{SIZE}}{{UNIT}};'
694	)
695	)
696	);
697
698	$this->end_controls_section();
699
700
701	/* Secondary Highlighted Style
702	/-------------------------------------/
703
704	$this->start_controls_section(
705	'title2_highlighted_style_heading',
706	[
707	'label' => __( 'Secondary Heading - Highlighted', 'auxin-elements' ),
708	'tab' => Controls_Manager::TAB_STYLE,
709	'condition' => [ 'title_secondary_highlight!' => '' ]
710	]
711	);
712
713	$this->add_group_control(
714	Group_Control_Typography::get_type(),
715	array(
716	'name' => 'title2_highlighted_typography',
717	'global' => [
718	'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
719	],
720	'selector' => '{{WRAPPER}} .aux-modern-heading-secondary .aux-head-highlight'
721	)
722	);
723
724	$this->start_controls_tabs( 'title2_highlighted_tabs' );
725
726	$this->start_controls_tab(
727	'title2_highlighted_tab_normal_state',
728	[
729	'label' => __( 'Normal', 'auxin-elements' ),
730	]
731	);
732
733	$this->add_responsive_control(
734	'title2_highlighted_color',
735	array(
736	'label' => __( 'Color', 'auxin-elements' ),
737	'type' => Controls_Manager::COLOR,
738	'selectors' => array(
739	'{{WRAPPER}} .aux-modern-heading-secondary .aux-head-highlight' => 'color: {{VALUE}};'
740	)
741	)
742	);
743
744	$this->add_group_control(
745	Group_Control_Text_Shadow::get_type(),
746	[
747	'name' => 'title2_highlighted_text_shadow',
748	'label' => __( 'Text Shadow', 'auxin-elements' ),
749	'selector' => '{{WRAPPER}} .aux-modern-heading-secondary .aux-head-highlight'
750	]
751	);
752
753	$this->add_group_control(
754	Group_Control_Background::get_type(),
755	[
756	'name' => 'title2_highlighted_background',
757	'selector' => '{{WRAPPER}} .aux-modern-heading-secondary .aux-head-highlight',
758	'types' => [ 'classic', 'gradient']
759	]
760	);
761
762	$this->end_controls_tab();
763
764	$this->start_controls_tab(
765	'title2_highlighted_tab_hover_state',
766	[
767	'label' => __( 'Hover', 'auxin-elements' ),
768	]
769	);
770
771	$this->add_responsive_control(
772	'title2_highlighted_hover_color',
773	array(
774	'label' => __( 'Color', 'auxin-elements' ),
775	'type' => Controls_Manager::COLOR,
776	'selectors' => array(
777	'{{WRAPPER}} .aux-modern-heading-secondary .aux-head-highlight:hover' => 'color: {{VALUE}};',
778	),
779	)
780	);
781
782	$this->add_group_control(
783	Group_Control_Text_Shadow::get_type(),
784	[
785	'name' => 'title2_highlighted_hover_text_shadow',
786	'label' => __( 'Text Shadow', 'auxin-elements' ),
787	'selector' => '{{WRAPPER}} .aux-modern-heading-secondary .aux-head-highlight:hover'
788	]
789	);
790
791	$this->add_group_control(
792	Group_Control_Background::get_type(),
793	[
794	'name' => 'title2_highlighted_hover_background',
795	'selector' => '{{WRAPPER}} .aux-modern-heading-secondary .aux-head-highlight:hover',
796	'types' => [ 'classic', 'gradient']
797	]
798	);
799
800	$this->end_controls_tab();
801
802	$this->end_controls_tabs();
803
804	$this->add_responsive_control(
805	'title2_highlighted_margin',
806	[
807	'label' => __( 'Margin', 'auxin-elements' ),
808	'type' => Controls_Manager::DIMENSIONS,
809	'size_units' => [ 'px', 'em', '%' ],
810	'selectors' => [
811	'{{WRAPPER}} .aux-modern-heading-secondary .aux-head-highlight' => 'margin:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
812	],
813	'separator' => 'before'
814	]
815	);
816
817	$this->add_responsive_control(
818	'title2_highlighted_padding',
819	[
820	'label' => __( 'Padding', 'auxin-elements' ),
821	'type' => Controls_Manager::DIMENSIONS,
822	'size_units' => [ 'px', 'em', '%' ],
823	'selectors' => [
824	'{{WRAPPER}} .aux-modern-heading-secondary .aux-head-highlight' => 'padding:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
825	]
826	]
827	);
828
829	$this->add_responsive_control(
830	'title2_highlighted_border_radius',
831	[
832	'label' => __( 'Border radius', 'auxin-elements' ),
833	'type' => Controls_Manager::DIMENSIONS,
834	'size_units' => [ 'px', 'em', '%' ],
835	'allowed_dimensions' => 'all',
836	'selectors' => [
837	'{{WRAPPER}} .aux-modern-heading-secondary .aux-head-highlight' => 'border-radius:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
838	]
839	]
840	);
841
842	$this->add_responsive_control(
843	'title2_highlighted_width',
844	array(
845	'label' => __('Max Width','auxin-elements' ),
846	'type' => Controls_Manager::SLIDER,
847	'size_units' => array('px', 'em','%'),
848	'range' => array(
849	'%' => array(
850	'min' => 1,
851	'max' => 100,
852	'step' => 1
853	),
854	'em' => array(
855	'min' => 1,
856	'max' => 100,
857	'step' => 1
858	),
859	'px' => array(
860	'min' => 1,
861	'max' => 1600,
862	'step' => 1
863	)
864	),
865	'selectors' => array(
866	'{{WRAPPER}} .aux-modern-heading-secondary .aux-head-highlight' => 'max-width:{{SIZE}}{{UNIT}};'
867	)
868	)
869	);
870
871	$this->end_controls_section();
872
873	/* Divider Section
874	/-------------------------------------/
875
876	$this->start_controls_section(
877	'divider_style_section',
878	[
879	'label' => __( 'Divider', 'auxin-elements' ),
880	'tab' => Controls_Manager::TAB_STYLE,
881	'condition' => [
882	'divider' => 'yes'
883	]
884	]
885	);
886
887	$this->add_responsive_control(
888	'divider_weight',
889	array(
890	'label' => __( 'Weight', 'auxin-elements' ),
891	'type' => Controls_Manager::SLIDER,
892	'size_units' => array( 'px' ),
893	'range' => array(
894	'px' => array(
895	'max' => 10
896	)
897	),
898	'selectors' => array(
899	'{{WRAPPER}} .aux-modern-heading-divider' => 'height: {{SIZE}}{{UNIT}};'
900	)
901	)
902	);
903
904	$this->add_responsive_control(
905	'divider_width',
906	array(
907	'label' => __( 'Width', 'auxin-elements' ),
908	'type' => Controls_Manager::SLIDER,
909	'size_units' => array( 'px', '%' ),
910	'range' => array(
911	'px' => array(
912	'min' => 1,
913	'max' => 1200
914	),
915	'%' => array(
916	'min' => 1,
917	'max' => 100
918	)
919	),
920	'selectors' => array(
921	'{{WRAPPER}} .aux-modern-heading-divider' => 'width: {{SIZE}}{{UNIT}};'
922	)
923	)
924	);
925
926	$this->add_responsive_control(
927	'divider_margin',
928	array(
929	'label' => __( 'Margin', 'auxin-elements' ),
930	'type' => Controls_Manager::DIMENSIONS,
931	'size_units' => array( 'px', 'em' ),
932	'allowed_dimensions' => 'all',
933	'selectors' => array(
934	'{{WRAPPER}} .aux-modern-heading-divider' => 'margin:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
935	)
936	)
937	);
938
939	$this->add_responsive_control(
940	'divider_color',
941	array(
942	'label' => __( 'Color', 'auxin-elements' ),
943	'type' => Controls_Manager::COLOR,
944	'selectors' => array(
945	'{{WRAPPER}} .aux-modern-heading-divider' => 'background-color: {{VALUE}};'
946	)
947	)
948	);
949
950	$this->add_group_control(
951	Group_Control_Box_Shadow::get_type(),
952	array(
953	'name' => 'divider_shadow',
954	'selector' => '{{WRAPPER}} .aux-modern-heading-divider',
955	'separator' => 'before'
956	)
957	);
958
959	$this->add_group_control(
960	Group_Control_Background::get_type(),
961	array(
962	'name' => 'divider_backgoundcolor',
963	'label' => __( 'Background', 'auxin-elements' ),
964	'selector' => '{{WRAPPER}} .aux-modern-heading-divider'
965	)
966	);
967
968	$this->end_controls_section();
969
970	/* Description Section
971	/-------------------------------------/
972
973	$this->start_controls_section(
974	'description_style_section',
975	array(
976	'label' => __( 'Description', 'auxin-elements' ),
977	'tab' => Controls_Manager::TAB_STYLE,
978	'condition' => [ 'description!' => '' ]
979	)
980	);
981
982	$this->add_responsive_control(
983	'description_color',
984	array(
985	'label' => __( 'Color', 'auxin-elements' ),
986	'type' => Controls_Manager::COLOR,
987	'selectors' => array(
988	'{{WRAPPER}} .aux-modern-heading-description' => 'color: {{VALUE}};'
989	)
990	)
991	);
992
993	$this->add_group_control(
994	Group_Control_Typography::get_type(),
995	array(
996	'name' => 'description_typography',
997	'global' => [
998	'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
999	],
1000	'selector' => '{{WRAPPER}} .aux-modern-heading-description'
1001	)
1002	);
1003
1004	$this->add_responsive_control(
1005	'description_margin',
1006	array(
1007	'label' => __( 'Margin', 'auxin-elements' ),
1008	'type' => Controls_Manager::DIMENSIONS,
1009	'size_units' => array( 'px', 'em' ),
1010	'allowed_dimensions' => 'all',
1011	'selectors' => array(
1012	'{{WRAPPER}} .aux-modern-heading-description' => 'margin:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1013	)
1014	)
1015	);
1016
1017	$this->add_responsive_control(
1018	'description_width',
1019	array(
1020	'label' => __('Max Width','auxin-elements' ),
1021	'type' => Controls_Manager::SLIDER,
1022	'size_units' => array('px', 'em','%'),
1023	'range' => array(
1024	'%' => array(
1025	'min' => 1,
1026	'max' => 100,
1027	'step' => 1
1028	),
1029	'em' => array(
1030	'min' => 1,
1031	'max' => 100,
1032	'step' => 1
1033	),
1034	'px' => array(
1035	'min' => 1,
1036	'max' => 1600,
1037	'step' => 1
1038	)
1039	),
1040	'selectors' => array(
1041	'{{WRAPPER}} .aux-modern-heading-description' => 'max-width:{{SIZE}}{{UNIT}};'
1042	)
1043	)
1044	);
1045
1046	$this->end_controls_section();
1047
1048	/* Wrapper Section
1049	/-------------------------------------/
1050
1051	$this->start_controls_section(
1052	'wrapper_style_section',
1053	array(
1054	'label' => __( 'Wrapper', 'auxin-elements' ),
1055	'tab' => Controls_Manager::TAB_STYLE
1056	)
1057	);
1058
1059	$this->add_responsive_control(
1060	'width',
1061	array(
1062	'label' => __('Width','auxin-elements' ),
1063	'type' => Controls_Manager::SLIDER,
1064	'size_units' => array('px', 'em','%', 'vw'),
1065	'range' => array(
1066	'%' => array(
1067	'min' => 1,
1068	'max' => 100,
1069	'step' => 1
1070	),
1071	'em' => array(
1072	'min' => 1,
1073	'max' => 100,
1074	'step' => 1
1075	),
1076	'px' => array(
1077	'min' => 1,
1078	'max' => 1600,
1079	'step' => 1
1080	)
1081	),
1082	'selectors' => array(
1083	'{{WRAPPER}} .aux-widget-modern-heading .aux-widget-inner' => 'width:{{SIZE}}{{UNIT}};'
1084	)
1085	)
1086	);
1087
1088	$this->add_responsive_control(
1089	'height',
1090	array(
1091	'label' => __('Height','auxin-elements' ),
1092	'type' => Controls_Manager::SLIDER,
1093	'size_units' => array('px', 'em', '%', 'vh'),
1094	'range' => array(
1095	'%' => array(
1096	'min' => 1,
1097	'max' => 100,
1098	'step' => 1
1099	),
1100	'em' => array(
1101	'min' => 1,
1102	'max' => 100,
1103	'step' => 1
1104	),
1105	'px' => array(
1106	'min' => 1,
1107	'max' => 1600,
1108	'step' => 1
1109	)
1110
1111	),
1112	'selectors' => array(
1113	'{{WRAPPER}} .aux-widget-modern-heading .aux-widget-inner' => 'height:{{SIZE}}{{UNIT}};'
1114	)
1115	)
1116	);
1117
1118	$this->add_responsive_control(
1119	'wrapper_margin',
1120	array(
1121	'label' => __( 'Margin', 'auxin-elements' ),
1122	'type' => Controls_Manager::DIMENSIONS,
1123	'size_units' => array( 'px', 'em'),
1124	'allowed_dimensions' => 'all',
1125	'selectors' => array(
1126	'{{WRAPPER}} .aux-widget-modern-heading .aux-widget-inner' => 'margin:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1127	)
1128	)
1129	);
1130
1131	$this->add_responsive_control(
1132	'wrapper_padding',
1133	array(
1134	'label' => __( 'Padding', 'auxin-elements' ),
1135	'type' => Controls_Manager::DIMENSIONS,
1136	'size_units' => array( 'px', 'em', '%'),
1137	'allowed_dimensions' => 'all',
1138	'selectors' => array(
1139	'{{WRAPPER}} .aux-widget-modern-heading .aux-widget-inner' => 'padding:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1140	)
1141	)
1142	);
1143
1144	$this->end_controls_section();
1145	}
1146
1147	/**
1148	* Render 'ModernHeading' widget output on the frontend.
1149	*
1150	* Written in PHP and used to generate the final HTML.
1151	*
1152	* @since 1.0.0
1153	* @access protected
1154	*/
1155	protected function render() {
1156
1157	$settings = $this->get_settings_for_display();
1158
1159	$settings['title_tag'] = in_array( $settings['title_tag'], $this->allowed_tags ) ? $settings['title_tag'] : 'h2';
1160
1161	$settings['title_tag_secondary'] = in_array( $settings['title_tag_secondary'], $this->allowed_tags ) ? $settings['title_tag_secondary'] : 'h3';
1162
1163	$divider_markup = auxin_is_true( $settings['divider'] ) ? '<div class="aux-modern-heading-divider"></div>' : '';
1164
1165	echo '<section class="aux-widget-modern-heading">
1166	<div class="aux-widget-inner">';
1167
1168	// Maybe print divider before
1169	if( empty( $settings['divider_position'] ) \|\| 'before' == $settings['divider_position'] ){
1170	echo wp_kses_post( $divider_markup );
1171	}
1172
1173	// Print Primary Heading
1174	if( ! empty( $settings['link']['url'] ) ){
1175
1176	// Make Link attributes
1177	$this->add_render_attribute( 'link-primary', 'href', esc_url( $settings['link']['url'] ) );
1178	$this->add_render_attribute( 'link-primary', 'class', 'aux-modern-heading-primary-link' );
1179	if ( $settings['link']['is_external'] ) {
1180	$this->add_render_attribute( 'link-primary', 'target', '_blank' );
1181	}
1182	if ( $settings['link']['nofollow'] ) {
1183	$this->add_render_attribute( 'link-primary', 'rel', 'nofollow' );
1184	}
1185
1186	printf( '<a %1$s><%2$s class="aux-modern-heading-primary">%3$s</%2$s></a>',
1187	$this->get_render_attribute_string( 'link-primary' ),
1188	tag_escape( $settings['title_tag'] ),
1189	wp_kses_post( $settings['title'] )
1190	);
1191
1192	} else {
1193	printf( '<%1$s class="aux-modern-heading-primary">%2$s</%1$s>',
1194	tag_escape( $settings['title_tag'] ),
1195	wp_kses_post( $settings['title'] )
1196	);
1197	}
1198
1199	// Maybe print divider between
1200	if( 'between' == $settings['divider_position'] ){
1201	echo wp_kses_post( $divider_markup );
1202	}
1203
1204	// Print Secondary Heading
1205	$before_heading = $settings['title_secondary_before'] ? '' . '<span class="aux-head-before">' . wp_kses_post( $settings['title_secondary_before'] ) . '</span>' : '';
1206	$highlight_heading = $settings['title_secondary_highlight'] ? '' . '<span class="aux-head-highlight">' . wp_kses_post( $settings['title_secondary_highlight'] ) . '</span>' : '';
1207	$after_heading = $settings['title_secondary_after' ] ? '' . '<span class="aux-head-after">' . wp_kses_post( $settings['title_secondary_after' ] ) . '</span>' : '';
1208
1209	if( $before_heading \|\| $highlight_heading \|\| $after_heading ){
1210
1211	if( ! empty( $settings['link_secondary']['url'] ) ){
1212
1213	// Make Link attributes
1214	$this->add_render_attribute( 'link-secondary', 'href', esc_url( $settings['link_secondary']['url'] ) );
1215	$this->add_render_attribute( 'link-secondary', 'class', 'aux-modern-heading-secondary-link' );
1216	if ( $settings['link_secondary']['is_external'] ) {
1217	$this->add_render_attribute( 'link-secondary', 'target', '_blank' );
1218	}
1219	if ( $settings['link_secondary']['nofollow'] ) {
1220	$this->add_render_attribute( 'link-secondary', 'rel', 'nofollow' );
1221	}
1222
1223	printf( '<a %1$s><%2$s class="aux-modern-heading-secondary">%3$s%4$s%5$s</%2$s></a>',
1224	$this->get_render_attribute_string( 'link-secondary' ),
1225	tag_escape( $settings['title_tag_secondary'] ),
1226	wp_kses_post( $before_heading ),
1227	wp_kses_post( $highlight_heading ),
1228	wp_kses_post( $after_heading )
1229	);
1230	} else {
1231	printf( '<%1$s class="aux-modern-heading-secondary">%2$s%3$s%4$s</%1$s>',
1232	tag_escape( $settings['title_tag_secondary'] ),
1233	wp_kses_post( $before_heading ),
1234	wp_kses_post( $highlight_heading ),
1235	wp_kses_post( $after_heading )
1236	);
1237	}
1238
1239	}
1240
1241	// Maybe Print divider after
1242	if( 'after' == $settings['divider_position'] ){
1243	echo wp_kses_post( $divider_markup );
1244	}
1245
1246	if( ! empty( $settings['description'] ) ){
1247	printf( '<div class="aux-modern-heading-description">%s</div>',
1248	wp_kses_post( $settings['description'] )
1249	);
1250	}
1251
1252	echo '</div>
1253	</section>';
1254	}
1255
1256	}
1257