fluentform / app / Modules / Widgets / FluentFormWidget.php

FluentFormWidget.php in Fluent Forms – Customizable Contact Forms, Survey, Quiz, & Conversational Form Builder 4.3.6, at app/Modules/Widgets/FluentFormWidget.php

2,472 lines 88.4 KB

Raw Download Zip

1	<?php
2	namespace FluentForm\App\Modules\Widgets;
3
4	use Elementor\Widget_Base;
5	use Elementor\Controls_Manager;
6	use Elementor\Group_Control_Border;
7	use Elementor\Group_Control_Box_Shadow;
8	use Elementor\Group_Control_Typography;
9	use \Elementor\Core\Schemes\Typography as Scheme_Typography;
10	use Elementor\Group_Control_Background;
11	use \Elementor\Core\Schemes\Color as Scheme_Color;
12	use FluentForm\App\Helpers\Helper;
13
14	if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
15
16	class FluentFormWidget extends Widget_Base {
17
18	public function get_name() {
19	return 'fluent-form-widget';
20	}
21
22	public function get_title() {
23	return __( 'Fluent Forms', 'fluentform' );
24	}
25
26	public function get_icon() {
27	return 'eicon-form-horizontal';
28	}
29
30	public function get_keywords() {
31	return [
32	'fluentform',
33	'fluentforms',
34	'fluent form',
35	'fluent forms',
36	'contact form',
37	'form',
38	'elementor form',
39	];
40	}
41
42	public function get_categories() {
43	return array('general');
44	}
45
46	public function get_style_depends() {
47	return [
48	'fluent-form-styles',
49	'fluentform-public-default'
50	];
51	}
52
53	public function get_script_depends() {
54	return [ 'fluentform-elementor'];
55	}
56
57	protected function register_controls()
58	{
59	$this->register_general_controls();
60	$this->register_error_controls();
61	$this->register_title_description_style_controls();
62	$this->register_form_container_style_controls();
63	$this->register_label_style_controls();
64	$this->register_input_textarea_style_controls();
65	$this->register_placeholder_style_controls();
66	$this->register_radio_checkbox_style_controls();
67	$this->register_terms_gdpr_style_controls();
68	$this->register_section_break_style_controls();
69	$this->register_checkbox_grid_style_controls();
70	$this->register_address_line_style_controls();
71	$this->register_image_upload_style_controls();
72	$this->register_pagination_style_controls();
73	$this->register_submit_button_style_controls();
74	$this->register_success_message_style_controls();
75	$this->register_errors_style_controls();
76	}
77
78	protected function register_general_controls(){
79	$this->start_controls_section(
80	'section_fluent_form',
81	[
82	'label' => __('Fluent Forms', 'fluentform'),
83	]
84	);
85
86
87	$this->add_control(
88	'form_list',
89	[
90	'label' => esc_html__('Fluent Forms', 'fluentform'),
91	'type' => Controls_Manager::SELECT,
92	'label_block' => true,
93	'options' => Helper::getForms(),
94	'default' => '0',
95	]
96	);
97
98	$this->add_control(
99	'custom_title_description',
100	[
101	'label' => __('Custom Title & Description', 'fluentform'),
102	'type' => Controls_Manager::SWITCHER,
103	'label_on' => __('Yes', 'fluentform'),
104	'label_off' => __('No', 'fluentform'),
105	'return_value' => 'yes',
106	]
107	);
108
109	$this->add_control(
110	'form_title_custom',
111	[
112	'label' => esc_html__('Title', 'fluentform'),
113	'type' => Controls_Manager::TEXT,
114	'label_block' => true,
115	'default' => '',
116	'condition' => [
117	'custom_title_description' => 'yes',
118	],
119	]
120	);
121
122	$this->add_control(
123	'form_description_custom',
124	[
125	'label' => esc_html__('Description', 'fluentform'),
126	'type' => Controls_Manager::TEXTAREA,
127	'default' => '',
128	'condition' => [
129	'custom_title_description' => 'yes',
130	],
131	]
132	);
133
134	$this->add_control(
135	'labels_switch',
136	[
137	'label' => __('Labels', 'fluentform'),
138	'type' => Controls_Manager::SWITCHER,
139	'default' => 'yes',
140	'label_on' => __('Show', 'fluentform'),
141	'label_off' => __('Hide', 'fluentform'),
142	'return_value' => 'yes'
143	]
144	);
145
146	$this->add_control(
147	'placeholder_switch',
148	[
149	'label' => __('Placeholder', 'fluentform'),
150	'type' => Controls_Manager::SWITCHER,
151	'default' => 'yes',
152	'label_on' => __('Show', 'fluentform'),
153	'label_off' => __('Hide', 'fluentform'),
154	'return_value' => 'yes',
155	]
156	);
157
158	$this->end_controls_section();
159	}
160
161	protected function register_error_controls(){
162	$this->start_controls_section(
163	'section_errors',
164	[
165	'label' => __('Errors', 'fluentform'),
166	]
167	);
168
169	$this->add_control(
170	'error_messages',
171	[
172	'label' => __('Error Messages', 'fluentform'),
173	'type' => Controls_Manager::SWITCHER,
174	'default' => 'yes',
175	'label_on' => __('Show', 'fluentform'),
176	'label_off' => __('Hide', 'fluentform'),
177	'return_value' => 'yes',
178	]
179	);
180
181	$this->end_controls_section();
182	}
183
184	protected function register_title_description_style_controls(){
185	$this->start_controls_section(
186	'section_form_title_style',
187	[
188	'label' => __('Title & Description', 'fluentform'),
189	'tab' => Controls_Manager::TAB_STYLE,
190	'condition' => [
191	'custom_title_description' => 'yes',
192	],
193	]
194	);
195
196	$this->add_responsive_control(
197	'heading_alignment',
198	[
199	'label' => __('Alignment', 'fluentform'),
200	'type' => Controls_Manager::CHOOSE,
201	'options' => [
202	'left' => [
203	'title' => __('Left', 'fluentform'),
204	'icon' => 'fa fa-align-left',
205	],
206	'center' => [
207	'title' => __('Center', 'fluentform'),
208	'icon' => 'fa fa-align-center',
209	],
210	'right' => [
211	'title' => __('Right', 'fluentform'),
212	'icon' => 'fa fa-align-right',
213	],
214	],
215	'default' => '',
216	'selectors' => [
217	'{{WRAPPER}} .fluentform-widget-title' => 'text-align: {{VALUE}};',
218	'{{WRAPPER}} .fluentform-widget-description' => 'text-align: {{VALUE}};',
219	],
220	'condition' => [
221	'custom_title_description' => 'yes',
222	],
223	]
224	);
225
226	$this->add_control(
227	'heading_title',
228	[
229	'label' => __('Title', 'fluentform'),
230	'type' => Controls_Manager::HEADING,
231	'separator' => 'before',
232	'condition' => [
233	'custom_title_description' => 'yes',
234	],
235	]
236	);
237
238	$this->add_control(
239	'form_title_text_color',
240	[
241	'label' => __('Color', 'fluentform'),
242	'type' => Controls_Manager::COLOR,
243	'default' => '',
244	'selectors' => [
245	'{{WRAPPER}} .fluentform-widget-title' => 'color: {{VALUE}}',
246	],
247	'condition' => [
248	'custom_title_description' => 'yes',
249	],
250	]
251	);
252
253	$this->add_group_control(
254	Group_Control_Typography::get_type(),
255	[
256	'name' => 'form_title_typography',
257	'label' => __('Typography', 'fluentform'),
258	'selector' => '{{WRAPPER}} .fluentform-widget-title',
259	'condition' => [
260	'custom_title_description' => 'yes',
261	],
262	]
263	);
264
265	$this->add_responsive_control(
266	'form_title_margin',
267	[
268	'label' => __('Margin', 'fluentform'),
269	'type' => Controls_Manager::DIMENSIONS,
270	'size_units' => ['px', 'em', '%'],
271	'allowed_dimensions' => 'vertical',
272	'placeholder' => [
273	'top' => '',
274	'right' => 'auto',
275	'bottom' => '',
276	'left' => 'auto',
277	],
278	'selectors' => [
279	'{{WRAPPER}} .fluentform-widget-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
280	],
281	'condition' => [
282	'custom_title_description' => 'yes',
283	],
284	]
285	);
286
287	$this->add_responsive_control(
288	'form_title_padding',
289	[
290	'label' => esc_html__('Padding', 'fluentform'),
291	'type' => Controls_Manager::DIMENSIONS,
292	'size_units' => ['px', 'em', '%'],
293	'selectors' => [
294	'{{WRAPPER}} .fluentform-widget-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
295	],
296	]
297	);
298
299
300	$this->add_control(
301	'heading_description',
302	[
303	'label' => __('Description', 'fluentform'),
304	'type' => Controls_Manager::HEADING,
305	'separator' => 'before',
306	'condition' => [
307	'custom_title_description' => 'yes',
308	],
309	]
310	);
311
312	$this->add_control(
313	'heading_description_text_color',
314	[
315	'label' => __('Color', 'fluentform'),
316	'type' => Controls_Manager::COLOR,
317	'default' => '',
318	'selectors' => [
319	'{{WRAPPER}} .fluentform-widget-description' => 'color: {{VALUE}}',
320	],
321	'condition' => [
322	'custom_title_description' => 'yes',
323	],
324	]
325	);
326
327	$this->add_group_control(
328	Group_Control_Typography::get_type(),
329	[
330	'name' => 'heading_description_typography',
331	'label' => __('Typography', 'fluentform'),
332	'scheme' => Scheme_Typography::TYPOGRAPHY_4,
333	'selector' => '{{WRAPPER}} .fluentform-widget-description',
334	'condition' => [
335	'custom_title_description' => 'yes',
336	],
337	]
338	);
339
340
341	$this->add_responsive_control(
342	'heading_description_margin',
343	[
344	'label' => __('Margin', 'fluentform'),
345	'type' => Controls_Manager::DIMENSIONS,
346	'size_units' => ['px', 'em', '%'],
347	'allowed_dimensions' => 'vertical',
348	'placeholder' => [
349	'top' => '',
350	'right' => 'auto',
351	'bottom' => '',
352	'left' => 'auto',
353	],
354	'selectors' => [
355	'{{WRAPPER}} .fluentform-widget-description' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
356	],
357	'condition' => [
358	'custom_title_description' => 'yes',
359	],
360	]
361	);
362
363	$this->add_responsive_control(
364	'heading_description_padding',
365	[
366	'label' => esc_html__('Padding', 'fluentform'),
367	'type' => Controls_Manager::DIMENSIONS,
368	'size_units' => ['px', 'em', '%'],
369	'selectors' => [
370	'{{WRAPPER}} .fluentform-widget-description' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
371	],
372	]
373	);
374
375	$this->end_controls_section();
376	}
377
378	protected function register_form_container_style_controls(){
379
380	$this->start_controls_section(
381	'section_form_container_style',
382	[
383	'label' => __('Form Container', 'fluentform'),
384	'tab' => Controls_Manager::TAB_STYLE,
385	]
386	);
387
388
389	$this->add_group_control(
390	Group_Control_Background::get_type(),
391	[
392	'name' => 'form_container_background',
393	'label' => __( 'Background', 'fluentform' ),
394	'types' => [ 'classic', 'gradient' ],
395	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper',
396	]
397	);
398
399
400	$this->add_control(
401	'form_container_link_color',
402	[
403	'label' => __('Link Color', 'fluentform'),
404	'type' => Controls_Manager::COLOR,
405	'default' => '',
406	'selectors' => [
407	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group a' => 'color: {{VALUE}};',
408	],
409	]
410	);
411
412	$this->add_responsive_control(
413	'form_container_max_width',
414	[
415	'label' => esc_html__('Max Width', 'fluentform'),
416	'type' => Controls_Manager::SLIDER,
417	'size_units' => ['px', 'em', '%'],
418	'range' => [
419	'px' => [
420	'min' => 10,
421	'max' => 1500,
422	],
423	'em' => [
424	'min' => 1,
425	'max' => 80,
426	],
427	],
428	'selectors' => [
429	'{{WRAPPER}} .fluentform-widget-wrapper' => 'width: {{SIZE}}{{UNIT}};'
430	],
431	]
432	);
433
434	$this->add_responsive_control(
435	'form_container_alignment',
436	[
437	'label' => esc_html__('Alignment', 'fluentform'),
438	'type' => Controls_Manager::CHOOSE,
439	'label_block' => true,
440	'options' => [
441	'default' => [
442	'title' => __('Default', 'fluentform'),
443	'icon' => 'fa fa-ban',
444	],
445	'left' => [
446	'title' => esc_html__('Left', 'fluentform'),
447	'icon' => 'eicon-h-align-left',
448	],
449	'center' => [
450	'title' => esc_html__('Center', 'fluentform'),
451	'icon' => 'eicon-h-align-center',
452	],
453	'right' => [
454	'title' => esc_html__('Right', 'fluentform'),
455	'icon' => 'eicon-h-align-right',
456	],
457	],
458	'default' => 'default',
459	]
460	);
461
462	$this->add_responsive_control(
463	'form_container_margin',
464	[
465	'label' => esc_html__('Margin', 'fluentform'),
466	'type' => Controls_Manager::DIMENSIONS,
467	'size_units' => ['px', 'em', '%'],
468	'selectors' => [
469	'{{WRAPPER}} .fluentform-widget-wrapper' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
470	],
471	]
472	);
473
474	$this->add_responsive_control(
475	'form_container_padding',
476	[
477	'label' => esc_html__('Padding', 'fluentform'),
478	'type' => Controls_Manager::DIMENSIONS,
479	'size_units' => ['px', 'em', '%'],
480	'selectors' => [
481	'{{WRAPPER}} .fluentform-widget-wrapper' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
482	],
483	]
484	);
485
486
487	$this->add_group_control(
488	Group_Control_Border::get_type(),
489	[
490	'name' => 'form_container_border',
491	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper',
492	]
493	);
494
495	$this->add_control(
496	'form_container_border_radius',
497	[
498	'label' => esc_html__('Border Radius', 'fluentform'),
499	'type' => Controls_Manager::DIMENSIONS,
500	'separator' => 'before',
501	'size_units' => ['px'],
502	'selectors' => [
503	'{{WRAPPER}} .fluentform-widget-wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
504	],
505	]
506	);
507
508	$this->add_group_control(
509	Group_Control_Box_Shadow::get_type(),
510	[
511	'name' => 'form_container_box_shadow',
512	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper',
513	]
514	);
515
516	$this->end_controls_section();
517
518	}
519
520	protected function register_label_style_controls(){
521
522	$this->start_controls_section(
523	'section_form_label_style',
524	[
525	'label' => __('Labels', 'fluentform'),
526	'tab' => Controls_Manager::TAB_STYLE,
527	]
528	);
529
530	$this->add_control(
531	'form_label_text_color',
532	[
533	'label' => __('Text Color', 'fluentform'),
534	'type' => Controls_Manager::COLOR,
535	'selectors' => [
536	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-input--label label' => 'color: {{VALUE}}',
537	],
538	]
539	);
540
541	$this->add_group_control(
542	Group_Control_Typography::get_type(),
543	[
544	'name' => 'form_label_typography',
545	'label' => __('Typography', 'fluentform'),
546	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-el-input--label label',
547	]
548	);
549
550	$this->end_controls_section();
551	}
552
553	protected function register_input_textarea_style_controls(){
554
555	$this->start_controls_section(
556	'section_form_fields_style',
557	[
558	'label' => __('Input & Textarea', 'fluentform'),
559	'tab' => Controls_Manager::TAB_STYLE,
560	]
561	);
562
563	$this->add_responsive_control(
564	'input_alignment',
565	[
566	'label' => __('Alignment', 'fluentform'),
567	'type' => Controls_Manager::CHOOSE,
568	'options' => [
569	'left' => [
570	'title' => __('Left', 'fluentform'),
571	'icon' => 'fa fa-align-left',
572	],
573	'center' => [
574	'title' => __('Center', 'fluentform'),
575	'icon' => 'fa fa-align-center',
576	],
577	'right' => [
578	'title' => __('Right', 'fluentform'),
579	'icon' => 'fa fa-align-right',
580	],
581	],
582	'default' => '',
583	'selectors' => [
584	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'text-align: {{VALUE}};',
585	],
586	]
587	);
588
589	$this->start_controls_tabs('tabs_form_fields_style');
590
591	$this->start_controls_tab(
592	'tab_form_fields_normal',
593	[
594	'label' => __('Normal', 'fluentform'),
595	]
596	);
597
598	$this->add_control(
599	'form_field_bg_color',
600	[
601	'label' => __('Background Color', 'fluentform'),
602	'type' => Controls_Manager::COLOR,
603	'default' => '',
604	'selectors' => [
605	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):not(.select2-search__field), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .select2-container--default .select2-selection--multiple' => 'background-color: {{VALUE}}',
606	],
607	]
608	);
609
610	$this->add_control(
611	'form_field_text_color',
612	[
613	'label' => __('Text Color', 'fluentform'),
614	'type' => Controls_Manager::COLOR,
615	'default' => '',
616	'selectors' => [
617	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'color: {{VALUE}}',
618	],
619	]
620	);
621
622	$this->add_group_control(
623	Group_Control_Border::get_type(),
624	[
625	'name' => 'form_field_border',
626	'label' => __('Border', 'fluentform'),
627	'placeholder' => '1px',
628	'default' => '1px',
629	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):not(.select2-search__field), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .select2-container--default .select2-selection--multiple',
630	'separator' => 'before',
631	]
632	);
633
634	$this->add_control(
635	'form_field_radius',
636	[
637	'label' => __('Border Radius', 'fluentform'),
638	'type' => Controls_Manager::DIMENSIONS,
639	'size_units' => ['px', 'em', '%'],
640	'selectors' => [
641	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .select2-container--default .select2-selection--multiple' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
642	],
643	]
644	);
645
646	$this->add_responsive_control(
647	'form_field_text_indent',
648	[
649	'label' => __('Text Indent', 'fluentform'),
650	'type' => Controls_Manager::SLIDER,
651	'range' => [
652	'px' => [
653	'min' => 0,
654	'max' => 60,
655	'step' => 1,
656	],
657	'%' => [
658	'min' => 0,
659	'max' => 30,
660	'step' => 1,
661	],
662	],
663	'size_units' => ['px', 'em', '%'],
664	'selectors' => [
665	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'text-indent: {{SIZE}}{{UNIT}}',
666	],
667	'separator' => 'before',
668	]
669	);
670
671	$this->add_responsive_control(
672	'form_input_width',
673	[
674	'label' => __('Input Width', 'fluentform'),
675	'type' => Controls_Manager::SLIDER,
676	'range' => [
677	'px' => [
678	'min' => 0,
679	'max' => 1200,
680	'step' => 1,
681	],
682	],
683	'size_units' => ['px', 'em', '%'],
684	'selectors' => [
685	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'width: {{SIZE}}{{UNIT}}',
686	],
687	]
688	);
689
690	$this->add_responsive_control(
691	'form_input_height',
692	[
693	'label' => __('Input Height', 'fluentform'),
694	'type' => Controls_Manager::SLIDER,
695	'range' => [
696	'px' => [
697	'min' => 0,
698	'max' => 80,
699	'step' => 1,
700	],
701	],
702	'size_units' => ['px', 'em', '%'],
703	'selectors' => [
704	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'height: {{SIZE}}{{UNIT}}',
705	],
706	]
707	);
708
709	$this->add_responsive_control(
710	'form_textarea_width',
711	[
712	'label' => __('Textarea Width', 'fluentform'),
713	'type' => Controls_Manager::SLIDER,
714	'range' => [
715	'px' => [
716	'min' => 0,
717	'max' => 1200,
718	'step' => 1,
719	],
720	],
721	'size_units' => ['px', 'em', '%'],
722	'selectors' => [
723	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea' => 'width: {{SIZE}}{{UNIT}}',
724	],
725	]
726	);
727
728	$this->add_responsive_control(
729	'form_textarea_height',
730	[
731	'label' => __('Textarea Height', 'fluentform'),
732	'type' => Controls_Manager::SLIDER,
733	'range' => [
734	'px' => [
735	'min' => 0,
736	'max' => 400,
737	'step' => 1,
738	],
739	],
740	'size_units' => ['px', 'em', '%'],
741	'selectors' => [
742	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea' => 'height: {{SIZE}}{{UNIT}}',
743	],
744	]
745	);
746
747	$this->add_responsive_control(
748	'form_field_padding',
749	[
750	'label' => __('Padding', 'fluentform'),
751	'type' => Controls_Manager::DIMENSIONS,
752	'size_units' => ['px', 'em', '%'],
753	'selectors' => [
754	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
755	],
756	]
757	);
758
759	$this->add_responsive_control(
760	'form_field_spacing',
761	[
762	'label' => __('Spacing', 'fluentform'),
763	'type' => Controls_Manager::SLIDER,
764	'range' => [
765	'px' => [
766	'min' => 0,
767	'max' => 100,
768	'step' => 1,
769	],
770	],
771	'size_units' => ['px', 'em', '%'],
772	'selectors' => [
773	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group' => 'margin-bottom: {{SIZE}}{{UNIT}}',
774	],
775	]
776	);
777
778	$this->add_group_control(
779	Group_Control_Typography::get_type(),
780	[
781	'name' => 'form_field_typography',
782	'label' => __('Typography', 'fluentform'),
783	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select',
784	'separator' => 'before',
785	]
786	);
787
788	$this->add_group_control(
789	Group_Control_Box_Shadow::get_type(),
790	[
791	'name' => 'form_field_box_shadow',
792	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select',
793	'separator' => 'before',
794	]
795	);
796
797	$this->end_controls_tab();
798
799	$this->start_controls_tab(
800	'tab_form_fields_focus',
801	[
802	'label' => __('Focus', 'fluentform'),
803	]
804	);
805
806	$this->add_control(
807	'form_field_bg_color_focus',
808	[
809	'label' => __('Background Color', 'fluentform'),
810	'type' => Controls_Manager::COLOR,
811	'default' => '',
812	'selectors' => [
813	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):focus, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea:focus' => 'background-color: {{VALUE}}',
814	],
815	]
816	);
817
818	$this->add_group_control(
819	Group_Control_Border::get_type(),
820	[
821	'name' => 'form_input_focus_border',
822	'label' => __('Border', 'fluentform'),
823	'placeholder' => '1px',
824	'default' => '1px',
825	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):focus, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea:focus',
826	]
827	);
828
829	$this->add_group_control(
830	Group_Control_Box_Shadow::get_type(),
831	[
832	'name' => 'form_input_focus_box_shadow',
833	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):focus, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea:focus',
834	'separator' => 'before',
835	]
836	);
837
838	$this->end_controls_tab();
839
840	$this->end_controls_tabs();
841
842	$this->end_controls_section();
843	}
844	protected function register_terms_gdpr_style_controls()
845	{
846
847	$this->start_controls_section(
848	'section_form_terms_gdpr_style',
849	[
850	'label' => __('GDPR , Terms & Condition ', 'fluentform'),
851	'tab' => Controls_Manager::TAB_STYLE,
852	]
853	);
854
855	$this->add_responsive_control(
856	'form_terms_gdpr_alignment',
857	[
858	'label' => __('Alignment', 'fluentform'),
859	'type' => Controls_Manager::CHOOSE,
860	'options' => [
861	'left' => [
862	'title' => __('Left', 'fluentform'),
863	'icon' => 'fa fa-align-left',
864	],
865	'center' => [
866	'title' => __('Center', 'fluentform'),
867	'icon' => 'fa fa-align-center',
868	],
869	'right' => [
870	'title' => __('Right', 'fluentform'),
871	'icon' => 'fa fa-align-right',
872	],
873	],
874	'default' => '',
875	'selectors' => [ '{{WRAPPER}} .fluentform-widget-wrapper .ff_t_c' => 'text-align: {{VALUE}};'],
876	]
877	);
878
879	$this->add_group_control(
880	Group_Control_Typography::get_type(),
881	[
882	'name' => 'form_terms_gdpr_typography',
883	'label' => __('Typography', 'fluentform'),
884	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff_t_c ',
885
886	]
887	);
888	$this->add_control(
889	'form_terms_gdpr_color',
890	[
891	'label' => __('Color', 'fluentform'),
892	'type' => Controls_Manager::COLOR,
893	'default' => '',
894	'selectors' => ['{{WRAPPER}} .fluentform-widget-wrapper .ff_t_c ' => 'color: {{VALUE}};'],
895	]
896	);
897
898	$this->end_controls_section();
899	}
900
901	protected function register_placeholder_style_controls(){
902	$this->start_controls_section(
903	'section_placeholder_style',
904	[
905	'label' => __('Placeholder', 'fluentform'),
906	'tab' => Controls_Manager::TAB_STYLE,
907	'condition' => [
908	'placeholder_switch' => 'yes',
909	],
910	]
911	);
912
913	$this->add_control(
914	'form_placeholder_text_color',
915	[
916	'label' => __('Text Color', 'fluentform'),
917	'type' => Controls_Manager::COLOR,
918	'selectors' => [
919	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group input::-webkit-input-placeholder, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea::-webkit-input-placeholder' => 'color: {{VALUE}}',
920	],
921	'condition' => [
922	'placeholder_switch' => 'yes',
923	],
924	]
925	);
926
927	$this->end_controls_section();
928	}
929
930	protected function register_radio_checkbox_style_controls(){
931
932	$this->start_controls_section(
933	'section_form_radio_checkbox_style',
934	[
935	'label' => __('Radio & Checkbox', 'fluentform'),
936	'tab' => Controls_Manager::TAB_STYLE,
937	]
938	);
939
940	$this->add_control(
941	'form_custom_radio_checkbox',
942	[
943	'label' => __('Custom Styles', 'fluentform'),
944	'type' => Controls_Manager::SWITCHER,
945	'label_on' => __('Yes', 'fluentform'),
946	'label_off' => __('No', 'fluentform'),
947	'return_value' => 'yes',
948	]
949	);
950
951	$this->add_responsive_control(
952	'form_radio_checkbox_size',
953	[
954	'label' => __('Size', 'fluentform'),
955	'type' => Controls_Manager::SLIDER,
956	'default' => [
957	'size' => '15',
958	'unit' => 'px',
959	],
960	'range' => [
961	'px' => [
962	'min' => 0,
963	'max' => 80,
964	'step' => 1,
965	],
966	],
967	'size_units' => ['px', 'em', '%'],
968	'selectors' => [
969	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"], {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}}',
970	],
971	'condition' => [
972	'form_custom_radio_checkbox' => 'yes',
973	],
974	]
975	);
976
977	$this->add_responsive_control(
978	'form_radio_checkbox_text_indent',
979	[
980	'label' => __('Text Indent', 'fluentform'),
981	'type' => Controls_Manager::SLIDER,
982	'range' => [
983	'px' => [
984	'min' => 0,
985	'max' => 60,
986	'step' => 1,
987	],
988	'%' => [
989	'min' => 0,
990	'max' => 30,
991	'step' => 1,
992	],
993	],
994	'size_units' => ['px', 'em', '%'],
995	'selectors' => [
996	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"], {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]' => 'margin-right: {{SIZE}}{{UNIT}}',
997	],
998	'condition' => [
999	'form_custom_radio_checkbox' => 'yes',
1000	],
1001	]
1002	);
1003
1004	$this->start_controls_tabs('tabs_radio_checkbox_style');
1005
1006	$this->start_controls_tab(
1007	'form_radio_checkbox_normal',
1008	[
1009	'label' => __('Normal', 'fluentform'),
1010	'condition' => [
1011	'form_custom_radio_checkbox' => 'yes',
1012	],
1013	]
1014	);
1015
1016	$this->add_control(
1017	'form_radio_checkbox_bg_color',
1018	[
1019	'label' => __('Background Color', 'fluentform'),
1020	'type' => Controls_Manager::COLOR,
1021	'default' => '',
1022	'selectors' => [
1023	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after' => 'background-color: {{VALUE}}',
1024	],
1025	'condition' => [
1026	'form_custom_radio_checkbox' => 'yes',
1027	],
1028	]
1029	);
1030
1031	$this->add_responsive_control(
1032	'form_checkbox_border_width',
1033	[
1034	'label' => __('Border Width', 'fluentform'),
1035	'type' => Controls_Manager::SLIDER,
1036	'range' => [
1037	'px' => [
1038	'min' => 0,
1039	'max' => 15,
1040	'step' => 1,
1041	],
1042	],
1043	'size_units' => ['px'],
1044	'selectors' => [
1045	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after' => 'border-width: {{SIZE}}{{UNIT}}',
1046	],
1047	'condition' => [
1048	'form_custom_radio_checkbox' => 'yes',
1049	],
1050	]
1051	);
1052
1053	$this->add_control(
1054	'form_checkbox_border_color',
1055	[
1056	'label' => __('Border Color', 'fluentform'),
1057	'type' => Controls_Manager::COLOR,
1058	'default' => '',
1059	'selectors' => [
1060	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after' => 'border-color: {{VALUE}}',
1061	],
1062	'condition' => [
1063	'form_custom_radio_checkbox' => 'yes',
1064	],
1065	]
1066	);
1067
1068	$this->add_control(
1069	'form_checkbox_heading',
1070	[
1071	'label' => __('Checkbox', 'fluentform'),
1072	'type' => Controls_Manager::HEADING,
1073	'condition' => [
1074	'form_custom_radio_checkbox' => 'yes',
1075	],
1076	]
1077	);
1078
1079	$this->add_control(
1080	'form_checkbox_border_radius',
1081	[
1082	'label' => __('Border Radius', 'fluentform'),
1083	'type' => Controls_Manager::DIMENSIONS,
1084	'size_units' => ['px', 'em', '%'],
1085	'selectors' => [
1086	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1087	],
1088	'condition' => [
1089	'form_custom_radio_checkbox' => 'yes',
1090	],
1091	]
1092	);
1093
1094	$this->add_control(
1095	'form_radio_heading',
1096	[
1097	'label' => __('Radio Buttons', 'fluentform'),
1098	'type' => Controls_Manager::HEADING,
1099	'condition' => [
1100	'form_custom_radio_checkbox' => 'yes',
1101	],
1102	]
1103	);
1104
1105	$this->add_control(
1106	'form_radio_border_radius',
1107	[
1108	'label' => __('Border Radius', 'fluentform'),
1109	'type' => Controls_Manager::DIMENSIONS,
1110	'size_units' => ['px', 'em', '%'],
1111	'selectors' => [
1112	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1113	],
1114	'condition' => [
1115	'form_custom_radio_checkbox' => 'yes',
1116	],
1117	]
1118	);
1119
1120	$this->end_controls_tab();
1121
1122	$this->start_controls_tab(
1123	'form_radio_checkbox_checked',
1124	[
1125	'label' => __('Checked', 'fluentform'),
1126	'condition' => [
1127	'form_custom_radio_checkbox' => 'yes',
1128	],
1129	]
1130	);
1131
1132	$this->add_control(
1133	'form_radio_checkbox_bg_color_checked',
1134	[
1135	'label' => __('Background Color', 'fluentform'),
1136	'type' => Controls_Manager::COLOR,
1137	'default' => '',
1138	'selectors' => [
1139	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:checked:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:checked:after' => 'background-color: {{VALUE}}',
1140	],
1141	'condition' => [
1142	'form_custom_radio_checkbox' => 'yes',
1143	],
1144	]
1145	);
1146
1147	$this->add_control(
1148	'form_radio_checkbox_border_checked',
1149	[
1150	'label' => __('Border Color', 'fluentform'),
1151	'type' => Controls_Manager::COLOR,
1152	'default' => '',
1153	'selectors' => [
1154	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:checked:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:checked:after' => 'border-color: {{VALUE}}',
1155	],
1156	'condition' => [
1157	'form_custom_radio_checkbox' => 'yes',
1158	],
1159	]
1160	);
1161
1162	$this->end_controls_tab();
1163
1164	$this->end_controls_tabs();
1165
1166	$this->end_controls_section();
1167	}
1168
1169	protected function register_section_break_style_controls(){
1170	$this->start_controls_section(
1171	'form_section_break_style',
1172	[
1173	'label' => __('Section Break', 'fluentform'),
1174	'tab' => Controls_Manager::TAB_STYLE,
1175	]
1176	);
1177
1178	$this->add_control(
1179	'form_section_break_label',
1180	[
1181	'label' => __('Label', 'fluentform'),
1182	'type' => Controls_Manager::HEADING
1183	]
1184	);
1185
1186	$this->add_control(
1187	'form_section_break_label_color',
1188	[
1189	'label' => __('Color', 'fluentform'),
1190	'type' => Controls_Manager::COLOR,
1191	'default' => '',
1192	'selectors' => [
1193	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-el-section-title' => 'color: {{VALUE}};',
1194	],
1195	]
1196	);
1197
1198	$this->add_group_control(
1199	Group_Control_Typography::get_type(),
1200	[
1201	'name' => 'form_section_break_label_typography',
1202	'label' => __('Typography', 'fluentform'),
1203	'selector' => '.fluentform-widget-wrapper .ff-el-section-break .ff-el-section-title',
1204	'separator' => 'before',
1205	]
1206	);
1207
1208	$this->add_responsive_control(
1209	'form_section_break_label_padding',
1210	[
1211	'label' => __('Padding', 'fluentform'),
1212	'type' => Controls_Manager::DIMENSIONS,
1213	'size_units' => ['px', 'em', '%'],
1214	'selectors' => [
1215	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-el-section-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1216	],
1217	]
1218	);
1219
1220	$this->add_responsive_control(
1221	'form_section_break_label_margin',
1222	[
1223	'label' => __('Margin', 'fluentform'),
1224	'type' => Controls_Manager::DIMENSIONS,
1225	'size_units' => ['px', 'em', '%'],
1226	'selectors' => [
1227	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-el-section-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1228	],
1229	]
1230	);
1231
1232	$this->add_control(
1233	'form_section_break_description',
1234	[
1235	'label' => __('Description', 'fluentform'),
1236	'type' => Controls_Manager::HEADING,
1237	'separator' => 'before'
1238	]
1239	);
1240
1241	$this->add_control(
1242	'form_section_break_description_color',
1243	[
1244	'label' => __('Color', 'fluentform'),
1245	'type' => Controls_Manager::COLOR,
1246	'default' => '',
1247	'selectors' => [
1248	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-section_break_desk' => 'color: {{VALUE}};',
1249	],
1250	]
1251	);
1252
1253	$this->add_group_control(
1254	Group_Control_Typography::get_type(),
1255	[
1256	'name' => 'form_section_break_description_typography',
1257	'label' => __('Typography', 'fluentform'),
1258	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break div',
1259	'separator' => 'before',
1260	]
1261	);
1262
1263	$this->add_responsive_control(
1264	'form_section_break_description_padding',
1265	[
1266	'label' => __('Padding', 'fluentform'),
1267	'type' => Controls_Manager::DIMENSIONS,
1268	'size_units' => ['px', 'em', '%'],
1269	'selectors' => [
1270	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-section_break_desk' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1271	],
1272	]
1273	);
1274
1275	$this->add_responsive_control(
1276	'form_section_break_description_margin',
1277	[
1278	'label' => __('Margin', 'fluentform'),
1279	'type' => Controls_Manager::DIMENSIONS,
1280	'size_units' => ['px', 'em', '%'],
1281	'selectors' => [
1282	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-section_break_desk' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1283	],
1284	]
1285	);
1286
1287	$this->add_responsive_control(
1288	'form_section_break_alignment',
1289	[
1290	'label' => __('Alignment', 'fluentform'),
1291	'type' => Controls_Manager::CHOOSE,
1292	'options' => [
1293	'left' => [
1294	'title' => __('Left', 'fluentform'),
1295	'icon' => 'eicon-h-align-left',
1296	],
1297	'center' => [
1298	'title' => __('Center', 'fluentform'),
1299	'icon' => 'eicon-h-align-center',
1300	],
1301	'right' => [
1302	'title' => __('Right', 'fluentform'),
1303	'icon' => 'eicon-h-align-right',
1304	],
1305	],
1306	'prefix_class' => 'fluentform-widget-section-break-content-'
1307	]
1308	);
1309
1310	$this->end_controls_section();
1311	}
1312
1313	protected function register_checkbox_grid_style_controls(){
1314
1315	$this->start_controls_section(
1316	'section_form_checkbox_grid',
1317	[
1318	'label' => __('Checkbox Grid', 'fluentform'),
1319	'tab' => Controls_Manager::TAB_STYLE,
1320	]
1321	);
1322
1323	$this->add_control(
1324	'section_form_checkbox_grid_head',
1325	[
1326	'label' => __('Grid Table Head', 'fluentform'),
1327	'type' => Controls_Manager::HEADING,
1328	'separator' => 'before'
1329	]
1330	);
1331
1332	$this->add_control(
1333	'form_checkbox_grid_table_head_text_color',
1334	[
1335	'label' => __('Color', 'fluentform'),
1336	'type' => Controls_Manager::COLOR,
1337	'default' => '',
1338	'selectors' => [
1339	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead th' => 'color: {{VALUE}};',
1340	],
1341	]
1342	);
1343
1344	$this->add_control(
1345	'form_checkbox_grid_table_head_color',
1346	[
1347	'label' => __('Background Color', 'fluentform'),
1348	'type' => Controls_Manager::COLOR,
1349	'default' => '',
1350	'selectors' => [
1351	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead th' => 'background-color: {{VALUE}};',
1352	],
1353	]
1354	);
1355
1356	$this->add_group_control(
1357	Group_Control_Typography::get_type(),
1358	[
1359	'name' => 'form_checkbox_grid_table_head_typography',
1360	'label' => __('Typography', 'fluentform'),
1361	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead th',
1362	'separator' => 'before',
1363	]
1364	);
1365
1366	$this->add_responsive_control(
1367	'form_checkbox_grid_table_head_height',
1368	[
1369	'label' => __('Height', 'fluentform'),
1370	'type' => Controls_Manager::SLIDER,
1371	'range' => [
1372	'px' => [
1373	'min' => 0,
1374	'max' => 1200,
1375	'step' => 1,
1376	],
1377	],
1378	'size_units' => ['px', '%'],
1379	'selectors' => [
1380	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead th' => 'height: {{SIZE}}{{UNIT}}',
1381	]
1382	]
1383	);
1384
1385	$this->add_group_control(
1386	Group_Control_Border::get_type(),
1387	[
1388	'name' => 'form_checkbox_grid_table_head_border',
1389	'label' => __('Border', 'fluentform'),
1390	'default' => '',
1391	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead tr',
1392	]
1393	);
1394
1395	$this->add_responsive_control(
1396	'form_checkbox_grid_table_head_padding',
1397	[
1398	'label' => __('Padding', 'fluentform'),
1399	'type' => Controls_Manager::DIMENSIONS,
1400	'size_units' => ['px', 'em', '%'],
1401	'selectors' => [
1402	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead th' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1403	],
1404	]
1405	);
1406
1407	$this->add_control(
1408	'form_checkbox_grid_table_item',
1409	[
1410	'label' => __('Grid Table Item', 'fluentform'),
1411	'type' => Controls_Manager::HEADING,
1412	'separator' => 'before'
1413	]
1414	);
1415
1416	$this->add_control(
1417	'form_checkbox_grid_table_item_color',
1418	[
1419	'label' => __('Color', 'fluentform'),
1420	'type' => Controls_Manager::COLOR,
1421	'default' => '',
1422	'selectors' => [
1423	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr td' => 'color: {{VALUE}} !important;',
1424	],
1425	]
1426	);
1427
1428	$this->add_control(
1429	'form_checkbox_grid_table_item_bg_color',
1430	[
1431	'label' => __('Background Color', 'fluentform'),
1432	'type' => Controls_Manager::COLOR,
1433	'default' => '',
1434	'selectors' => [
1435	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr td' => 'background-color: {{VALUE}};',
1436	],
1437	]
1438	);
1439
1440	$this->add_control(
1441	'form_checkbox_grid_table_item_odd_bg_color',
1442	[
1443	'label' => __('Odd Item Background Color', 'fluentform'),
1444	'type' => Controls_Manager::COLOR,
1445	'default' => '',
1446	'selectors' => [
1447	'{{WRAPPER}} .fluentform-widget-wrapper tbody>tr:nth-child(2n)>td' => 'background-color: {{VALUE}} !important;',
1448	],
1449	]
1450	);
1451
1452	$this->add_group_control(
1453	Group_Control_Typography::get_type(),
1454	[
1455	'name' => 'form_checkbox_grid_table_item_typography',
1456	'label' => __('Typography', 'fluentform'),
1457	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr td',
1458	]
1459	);
1460
1461	$this->add_responsive_control(
1462	'form_checkbox_grid_table_item_height',
1463	[
1464	'label' => __('Height', 'fluentform'),
1465	'type' => Controls_Manager::SLIDER,
1466	'range' => [
1467	'px' => [
1468	'min' => 0,
1469	'max' => 1200,
1470	'step' => 1,
1471	],
1472	],
1473	'size_units' => ['px', '%'],
1474	'selectors' => [
1475	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr td' => 'height: {{SIZE}}{{UNIT}}',
1476	]
1477	]
1478	);
1479
1480	$this->add_group_control(
1481	Group_Control_Border::get_type(),
1482	[
1483	'name' => 'form_checkbox_grid_table_item_border',
1484	'label' => __('Border', 'fluentform'),
1485	'default' => '',
1486	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr',
1487	]
1488	);
1489
1490	$this->add_responsive_control(
1491	'form_checkbox_grid_table_item_padding',
1492	[
1493	'label' => __('Padding', 'fluentform'),
1494	'type' => Controls_Manager::DIMENSIONS,
1495	'size_units' => ['px', 'em', '%'],
1496	'selectors' => [
1497	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr td' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1498	],
1499	]
1500	);
1501
1502	$this->end_controls_section();
1503	}
1504
1505	protected function register_address_line_style_controls(){
1506	$this->start_controls_section(
1507	'section_form_address_line_style',
1508	[
1509	'label' => __('Address Line', 'fluentform'),
1510	'tab' => Controls_Manager::TAB_STYLE,
1511	]
1512	);
1513
1514	$this->add_control(
1515	'address_line_label_color',
1516	[
1517	'label' => __('Label Color', 'fluentform'),
1518	'type' => Controls_Manager::COLOR,
1519	'default' => '',
1520	'selectors' => [
1521	'{{WRAPPER}} .fluentform-widget-wrapper .fluent-address label' => 'color: {{VALUE}};',
1522	],
1523	]
1524	);
1525
1526	$this->add_group_control(
1527	Group_Control_Typography::get_type(),
1528	[
1529	'name' => 'address_line_label_typography',
1530	'label' => __('Typography', 'fluentform'),
1531	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .fluent-address label',
1532	]
1533	);
1534
1535	$this->end_controls_section();
1536	}
1537
1538	protected function register_image_upload_style_controls(){
1539	$this->start_controls_section(
1540	'section_form_image_upload_style',
1541	[
1542	'label' => __('Image Upload', 'fluentform'),
1543	'tab' => Controls_Manager::TAB_STYLE,
1544	]
1545	);
1546
1547	$this->start_controls_tabs('tabs_form_image_upload_button_style');
1548
1549	$this->start_controls_tab(
1550	'tab_form_image_upload_button_normal',
1551	[
1552	'label' => __('Normal', 'fluentform'),
1553	]
1554	);
1555
1556	$this->add_control(
1557	'form_image_upload_bg_color',
1558	[
1559	'label' => __('Background Color', 'fluentform'),
1560	'type' => Controls_Manager::COLOR,
1561	'default' => '',
1562	'selectors' => [
1563	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn' => 'background-color: {{VALUE}};',
1564	],
1565	]
1566	);
1567
1568	$this->add_group_control(
1569	Group_Control_Border::get_type(),
1570	[
1571	'name' => 'form_image_upload_button_border_normal',
1572	'label' => __('Border', 'fluentform'),
1573	'default' => '',
1574	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn',
1575	]
1576	);
1577
1578	$this->add_control(
1579	'form_image_upload_button_border_radius',
1580	[
1581	'label' => __('Border Radius', 'fluentform'),
1582	'type' => Controls_Manager::DIMENSIONS,
1583	'size_units' => ['px', 'em', '%'],
1584	'selectors' => [
1585	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1586	],
1587	]
1588	);
1589
1590	$this->add_responsive_control(
1591	'form_image_upload_button_padding',
1592	[
1593	'label' => __('Padding', 'fluentform'),
1594	'type' => Controls_Manager::DIMENSIONS,
1595	'size_units' => ['px', 'em', '%'],
1596	'selectors' => [
1597	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1598	],
1599	]
1600	);
1601
1602	$this->add_group_control(
1603	Group_Control_Typography::get_type(),
1604	[
1605	'name' => 'form_image_upload_typography',
1606	'label' => __('Typography', 'fluentform'),
1607	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn',
1608	]
1609	);
1610
1611	$this->add_group_control(
1612	Group_Control_Box_Shadow::get_type(),
1613	[
1614	'name' => 'form_image_upload_button_box_shadow',
1615	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn',
1616	]
1617	);
1618
1619	$this->end_controls_tab();
1620
1621	$this->start_controls_tab(
1622	'tab_form_image_upload_button_hover',
1623	[
1624	'label' => __('Hover', 'fluentform'),
1625	]
1626	);
1627
1628	$this->add_control(
1629	'form_image_upload_button_bg_color_hover',
1630	[
1631	'label' => __('Background Color', 'fluentform'),
1632	'type' => Controls_Manager::COLOR,
1633	'default' => '',
1634	'selectors' => [
1635	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn:hover' => 'background-color: {{VALUE}} !important;',
1636	],
1637	]
1638	);
1639
1640	$this->add_control(
1641	'form_image_upload_button_text_color_hover',
1642	[
1643	'label' => __('Text Color', 'fluentform'),
1644	'type' => Controls_Manager::COLOR,
1645	'default' => '',
1646	'selectors' => [
1647	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn:hover' => 'color: {{VALUE}} !important;',
1648	],
1649	]
1650	);
1651
1652	$this->add_control(
1653	'form_image_upload_button_border_color_hover',
1654	[
1655	'label' => __('Border Color', 'fluentform'),
1656	'type' => Controls_Manager::COLOR,
1657	'default' => '',
1658	'selectors' => [
1659	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn:hover' => 'border-color: {{VALUE}}',
1660	],
1661	]
1662	);
1663
1664	$this->end_controls_tab();
1665
1666	$this->end_controls_tabs();
1667	$this->end_controls_section();
1668	}
1669
1670	protected function register_pagination_style_controls(){
1671	if( defined("FLUENTFORMPRO") ) {
1672
1673	$this->start_controls_section(
1674	'section_form_pagination_style',
1675	[
1676	'label' => __('Pagination', 'fluentform'),
1677	'tab' => Controls_Manager::TAB_STYLE,
1678	]
1679	);
1680
1681	$this->add_control(
1682	'form_pagination_progressbar_label',
1683	[
1684	'label' => __('Progressbar Label', 'fluentform'),
1685	'type' => Controls_Manager::HEADING
1686	]
1687	);
1688
1689	$this->add_control(
1690	'show_label',
1691	[
1692	'label' => __( 'Show Label', 'fluentform' ),
1693	'type' => Controls_Manager::SWITCHER,
1694	'label_on' => __( 'Show', 'fluentform' ),
1695	'label_off' => __( 'Hide', 'fluentform' ),
1696	'return_value' => 'yes',
1697	'default' => 'yes',
1698	'prefix_class' => 'fluent-form-widget-step-header-'
1699	]
1700	);
1701
1702	$this->add_control(
1703	'form_progressbar_label_color',
1704	[
1705	'label' => __( 'Label Color', 'fluentform' ),
1706	'type' => Controls_Manager::COLOR,
1707	'scheme' => [
1708	'type' => Scheme_Color::get_type(),
1709	'value' => Scheme_Color::COLOR_1,
1710	],
1711	'selectors' => [
1712	'{{WRAPPER}} .ff-el-progress-status' => 'color: {{VALUE}}',
1713	],
1714	'condition' => [
1715	'show_label' => 'yes'
1716	]
1717	]
1718	);
1719
1720	$this->add_group_control(
1721	Group_Control_Typography::get_type(),
1722	[
1723	'name' => 'form_progressbar_label_typography',
1724	'label' => __( 'Typography', 'fluentform' ),
1725	'scheme' => Scheme_Typography::TYPOGRAPHY_1,
1726	'selector' => '{{WRAPPER}} .ff-el-progress-status',
1727	'condition' => [
1728	'show_label' => 'yes'
1729	]
1730	]
1731	);
1732
1733	$this->add_control(
1734	'form_progressbar_label_space',
1735	[
1736	'label' => __( 'Spacing', 'fluentform' ),
1737	'type' => Controls_Manager::DIMENSIONS,
1738	'size_units' => [ 'px', '%', 'em' ],
1739	'selectors' => [
1740	'{{WRAPPER}} .ff-el-progress-status' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1741	],
1742	'condition' => [
1743	'show_label' => 'yes'
1744	],
1745	'separator' => 'after'
1746	]
1747	);
1748
1749	$this->add_control(
1750	'form_pagination_progressbar',
1751	[
1752	'label' => __('Progressbar', 'fluentform'),
1753	'type' => Controls_Manager::HEADING,
1754	]
1755	);
1756
1757	$this->add_control(
1758	'show_form_progressbar',
1759	[
1760	'label' => __( 'Show Progressbar', 'fluentform' ),
1761	'type' => Controls_Manager::SWITCHER,
1762	'label_on' => __( 'Show', 'fluentform' ),
1763	'label_off' => __( 'Hide', 'fluentform' ),
1764	'return_value' => 'yes',
1765	'default' => 'yes',
1766	'prefix_class' => 'fluent-form-widget-step-progressbar-'
1767	]
1768	);
1769
1770	$this->start_controls_tabs('form_progressbar_style_tabs');
1771
1772	$this->start_controls_tab(
1773	'form_progressbar_normal',
1774	[
1775	'label' => __('Normal', 'fluentform'),
1776	'condition' => [
1777	'show_form_progressbar' => 'yes'
1778	],
1779	]
1780	);
1781
1782	$this->add_group_control(
1783	Group_Control_Background::get_type(),
1784	[
1785	'name' => 'form_progressbar_bg',
1786	'label' => __( 'Background', 'fluentform' ),
1787	'types' => [ 'classic', 'gradient' ],
1788	'selector' => '{{WRAPPER}} .ff-el-progress',
1789	'condition' => [
1790	'show_form_progressbar' => 'yes'
1791	],
1792	'exclude' => [
1793	'image'
1794	]
1795	]
1796	);
1797
1798	$this->add_control(
1799	'form_progressbar_color',
1800	[
1801	'label' => __( 'Text Color', 'fluentform' ),
1802	'type' => Controls_Manager::COLOR,
1803	'scheme' => [
1804	'type' => Scheme_Color::get_type(),
1805	'value' => Scheme_Color::COLOR_1,
1806	],
1807	'selectors' => [
1808	'{{WRAPPER}} .ff-el-progress-bar span' => 'color: {{VALUE}};',
1809	],
1810	'condition' => [
1811	'show_form_progressbar' => 'yes'
1812	]
1813	]
1814	);
1815
1816	$this->add_control(
1817	'form_progressbar_height',
1818	[
1819	'label' => __( 'Height', 'fluentform' ),
1820	'type' => Controls_Manager::SLIDER,
1821	'size_units' => [ 'px' ],
1822	'range' => [
1823	'px' => [
1824	'min' => 0,
1825	'max' => 100,
1826	'step' => 1,
1827	]
1828	],
1829	'selectors' => [
1830	'{{WRAPPER}} .ff-el-progress' => 'height: {{SIZE}}{{UNIT}};',
1831	],
1832	'condition' => [
1833	'show_form_progressbar' => 'yes'
1834	]
1835	]
1836	);
1837
1838	$this->add_group_control(
1839	Group_Control_Border::get_type(),
1840	[
1841	'name' => 'form_progressbar_border',
1842	'label' => __( 'Border', 'fluentform' ),
1843	'selector' => '{{WRAPPER}} .ff-el-progress',
1844	'condition' => [
1845	'show_form_progressbar' => 'yes'
1846	]
1847	]
1848	);
1849
1850	$this->add_control(
1851	'form_progressbar_border_radius',
1852	[
1853	'label' => __( 'Border Radius', 'fluentform' ),
1854	'type' => Controls_Manager::DIMENSIONS,
1855	'size_units' => [ 'px', '%', 'em' ],
1856	'selectors' => [
1857	'{{WRAPPER}} .ff-el-progress' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1858	],
1859	'condition' => [
1860	'show_form_progressbar' => 'yes'
1861	]
1862	]
1863	);
1864
1865	$this->end_controls_tab();
1866
1867	$this->start_controls_tab(
1868	'form_progressbar_filled',
1869	[
1870	'label' => __('Filled', 'fluentform'),
1871	'condition' => [
1872	'show_form_progressbar' => 'yes'
1873	],
1874	]
1875	);
1876
1877	$this->add_group_control(
1878	Group_Control_Background::get_type(),
1879	[
1880	'name' => 'form_progressbar_bg_filled',
1881	'label' => __( 'Background', 'fluentform' ),
1882	'types' => [ 'classic', 'gradient' ],
1883	'selector' => '{{WRAPPER}} .ff-el-progress-bar',
1884	'condition' => [
1885	'show_form_progressbar' => 'yes'
1886	],
1887	'exclude' => [
1888	'image'
1889	]
1890	]
1891	);
1892
1893
1894	$this->end_controls_tab();
1895
1896	$this->end_controls_tabs();
1897
1898
1899
1900	$this->add_control(
1901	'form_pagination_button_style',
1902	[
1903	'label' => __('Button', 'fluentform'),
1904	'type' => Controls_Manager::HEADING,
1905	'separator' => 'before'
1906	]
1907	);
1908
1909	$this->start_controls_tabs(
1910	'form_pagination_button_style_tabs'
1911	);
1912
1913
1914	$this->start_controls_tab(
1915	'form_pagination_button',
1916	[
1917	'label' => __('Normal', 'fluentform'),
1918	]
1919	);
1920
1921
1922	$this->add_control(
1923	'form_pagination_button_color',
1924	[
1925	'label' => __( 'Color', 'fluentform' ),
1926	'type' => Controls_Manager::COLOR,
1927	'selectors' => [
1928	'{{WRAPPER}} .step-nav button' => 'color: {{VALUE}};',
1929	]
1930	]
1931	);
1932
1933	$this->add_group_control(
1934	Group_Control_Typography::get_type(),
1935	[
1936	'name' => 'form_pagination_button_typography',
1937	'label' => __( 'Typography', 'fluentform' ),
1938	'scheme' => Scheme_Typography::TYPOGRAPHY_1,
1939	'selector' => '{{WRAPPER}} .step-nav button',
1940	]
1941	);
1942
1943	$this->add_group_control(
1944	Group_Control_Background::get_type(),
1945	[
1946	'name' => 'form_pagination_button_bg',
1947	'label' => __( 'Background', 'fluentform' ),
1948	'types' => [ 'classic', 'gradient' ],
1949	'selector' => '{{WRAPPER}} .step-nav button',
1950	]
1951	);
1952
1953	$this->add_group_control(
1954	Group_Control_Border::get_type(),
1955	[
1956	'name' => 'form_pagination_button_border',
1957	'label' => __( 'Border', 'fluentform' ),
1958	'selector' => '{{WRAPPER}} .step-nav button',
1959	]
1960	);
1961
1962	$this->add_control(
1963	'form_pagination_button_border_radius',
1964	[
1965	'label' => __( 'Border Radius', 'fluentform' ),
1966	'type' => Controls_Manager::DIMENSIONS,
1967	'size_units' => [ 'px', '%', 'em' ],
1968	'selectors' => [
1969	'{{WRAPPER}} .step-nav button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1970	],
1971	]
1972	);
1973
1974	$this->add_control(
1975	'form_pagination_button_padding',
1976	[
1977	'label' => __( 'Padding', 'fluentform' ),
1978	'type' => Controls_Manager::DIMENSIONS,
1979	'size_units' => [ 'px', '%', 'em' ],
1980	'selectors' => [
1981	'{{WRAPPER}} .step-nav button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1982	],
1983	]
1984	);
1985
1986	$this->end_controls_tab();
1987
1988	$this->start_controls_tab(
1989	'form_pagination_button_hover',
1990	[
1991	'label' => __('Hover', 'fluentform'),
1992	]
1993	);
1994
1995	$this->add_control(
1996	'form_pagination_button_hover_color',
1997	[
1998	'label' => __( 'Color', 'fluentform' ),
1999	'type' => Controls_Manager::COLOR,
2000	'selectors' => [
2001	'{{WRAPPER}} .step-nav button:hover' => 'color: {{VALUE}};',
2002	]
2003	]
2004	);
2005
2006	$this->add_group_control(
2007	Group_Control_Background::get_type(),
2008	[
2009	'name' => 'form_pagination_button_hover_bg',
2010	'label' => __( 'Background', 'fluentform' ),
2011	'types' => [ 'classic', 'gradient' ],
2012	'selector' => '{{WRAPPER}} .step-nav button:hover',
2013	]
2014	);
2015
2016	$this->add_control(
2017	'form_pagination_button_border_hover_color',
2018	[
2019	'label' => __( 'Border Color', 'fluentform' ),
2020	'type' => Controls_Manager::COLOR,
2021	'selectors' => [
2022	'{{WRAPPER}} .step-nav button:hover' => 'border-color: {{VALUE}};',
2023	]
2024	]
2025	);
2026
2027	$this->add_control(
2028	'form_pagination_button_border_hover_radius',
2029	[
2030	'label' => __( 'Border Radius', 'fluentform' ),
2031	'type' => Controls_Manager::DIMENSIONS,
2032	'size_units' => [ 'px', '%', 'em' ],
2033	'selectors' => [
2034	'{{WRAPPER}} .step-nav button:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2035	],
2036	]
2037	);
2038
2039	$this->end_controls_tab();
2040
2041	$this->end_controls_tabs();
2042
2043
2044	$this->end_controls_section();
2045	}
2046	}
2047
2048	protected function register_submit_button_style_controls(){
2049	$this->start_controls_section(
2050	'section_form_submit_button_style',
2051	[
2052	'label' => __('Submit Button', 'fluentform'),
2053	'tab' => Controls_Manager::TAB_STYLE,
2054	]
2055	);
2056
2057	$this->add_responsive_control(
2058	'form_submit_button_align',
2059	[
2060	'label' => __('Alignment', 'fluentform'),
2061	'type' => Controls_Manager::CHOOSE,
2062	'options' => [
2063	'left' => [
2064	'title' => __('Left', 'fluentform'),
2065	'icon' => 'eicon-h-align-left',
2066	],
2067	'center' => [
2068	'title' => __('Center', 'fluentform'),
2069	'icon' => 'eicon-h-align-center',
2070	],
2071	'right' => [
2072	'title' => __('Right', 'fluentform'),
2073	'icon' => 'eicon-h-align-right',
2074	],
2075	],
2076	'default' => '',
2077	'prefix_class' => 'fluentform-widget-submit-button-',
2078	'condition' => [
2079	'form_submit_button_width_type' => 'custom',
2080	],
2081	]
2082	);
2083
2084	$this->add_control(
2085	'form_submit_button_width_type',
2086	[
2087	'label' => __('Width', 'fluentform'),
2088	'type' => Controls_Manager::SELECT,
2089	'default' => 'custom',
2090	'options' => [
2091	'full-width' => __('Full Width', 'fluentform'),
2092	'custom' => __('Custom', 'fluentform'),
2093	],
2094	'prefix_class' => 'fluentform-widget-submit-button-',
2095	]
2096	);
2097
2098	$this->add_responsive_control(
2099	'form_submit_button_width',
2100	[
2101	'label' => __('Width', 'fluentform'),
2102	'type' => Controls_Manager::SLIDER,
2103	'range' => [
2104	'px' => [
2105	'min' => 0,
2106	'max' => 1200,
2107	'step' => 1,
2108	],
2109	],
2110	'size_units' => ['px', '%'],
2111	'selectors' => [
2112	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'width: {{SIZE}}{{UNIT}}',],
2113	'condition' => [
2114	'form_submit_button_width_type' => 'custom',
2115	],
2116	]
2117	);
2118
2119	$this->start_controls_tabs('tabs_submit_button_style');
2120
2121	$this->start_controls_tab(
2122	'tab_submit_button_normal',
2123	[
2124	'label' => __('Normal', 'fluentform'),
2125	]
2126	);
2127
2128	$this->add_control(
2129	'form_submit_button_bg_color_normal',
2130	[
2131	'label' => __('Background Color', 'fluentform'),
2132	'type' => Controls_Manager::COLOR,
2133	'default' => '#409EFF',
2134	'selectors' => [
2135	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'background-color: {{VALUE}} !important;',
2136	],
2137	]
2138	);
2139
2140	$this->add_control(
2141	'form_submit_button_text_color_normal',
2142	[
2143	'label' => __('Text Color', 'fluentform'),
2144	'type' => Controls_Manager::COLOR,
2145	'default' => '#ffffff',
2146	'selectors' => [
2147	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'color: {{VALUE}} !important;',
2148	],
2149	]
2150	);
2151
2152	$this->add_group_control(
2153	Group_Control_Border::get_type(),
2154	[
2155	'name' => 'form_submit_button_border_normal',
2156	'label' => __('Border', 'fluentform'),
2157	'placeholder' => '1px',
2158	'default' => '1px',
2159	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit',
2160	]
2161	);
2162
2163	$this->add_control(
2164	'form_submit_button_border_radius',
2165	[
2166	'label' => __('Border Radius', 'fluentform'),
2167	'type' => Controls_Manager::DIMENSIONS,
2168	'size_units' => ['px', 'em', '%'],
2169	'selectors' => [
2170	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2171	],
2172	]
2173	);
2174
2175	$this->add_responsive_control(
2176	'form_submit_button_padding',
2177	[
2178	'label' => __('Padding', 'fluentform'),
2179	'type' => Controls_Manager::DIMENSIONS,
2180	'size_units' => ['px', 'em', '%'],
2181	'selectors' => [
2182	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2183	],
2184	]
2185	);
2186
2187	$this->add_responsive_control(
2188	'form_submit_button_margin',
2189	[
2190	'label' => __('Margin Top', 'fluentform'),
2191	'type' => Controls_Manager::SLIDER,
2192	'range' => [
2193	'px' => [
2194	'min' => 0,
2195	'max' => 150,
2196	'step' => 1,
2197	],
2198	],
2199	'size_units' => ['px', 'em', '%'],
2200	'selectors' => [
2201	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'margin-top: {{SIZE}}{{UNIT}}',
2202	],
2203	]
2204	);
2205
2206	$this->add_group_control(
2207	Group_Control_Typography::get_type(),
2208	[
2209	'name' => 'form_submit_button_typography',
2210	'label' => __('Typography', 'fluentform'),
2211	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit',
2212	'separator' => 'before',
2213	]
2214	);
2215
2216	$this->add_group_control(
2217	Group_Control_Box_Shadow::get_type(),
2218	[
2219	'name' => 'form_submit_button_box_shadow',
2220	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit',
2221	'separator' => 'before',
2222	]
2223	);
2224
2225	$this->end_controls_tab();
2226
2227	$this->start_controls_tab(
2228	'tab_submit_button_hover',
2229	[
2230	'label' => __('Hover', 'fluentform'),
2231	]
2232	);
2233
2234	$this->add_control(
2235	'form_submit_button_bg_color_hover',
2236	[
2237	'label' => __('Background Color', 'fluentform'),
2238	'type' => Controls_Manager::COLOR,
2239	'default' => '',
2240	'selectors' => [
2241	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit:hover' => 'background-color: {{VALUE}} !important;',
2242	],
2243	]
2244	);
2245
2246	$this->add_control(
2247	'form_submit_button_text_color_hover',
2248	[
2249	'label' => __('Text Color', 'fluentform'),
2250	'type' => Controls_Manager::COLOR,
2251	'default' => '',
2252	'selectors' => [
2253	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit:hover' => 'color: {{VALUE}} !important;',
2254	],
2255	]
2256	);
2257
2258	$this->add_control(
2259	'form_submit_button_border_color_hover',
2260	[
2261	'label' => __('Border Color', 'fluentform'),
2262	'type' => Controls_Manager::COLOR,
2263	'default' => '',
2264	'selectors' => [
2265	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit:hover' => 'border-color: {{VALUE}}',
2266	],
2267	]
2268	);
2269
2270	$this->end_controls_tab();
2271
2272	$this->end_controls_tabs();
2273
2274	$this->end_controls_section();
2275	}
2276
2277	protected function register_success_message_style_controls(){
2278
2279	$this->start_controls_section(
2280	'section_form_success_message_style',
2281	[
2282	'label' => __('Success Message', 'fluentform'),
2283	'tab' => Controls_Manager::TAB_STYLE,
2284	]
2285	);
2286
2287	$this->add_control(
2288	'form_success_message_bg_color',
2289	[
2290	'label' => __('Background Color', 'fluentform'),
2291	'type' => Controls_Manager::COLOR,
2292	'selectors' => [
2293	'{{WRAPPER}} .fluentform-widget-wrapper .ff-message-success' => 'background-color: {{VALUE}}',
2294	],
2295	]
2296	);
2297
2298	$this->add_control(
2299	'form_success_message_text_color',
2300	[
2301	'label' => __('Text Color', 'fluentform'),
2302	'type' => Controls_Manager::COLOR,
2303	'selectors' => [
2304	'{{WRAPPER}} .fluentform-widget-wrapper .ff-message-success' => 'color: {{VALUE}}',
2305	],
2306	]
2307	);
2308
2309	$this->add_group_control(
2310	Group_Control_Border::get_type(),
2311	[
2312	'name' => 'form_success_message_border',
2313	'label' => __('Border', 'fluentform'),
2314	'placeholder' => '1px',
2315	'default' => '1px',
2316	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-message-success',
2317	]
2318	);
2319
2320	$this->add_group_control(
2321	Group_Control_Typography::get_type(),
2322	[
2323	'name' => 'form_success_message_typography',
2324	'label' => __('Typography', 'fluentform'),
2325	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-message-success',
2326	]
2327	);
2328
2329	$this->end_controls_section();
2330	}
2331
2332	protected function register_errors_style_controls(){
2333	$this->start_controls_section(
2334	'section_form_error_style',
2335	[
2336	'label' => __('Error Message', 'fluentform'),
2337	'tab' => Controls_Manager::TAB_STYLE,
2338	]
2339	);
2340
2341	$this->add_control(
2342	'form_error_message_text_color',
2343	[
2344	'label' => __('Color', 'fluentform'),
2345	'type' => Controls_Manager::COLOR,
2346	'default' => '',
2347	'selectors' => [
2348	'{{WRAPPER}} .fluentform-widget-wrapper .error.text-danger' => 'color: {{VALUE}}',
2349	],
2350	]
2351	);
2352
2353	$this->add_group_control(
2354	Group_Control_Typography::get_type(),
2355	[
2356	'name' => 'form_error_message_typography',
2357	'label' => __('Typography', 'fluentform'),
2358	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .error.text-danger',
2359	]
2360	);
2361
2362	$this->add_responsive_control(
2363	'form_error_message_padding',
2364	[
2365	'label' => __('Padding', 'fluentform'),
2366	'type' => Controls_Manager::DIMENSIONS,
2367	'size_units' => ['px', 'em', '%'],
2368	'selectors' => [
2369	'{{WRAPPER}} .fluentform-widget-wrapper .error.text-danger' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2370	],
2371	]
2372	);
2373
2374	$this->add_responsive_control(
2375	'form_error_message_margin',
2376	[
2377	'label' => __('Margin', 'fluentform'),
2378	'type' => Controls_Manager::DIMENSIONS,
2379	'size_units' => ['px', 'em', '%'],
2380	'selectors' => [
2381	'{{WRAPPER}} .fluentform-widget-wrapper .error.text-danger' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2382	],
2383	]
2384	);
2385
2386	$this->end_controls_section();
2387	}
2388
2389
2390	/**
2391	* Render the widget output on the frontend.
2392	*
2393	* Written in PHP and used to generate the final HTML.
2394	*
2395	* @since 1.0.0
2396	*
2397	* @access protected
2398	*/
2399	protected function render() {
2400	$settings = $this->get_settings_for_display();
2401	extract($settings);
2402
2403	$this->add_render_attribute(
2404	'fluentform_widget_wrapper',
2405	[
2406	'class' => [
2407	'fluentform-widget-wrapper',
2408	]
2409	]
2410	);
2411
2412
2413	if ( $placeholder_switch != 'yes' ) {
2414	$this->add_render_attribute( 'fluentform_widget_wrapper', 'class', 'hide-placeholder' );
2415	}
2416
2417	if( $labels_switch != 'yes' ) {
2418	$this->add_render_attribute( 'fluentform_widget_wrapper', 'class', 'hide-fluent-form-labels' );
2419	}
2420
2421	if( $error_messages == 'no' ) {
2422	$this->add_render_attribute( 'fluentform_widget_wrapper', 'class', 'hide-error-message' );
2423	}
2424
2425	if ( $form_custom_radio_checkbox == 'yes' ) {
2426	$this->add_render_attribute( 'fluentform_widget_wrapper', 'class', 'fluentform-widget-custom-radio-checkbox' );
2427	}
2428
2429	if ( $form_container_alignment ) {
2430	$this->add_render_attribute( 'fluentform_widget_wrapper', 'class', 'fluentform-widget-align-'.$form_container_alignment.'' );
2431	}
2432
2433	if ( ! empty( $form_list ) ) { ?>
2434
2435	<div <?php echo $this->get_render_attribute_string('fluentform_widget_wrapper'); ?>>
2436
2437	<?php if ($custom_title_description == 'yes') { ?>
2438	<div class="fluentform-widget-heading">
2439	<?php if ($form_title_custom != '') { ?>
2440	<h3 class="fluentform-widget-title">
2441	<?php echo esc_attr($form_title_custom); ?>
2442	</h3>
2443	<?php } ?>
2444	<?php if ($form_description_custom != '') { ?>
2445	<p class="fluentform-widget-description">
2446	<?php echo $this->parse_text_editor($form_description_custom); ?>
2447	</p>
2448	<?php } ?>
2449	</div>
2450	<?php } ?>
2451
2452	<?php echo do_shortcode('[fluentform id="' . $form_list . '"]'); ?>
2453	</div>
2454
2455	<?php
2456	}
2457	}
2458
2459
2460	/**
2461	* Render the widget output in the editor.
2462	*
2463	* Written as a Backbone JavaScript template and used to generate the live preview.
2464	*
2465	* @since 1.0.0
2466	*
2467	* @access protected
2468	*/
2469	protected function content_template() {}
2470
2471	}
2472