borderless / modules / elementor / widgets / team-member.php

team-member.php in Borderless – Addons and Templates for Elementor trunk, at modules/elementor/widgets/team-member.php

1,177 lines 29.3 KB

Raw Download Zip

1	<?php
2
3	namespace Borderless\Widgets;
4
5	if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
6
7	use Elementor\Widget_Base;
8	use Elementor\Controls_Manager;
9	use Elementor\Group_Control_Image_Size;
10	use \Elementor\Group_Control_Border;
11	use \Elementor\Group_Control_Typography;
12	use \Elementor\Group_Control_Background;
13	use \Elementor\Group_Control_Css_Filter;
14	use \Elementor\Group_Control_Box_Shadow;
15	use \Elementor\Icons_Manager;
16	use Elementor\Repeater;
17	use Elementor\Utils;
18
19	class Team_Member extends Widget_Base {
20
21	public function get_name() {
22	return 'borderless-elementor-team-member';
23	}
24
25	public function get_title() {
26	return esc_html__( 'Team Member', 'borderless');
27	}
28
29	public function get_icon() {
30	return 'borderless-icon-team-member';
31	}
32
33	public function get_categories() {
34	return [ 'borderless' ];
35	}
36
37	public function get_keywords()
38	{
39	return [
40	'team',
41	'member',
42	'team member',
43	'person',
44	'card',
45	'meet the team',
46	'team builder',
47	'our team',
48	'borderless',
49	'borderless team member',
50	'borderless team members'
51	];
52	}
53
54	public function get_custom_help_url()
55	{
56	return 'https://wpborderless.com/';
57	}
58
59	protected function _register_controls() {
60
61
62	/-----------------------------------------------------------------------------------/
63	/* *. Avatar
64	/-----------------------------------------------------------------------------------/
65
66	$this->start_controls_section(
67	'borderless_section_team_member_avatar',
68	[
69	'label' => esc_html__( 'Picture', 'borderless' ),
70	'tab' => Controls_Manager::TAB_CONTENT,
71	]
72	);
73
74	$this->add_control(
75	'borderless_team_member_avatar',
76	[
77	'label' => __( 'Upload Picture', 'borderless' ),
78	'type' => Controls_Manager::MEDIA,
79	'default' => [
80	'url' => Utils::get_placeholder_image_src(),
81	],
82	]
83	);
84
85	$this->add_group_control(
86	Group_Control_Image_Size::get_type(),
87	[
88	'name' => 'borderless_team_member_avatar',
89	'default' => 'large',
90	'separator' => 'none',
91	]
92	);
93
94	$this->end_controls_section();
95
96
97	/-----------------------------------------------------------------------------------/
98	/* *. Content
99	/-----------------------------------------------------------------------------------/
100
101	$this->start_controls_section(
102	'borderless_section_team_member_content',
103	[
104	'label' => esc_html__( 'Content', 'borderless')
105	]
106	);
107
108	$this->add_control(
109	'borderless_team_member_name',
110	[
111	'label' => esc_html__( 'Name', 'borderless'),
112	'type' => Controls_Manager::TEXT,
113	'dynamic' => [
114	'active' => true,
115	],
116	'default' => esc_html__( 'John Doe', 'borderless'),
117	]
118	);
119
120	$this->add_control(
121	'borderless_team_member_job',
122	[
123	'label' => esc_html__( 'Job Position', 'borderless'),
124	'type' => Controls_Manager::TEXT,
125	'dynamic' => [
126	'active' => true,
127	],
128	'default' => esc_html__( 'Full Stack Web Developer', 'borderless'),
129	]
130	);
131
132	$this->add_control(
133	'borderless_team_member_description',
134	[
135	'label' => esc_html__( 'Description', 'borderless'),
136	'type' => Controls_Manager::TEXTAREA,
137	'dynamic' => [
138	'active' => true,
139	],
140	'default' => esc_html__( 'Add team member description here. Remove the text if not necessary.', 'borderless'),
141	]
142	);
143
144	$this->end_controls_section();
145
146
147	/-----------------------------------------------------------------------------------/
148	/* *. Social Profiles
149	/-----------------------------------------------------------------------------------/
150
151	$this->start_controls_section(
152	'borderless_section_team_member_social_profiles',
153	[
154	'label' => esc_html__( 'Social Profiles', 'borderless')
155	]
156	);
157
158	$this->add_control(
159	'borderless_team_member_enable_social_profiles',
160	[
161	'label' => esc_html__( 'Enable Social Profiles?', 'borderless'),
162	'type' => Controls_Manager::SWITCHER,
163	'default' => 'yes',
164	]
165	);
166
167	$repeater = new Repeater();
168
169	$repeater->add_control(
170	'social_icon',
171	[
172	'label' => __( 'Icon', 'borderless' ),
173	'type' => Controls_Manager::ICONS,
174	'fa4compatibility' => 'social',
175	'default' => [
176	'value' => 'fab fa-wordpress',
177	'library' => 'fa-brands',
178	],
179	'recommended' => [
180	'fa-brands' => [
181	'android',
182	'apple',
183	'behance',
184	'bitbucket',
185	'codepen',
186	'delicious',
187	'deviantart',
188	'digg',
189	'dribbble',
190	'elementor',
191	'facebook',
192	'flickr',
193	'foursquare',
194	'free-code-camp',
195	'github',
196	'gitlab',
197	'globe',
198	'houzz',
199	'instagram',
200	'jsfiddle',
201	'linkedin',
202	'medium',
203	'meetup',
204	'mix',
205	'mixcloud',
206	'odnoklassniki',
207	'pinterest',
208	'product-hunt',
209	'reddit',
210	'shopping-cart',
211	'skype',
212	'slideshare',
213	'snapchat',
214	'soundcloud',
215	'spotify',
216	'stack-overflow',
217	'steam',
218	'telegram',
219	'thumb-tack',
220	'tripadvisor',
221	'tumblr',
222	'twitch',
223	'twitter',
224	'viber',
225	'vimeo',
226	'vk',
227	'weibo',
228	'weixin',
229	'whatsapp',
230	'wordpress',
231	'xing',
232	'yelp',
233	'youtube',
234	'500px',
235	],
236	'fa-solid' => [
237	'envelope',
238	'link',
239	'rss',
240	],
241	],
242	]
243	);
244
245	$repeater->add_control(
246	'borderless_team_member_social_profiles_link',
247	[
248	'name' => 'link',
249	'label' => esc_html__( 'Link', 'borderless'),
250	'type' => Controls_Manager::URL,
251	'dynamic' => ['active' => true],
252	'label_block' => true,
253	'default' => [
254	'url' => '',
255	'is_external' => 'true',
256	],
257	'placeholder' => esc_html__( 'Place URL here', 'borderless'),
258	]
259	);
260
261	$repeater->add_control(
262	'borderless_team_member_social_profiles_item_icon_color',
263	[
264	'label' => __( 'Color', 'borderless' ),
265	'type' => Controls_Manager::SELECT,
266	'default' => 'default',
267	'options' => [
268	'default' => __( 'Official Color', 'borderless' ),
269	'custom' => __( 'Custom', 'borderless' ),
270	],
271	]
272	);
273
274	$repeater->add_control(
275	'borderless_team_member_social_profiles_item_icon_primary_color',
276	[
277	'label' => __( 'Primary Color', 'borderless' ),
278	'type' => Controls_Manager::COLOR,
279	'condition' => [
280	'borderless_team_member_social_profiles_item_icon_color' => 'custom',
281	],
282	'selectors' => [
283	'{{WRAPPER}} {{CURRENT_ITEM}}.elementor-social-icon' => 'background-color: {{VALUE}};',
284	],
285	]
286	);
287
288	$repeater->add_control(
289	'borderless_team_member_social_profiles_item_icon_secondary_color',
290	[
291	'label' => __( 'Secondary Color', 'borderless' ),
292	'type' => Controls_Manager::COLOR,
293	'condition' => [
294	'borderless_team_member_social_profiles_item_icon_color' => 'custom',
295	],
296	'selectors' => [
297	'{{WRAPPER}} {{CURRENT_ITEM}}.elementor-social-icon i' => 'color: {{VALUE}};',
298	'{{WRAPPER}} {{CURRENT_ITEM}}.elementor-social-icon svg' => 'fill: {{VALUE}};',
299	],
300	]
301	);
302
303	$this->add_control(
304	'borderless_team_member_social_profiles_links',
305	[
306	'label' => __( 'Social Icons', 'borderless' ),
307	'type' => Controls_Manager::REPEATER,
308	'fields' => $repeater->get_controls(),
309	'condition' => [
310	'borderless_team_member_enable_social_profiles!' => '',
311	],
312	'default' => [
313	[
314	'social_icon' => [
315	'value' => 'fab fa-facebook',
316	'library' => 'fa-brands',
317	],
318	],
319	[
320	'social_icon' => [
321	'value' => 'fab fa-twitter',
322	'library' => 'fa-brands',
323	],
324	],
325	[
326	'social_icon' => [
327	'value' => 'fab fa-youtube',
328	'library' => 'fa-brands',
329	],
330	],
331	],
332	'title_field' => '<# var migrated = "undefined" !== typeof __fa4_migrated, social = ( "undefined" === typeof social ) ? false : social; #>{{{ elementor.helpers.getSocialNetworkNameFromIcon( social_icon, social, true, migrated, true ) }}}',
333	]
334	);
335
336	$this->add_control(
337	'borderless_team_members_social_profiles_view',
338	[
339	'label' => __( 'View', 'borderless' ),
340	'type' => Controls_Manager::HIDDEN,
341	'condition' => [
342	'borderless_team_member_enable_social_profiles!' => '',
343	],
344	'default' => 'traditional',
345	]
346	);
347
348	$this->end_controls_section();
349
350
351	/-----------------------------------------------------------------------------------/
352	/* *. Avatar - Style
353	/-----------------------------------------------------------------------------------/
354
355	$this->start_controls_section(
356	'borderless_section_team_members_image_styles',
357	[
358	'label' => esc_html__( 'Picture', 'borderless'),
359	'tab' => Controls_Manager::TAB_STYLE
360	]
361	);
362
363	$this->add_responsive_control(
364	'borderless_team_members_image_width',
365	[
366	'label' => esc_html__( 'Width', 'borderless'),
367	'type' => Controls_Manager::SLIDER,
368	'default' => [
369	'unit' => '%',
370	],
371	'tablet_default' => [
372	'unit' => '%',
373	],
374	'mobile_default' => [
375	'unit' => '%',
376	],
377	'size_units' => [ '%', 'px', 'vw' ],
378	'range' => [
379	'%' => [
380	'min' => 1,
381	'max' => 100,
382	],
383	'px' => [
384	'min' => 1,
385	'max' => 1000,
386	],
387	'vw' => [
388	'min' => 1,
389	'max' => 100,
390	],
391	],
392	'selectors' => [
393	'{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img' => 'width:{{SIZE}}{{UNIT}};',
394	],
395	]
396	);
397
398	do_action('borderless/team_member_circle_controls', $this);
399
400	$this->add_responsive_control(
401	'borderless_team_members_image_max_width',
402	[
403	'label' => __( 'Max Width', 'borderless' ),
404	'type' => Controls_Manager::SLIDER,
405	'default' => [
406	'unit' => '%',
407	],
408	'tablet_default' => [
409	'unit' => '%',
410	],
411	'mobile_default' => [
412	'unit' => '%',
413	],
414	'size_units' => [ '%', 'px', 'vw' ],
415	'range' => [
416	'%' => [
417	'min' => 1,
418	'max' => 100,
419	],
420	'px' => [
421	'min' => 1,
422	'max' => 1000,
423	],
424	'vw' => [
425	'min' => 1,
426	'max' => 100,
427	],
428	],
429	'selectors' => [
430	'{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img' => 'max-width:{{SIZE}}{{UNIT}};',
431	],
432	]
433	);
434
435	$this->add_responsive_control(
436	'borderless_team_members_image_height',
437	[
438	'label' => __( 'Height', 'borderless' ),
439	'type' => Controls_Manager::SLIDER,
440	'default' => [
441	'unit' => 'px',
442	],
443	'tablet_default' => [
444	'unit' => 'px',
445	],
446	'mobile_default' => [
447	'unit' => 'px',
448	],
449	'size_units' => [ 'px', 'vh' ],
450	'range' => [
451	'px' => [
452	'min' => 1,
453	'max' => 500,
454	],
455	'vh' => [
456	'min' => 1,
457	'max' => 100,
458	],
459	],
460	'selectors' => [
461	'{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img' => 'height: {{SIZE}}{{UNIT}};',
462	],
463	]
464	);
465
466	$this->add_responsive_control(
467	'borderless_team_members_image_margin',
468	[
469	'label' => esc_html__( 'Margin', 'borderless'),
470	'type' => Controls_Manager::DIMENSIONS,
471	'size_units' => [ 'px', 'em', '%', 'rem' ],
472	'selectors' => [
473	'{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
474	],
475	]
476	);
477
478	$this->add_responsive_control(
479	'borderless_team_members_image_padding',
480	[
481	'label' => esc_html__( 'Padding', 'borderless'),
482	'type' => Controls_Manager::DIMENSIONS,
483	'size_units' => [ 'px', 'em', '%', 'rem' ],
484	'selectors' => [
485	'{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
486	],
487	]
488	);
489
490	$this->add_responsive_control(
491	'borderless_team_members_image_object_fit',
492	[
493	'label' => __( 'Object Fit', 'borderless' ),
494	'type' => Controls_Manager::SELECT,
495	'condition' => [
496	'height[size]!' => '',
497	],
498	'options' => [
499	'' => __( 'Default', 'borderless' ),
500	'fill' => __( 'Fill', 'borderless' ),
501	'cover' => __( 'Cover', 'borderless' ),
502	'contain' => __( 'Contain', 'borderless' ),
503	],
504	'default' => '',
505	'selectors' => [
506	'{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img' => 'object-fit: {{VALUE}};',
507	],
508	]
509	);
510
511	$this->add_control(
512	'borderless_team_members_image_separator_panel_style',
513	[
514	'type' => Controls_Manager::DIVIDER,
515	'style' => 'thick',
516	]
517	);
518
519	$this->start_controls_tabs( 'borderless_team_members_image_effects' );
520
521	$this->start_controls_tab( 'normal',
522	[
523	'label' => __( 'Normal', 'borderless' ),
524	]
525	);
526
527	$this->add_control(
528	'borderless_team_members_image_opacity',
529	[
530	'label' => __( 'Opacity', 'borderless' ),
531	'type' => Controls_Manager::SLIDER,
532	'range' => [
533	'px' => [
534	'max' => 1,
535	'min' => 0.10,
536	'step' => 0.01,
537	],
538	],
539	'selectors' => [
540	'{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img' => 'opacity: {{SIZE}};',
541	],
542	]
543	);
544
545	$this->add_group_control(
546	Group_Control_Css_Filter::get_type(),
547	[
548	'name' => 'borderless_team_members_image_css_filters',
549	'selector' => '{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img',
550	]
551	);
552
553	$this->end_controls_tab();
554
555	$this->start_controls_tab( 'hover',
556	[
557	'label' => __( 'Hover', 'borderless' ),
558	]
559	);
560
561	$this->add_control(
562	'borderless_team_members_image_opacity_hover',
563	[
564	'label' => __( 'Opacity', 'borderless' ),
565	'type' => Controls_Manager::SLIDER,
566	'range' => [
567	'px' => [
568	'max' => 1,
569	'min' => 0.10,
570	'step' => 0.01,
571	],
572	],
573	'selectors' => [
574	'{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure:hover img' => 'opacity: {{SIZE}};',
575	],
576	]
577	);
578
579	$this->add_group_control(
580	Group_Control_Css_Filter::get_type(),
581	[
582	'name' => 'borderless_team_members_image_css_filters_hover',
583	'selector' => '{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure:hover img',
584	]
585	);
586
587	$this->add_control(
588	'borderless_team_members_image_background_hover_transition',
589	[
590	'label' => __( 'Transition Duration', 'borderless' ),
591	'type' => Controls_Manager::SLIDER,
592	'range' => [
593	'px' => [
594	'max' => 3,
595	'step' => 0.1,
596	],
597	],
598	'selectors' => [
599	'{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img' => 'transition-duration: {{SIZE}}s',
600	],
601	]
602	);
603
604	$this->add_control(
605	'borderless_team_members_image_hover_animation',
606	[
607	'label' => __( 'Hover Animation', 'borderless' ),
608	'type' => Controls_Manager::HOVER_ANIMATION,
609	]
610	);
611
612	$this->end_controls_tab();
613
614	$this->end_controls_tabs();
615
616	$this->add_group_control(
617	Group_Control_Border::get_type(),
618	[
619	'name' => 'borderless_team_members_image_border',
620	'selector' => '{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img',
621	'separator' => 'before',
622	]
623	);
624
625	$this->add_responsive_control(
626	'borderless_team_members_image_border_radius',
627	[
628	'label' => __( 'Border Radius', 'borderless' ),
629	'type' => Controls_Manager::DIMENSIONS,
630	'size_units' => [ 'px', '%' ],
631	'selectors' => [
632	'{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
633	],
634	]
635	);
636
637	$this->add_group_control(
638	Group_Control_Box_Shadow::get_type(),
639	[
640	'name' => 'borderless_team_members_image_box_shadow',
641	'exclude' => [
642	'box_shadow_position',
643	],
644	'selector' => '{{WRAPPER}} .borderless-elementor-team-member-social-profiles figure img',
645	]
646	);
647
648	$this->end_controls_section();
649
650
651	/-----------------------------------------------------------------------------------/
652	/* *. Content - Style
653	/-----------------------------------------------------------------------------------/
654
655	$this->start_controls_section(
656	'borderless_section_team_members_styles_general',
657	[
658	'label' => esc_html__( 'Content', 'borderless'),
659	'tab' => Controls_Manager::TAB_STYLE
660	]
661	);
662
663	$this->add_control(
664	'content_card_style',
665	[
666	'label' => __( 'Content Card', 'borderless'),
667	'type' => Controls_Manager::HEADING,
668	'separator' => 'before'
669	]
670	);
671
672	$this->add_control(
673	'content_card_height',
674	[
675	'label' => esc_html__( 'Height', 'borderless'),
676	'type' => Controls_Manager::SLIDER,
677	'size_units' => [ 'px', 'em' ],
678	'range' => [
679	'px' => [
680	'min' => 0,
681	'max' => 500,
682	],
683	'em' => [
684	'min' => 0,
685	'max' => 200
686	]
687	],
688	'default' => [
689	'unit' => 'px',
690	'size' => 'auto'
691	],
692	'selectors' => [
693	'{{WRAPPER}} .borderless-elementor-team-member-content' => 'min-height: {{SIZE}}{{UNIT}};',
694	],
695	]
696	);
697
698	$this->add_control(
699	'borderless_team_members_background',
700	[
701	'label' => esc_html__( 'Content Background Color', 'borderless'),
702	'type' => Controls_Manager::COLOR,
703	'default' => '',
704	'selectors' => [
705	'{{WRAPPER}} .borderless-elementor-team-member-content' => 'background-color: {{VALUE}};',
706	],
707	]
708	);
709
710
711
712	$start = is_rtl() ? 'end' : 'start';
713	$end = is_rtl() ? 'start' : 'end';
714
715	$this->add_responsive_control(
716	'borderless_team_members_content_align',
717	[
718	'label' => __( 'Alignment', 'borderless' ),
719	'type' => Controls_Manager::CHOOSE,
720	'condition' => [
721	'borderless_team_member_enable_social_profiles!' => '',
722	],
723	'options' => [
724	'left' => [
725	'title' => __( 'Left', 'borderless' ),
726	'icon' => 'eicon-text-align-left',
727	],
728	'center' => [
729	'title' => __( 'Center', 'borderless' ),
730	'icon' => 'eicon-text-align-center',
731	],
732	'right' => [
733	'title' => __( 'Right', 'borderless' ),
734	'icon' => 'eicon-text-align-right',
735	],
736	],
737	'prefix_class' => 'e-grid-align-',
738	'default' => 'center',
739	'selectors' => [
740	'{{WRAPPER}} .borderless-elementor-team-member-content' => 'text-align: {{VALUE}}',
741	],
742	]
743	);
744
745	$this->add_responsive_control(
746	'borderless_team_members_content_margin',
747	[
748	'label' => esc_html__( 'Margin', 'borderless'),
749	'type' => Controls_Manager::DIMENSIONS,
750	'size_units' => [ 'px', 'em', '%', 'rem' ],
751	'selectors' => [
752	'{{WRAPPER}} .borderless-elementor-team-member-content' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
753	],
754	]
755	);
756
757	$this->add_responsive_control(
758	'borderless_team_members_content_padding',
759	[
760	'label' => esc_html__( 'Padding', 'borderless'),
761	'type' => Controls_Manager::DIMENSIONS,
762	'size_units' => [ 'px', 'em', '%', 'rem' ],
763	'selectors' => [
764	'{{WRAPPER}} .borderless-elementor-team-member-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
765	],
766	]
767	);
768
769	$this->add_group_control(
770	Group_Control_Border::get_type(),
771	[
772	'name' => 'borderless_team_members_border',
773	'label' => esc_html__( 'Border', 'borderless'),
774	'selector' => '{{WRAPPER}} .borderless-elementor-team-member-content',
775	]
776	);
777
778	$this->add_control(
779	'borderless_team_members_border_radius',
780	[
781	'label' => esc_html__( 'Border Radius', 'borderless'),
782	'type' => Controls_Manager::DIMENSIONS,
783	'selectors' => [
784	'{{WRAPPER}} .borderless-elementor-team-member-content' => 'border-radius: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
785	],
786	]
787	);
788
789	$this->end_controls_section();
790
791
792	/-----------------------------------------------------------------------------------/
793	/* *. Social Profiles - Style
794	/-----------------------------------------------------------------------------------/
795
796	$this->start_controls_section(
797	'borderless_section_team_members_social_profiles_styles',
798	[
799	'label' => esc_html__( 'Social Profiles', 'borderless'),
800	'tab' => Controls_Manager::TAB_STYLE
801	]
802	);
803
804	$this->add_control(
805	'borderless_team_members_social_profiles_icon_color',
806	[
807	'label' => __( 'Color', 'borderless' ),
808	'type' => Controls_Manager::SELECT,
809	'default' => 'default',
810	'options' => [
811	'default' => __( 'Official Color', 'borderless' ),
812	'custom' => __( 'Custom', 'borderless' ),
813	],
814	]
815	);
816
817	$this->add_control(
818	'borderless_team_members_social_profiles_icon_primary_color',
819	[
820	'label' => __( 'Primary Color', 'borderless' ),
821	'type' => Controls_Manager::COLOR,
822	'condition' => [
823	'borderless_team_members_social_profiles_icon_color' => 'custom',
824	],
825	'selectors' => [
826	'{{WRAPPER}} .elementor-social-icon' => 'background-color: {{VALUE}};',
827	],
828	]
829	);
830
831	$this->add_control(
832	'borderless_team_members_social_profiles_icon_secondary_color',
833	[
834	'label' => __( 'Secondary Color', 'borderless' ),
835	'type' => Controls_Manager::COLOR,
836	'condition' => [
837	'borderless_team_members_social_profiles_icon_color' => 'custom',
838	],
839	'selectors' => [
840	'{{WRAPPER}} .elementor-social-icon i' => 'color: {{VALUE}};',
841	'{{WRAPPER}} .elementor-social-icon svg' => 'fill: {{VALUE}};',
842	],
843	]
844	);
845
846	$this->add_control(
847	'borderless_team_members_social_profiles_hover_primary_color',
848	[
849	'label' => __( 'Hover Primary Color', 'borderless' ),
850	'type' => Controls_Manager::COLOR,
851	'default' => '',
852	'condition' => [
853	'borderless_team_members_social_profiles_icon_color' => 'custom',
854	],
855	'selectors' => [
856	'{{WRAPPER}} .elementor-social-icon:hover' => 'background-color: {{VALUE}};',
857	],
858	]
859	);
860
861	$this->add_control(
862	'borderless_team_members_social_profiles_hover_secondary_color',
863	[
864	'label' => __( 'Hover Secondary Color', 'borderless' ),
865	'type' => Controls_Manager::COLOR,
866	'default' => '',
867	'condition' => [
868	'borderless_team_members_social_profiles_icon_color' => 'custom',
869	],
870	'selectors' => [
871	'{{WRAPPER}} .elementor-social-icon:hover i' => 'color: {{VALUE}};',
872	'{{WRAPPER}} .elementor-social-icon:hover svg' => 'fill: {{VALUE}};',
873	],
874	]
875	);
876
877	$this->add_responsive_control(
878	'borderless_team_members_social_profiles_icon_size',
879	[
880	'label' => __( 'Size', 'borderless' ),
881	'type' => Controls_Manager::SLIDER,
882	'range' => [
883	'px' => [
884	'min' => 6,
885	'max' => 300,
886	],
887	],
888	'selectors' => [
889	'{{WRAPPER}}' => '--icon-size: {{SIZE}}{{UNIT}}',
890	],
891	]
892	);
893
894	$this->add_responsive_control(
895	'borderless_team_members_social_profiles_icon_padding',
896	[
897	'label' => __( 'Padding', 'borderless' ),
898	'type' => Controls_Manager::SLIDER,
899	'selectors' => [
900	'{{WRAPPER}} .elementor-social-icon' => '--icon-padding: {{SIZE}}{{UNIT}}',
901	],
902	'default' => [
903	'unit' => 'em',
904	],
905	'tablet_default' => [
906	'unit' => 'em',
907	],
908	'mobile_default' => [
909	'unit' => 'em',
910	],
911	'range' => [
912	'em' => [
913	'min' => 0,
914	'max' => 5,
915	],
916	],
917	]
918	);
919
920	$this->add_responsive_control(
921	'borderless_team_members_social_profiles_icon_spacing',
922	[
923	'label' => __( 'Spacing', 'borderless' ),
924	'type' => Controls_Manager::SLIDER,
925	'range' => [
926	'px' => [
927	'min' => 0,
928	'max' => 100,
929	],
930	],
931	'default' => [
932	'size' => 5,
933	],
934	'selectors' => [
935	'{{WRAPPER}}' => '--grid-column-gap: {{SIZE}}{{UNIT}}',
936	],
937	]
938	);
939
940	$this->add_responsive_control(
941	'borderless_team_members_social_profiles_row_gap',
942	[
943	'label' => __( 'Rows Gap', 'borderless' ),
944	'type' => Controls_Manager::SLIDER,
945	'default' => [
946	'size' => 0,
947	],
948	'selectors' => [
949	'{{WRAPPER}}' => '--grid-row-gap: {{SIZE}}{{UNIT}}',
950	],
951	]
952	);
953
954	$this->add_group_control(
955	Group_Control_Border::get_type(),
956	[
957	'name' => 'image_border',
958	'selector' => '{{WRAPPER}} .elementor-social-icon',
959	'separator' => 'before',
960	]
961	);
962
963	$this->add_control(
964	'borderless_team_members_social_profiles_hover_border_color',
965	[
966	'label' => __( 'Hover Color', 'borderless' ),
967	'type' => Controls_Manager::COLOR,
968	'default' => '',
969	'condition' => [
970	'image_border_border!' => '',
971	],
972	'selectors' => [
973	'{{WRAPPER}} .elementor-social-icon:hover' => 'border-color: {{VALUE}};',
974	],
975	]
976	);
977
978	$this->add_control(
979	'borderless_team_members_social_profiles_border_radius',
980	[
981	'label' => __( 'Border Radius', 'borderless' ),
982	'type' => Controls_Manager::DIMENSIONS,
983	'size_units' => [ 'px', '%' ],
984	'selectors' => [
985	'{{WRAPPER}} .elementor-icon' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
986	],
987	]
988	);
989
990	$this->add_control(
991	'borderless_team_members_social_profiles_shape',
992	[
993	'label' => __( 'Shape', 'borderless' ),
994	'type' => Controls_Manager::SELECT,
995	'condition' => [
996	'borderless_team_member_enable_social_profiles!' => '',
997	],
998	'default' => 'rounded',
999	'options' => [
1000	'rounded' => __( 'Rounded', 'borderless' ),
1001	'square' => __( 'Square', 'borderless' ),
1002	'circle' => __( 'Circle', 'borderless' ),
1003	],
1004	'prefix_class' => 'elementor-shape-',
1005	]
1006	);
1007
1008	$this->add_responsive_control(
1009	'borderless_team_members_social_profiles_columns',
1010	[
1011	'label' => __( 'Columns', 'borderless' ),
1012	'type' => Controls_Manager::SELECT,
1013	'condition' => [
1014	'borderless_team_member_enable_social_profiles!' => '',
1015	],
1016	'default' => '0',
1017	'options' => [
1018	'0' => __( 'Auto', 'borderless' ),
1019	'1' => '1',
1020	'2' => '2',
1021	'3' => '3',
1022	'4' => '4',
1023	'5' => '5',
1024	'6' => '6',
1025	],
1026	'prefix_class' => 'elementor-grid%s-',
1027	'selectors' => [
1028	'{{WRAPPER}}' => '--grid-template-columns: repeat({{VALUE}}, auto);',
1029	],
1030	]
1031	);
1032
1033	$this->add_control(
1034	'borderless_team_members_social_profiles_hover_animation',
1035	[
1036	'label' => __( 'Hover Animation', 'borderless' ),
1037	'type' => Controls_Manager::HOVER_ANIMATION,
1038	]
1039	);
1040
1041	$this->add_control(
1042	'borderless_team_members_social_profiles_style',
1043	[
1044	'label' => __( 'Social Profiles Section', 'borderless'),
1045	'type' => Controls_Manager::HEADING,
1046	'separator' => 'before'
1047	]
1048	);
1049
1050	$this->add_responsive_control(
1051	'borderless_team_members_social_profiles_margin',
1052	[
1053	'label' => esc_html__( 'Margin', 'borderless'),
1054	'type' => Controls_Manager::DIMENSIONS,
1055	'size_units' => [ 'px', 'em', '%', 'rem' ],
1056	'selectors' => [
1057	'{{WRAPPER}} .borderless-elementor-team-member-profiles' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1058	],
1059	]
1060	);
1061
1062	$this->add_responsive_control(
1063	'borderless_team_members_social_profiles_padding',
1064	[
1065	'label' => esc_html__( 'Padding', 'borderless'),
1066	'type' => Controls_Manager::DIMENSIONS,
1067	'size_units' => [ 'px', 'em', '%', 'rem' ],
1068	'selectors' => [
1069	'{{WRAPPER}} .borderless-elementor-team-member-profiles' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1070	],
1071	]
1072	);
1073
1074	$this->end_controls_section();
1075
1076	}
1077
1078	protected function render() {
1079	$settings = $this->get_settings_for_display();
1080	$fallback_defaults = [
1081	'fa fa-facebook',
1082	'fa fa-twitter',
1083	'fa fa-google-plus',
1084	];
1085
1086	$class_animation = '';
1087
1088	if ( ! empty( $settings['borderless_team_members_social_profiles_hover_animation'] ) ) {
1089	$class_animation = ' elementor-animation-' . esc_attr($settings['borderless_team_members_social_profiles_hover_animation']);
1090	}
1091
1092	$migration_allowed = Icons_Manager::is_migration_allowed();
1093
1094	echo '<div class="borderless-elementor-team-member">';
1095
1096	if ( !empty( $settings['borderless_team_member_avatar']['url'] ) ) {
1097	echo '
1098	<div class="borderless-elementor-team-member-social-profiles">
1099	<figure>
1100	<img src="'.esc_url($settings['borderless_team_member_avatar']['url']).'" width="500" height="600">
1101	</figure>
1102	</div>
1103	';
1104	}
1105
1106	echo '<div class="borderless-elementor-team-member-content">';
1107	if ( ! empty( $settings['borderless_team_member_name'] ) ) {
1108	echo '<h3 class="borderless-elementor-team-member-name">'.esc_html($settings['borderless_team_member_name']).'</h3>';
1109	}
1110	if ( ! empty( $settings['borderless_team_member_job'] ) ) {
1111	echo '<h4 class="borderless-elementor-team-member-job">'.esc_html($settings['borderless_team_member_job']).'</h4>';
1112	}
1113	if ( ! empty( $settings['borderless_team_member_description'] ) ) {
1114	echo '<p class="borderless-elementor-team-member-description">'.esc_html($settings['borderless_team_member_description']).'</p>';
1115	}
1116
1117	echo '<div class="borderless-elementor-team-member-profiles elementor-social-icons-wrapper elementor-grid">';
1118	foreach ( $settings['borderless_team_member_social_profiles_links'] as $index => $item ) {
1119	$migrated = isset( $item['__fa4_migrated']['social_icon'] );
1120	$is_new = empty( $item['social'] ) && $migration_allowed;
1121	$social = '';
1122
1123	// add old default
1124	if ( empty( $item['social'] ) && ! $migration_allowed ) {
1125	$item['social'] = isset( $fallback_defaults[ $index ] ) ? $fallback_defaults[ $index ] : 'fa fa-wordpress';
1126	}
1127
1128	if ( ! empty( $item['social'] ) ) {
1129	$social = str_replace( 'fa fa-', '', $item['social'] );
1130	}
1131
1132	if ( ( $is_new \|\| $migrated ) && 'svg' !== $item['social_icon']['library'] ) {
1133	$social = explode( ' ', $item['social_icon']['value'], 2 );
1134	if ( empty( $social[1] ) ) {
1135	$social = '';
1136	} else {
1137	$social = str_replace( 'fa-', '', $social[1] );
1138	}
1139	}
1140	if ( 'svg' === $item['social_icon']['library'] ) {
1141	$social = get_post_meta( $item['social_icon']['value']['id'], '_wp_attachment_image_alt', true );
1142	}
1143
1144	$link_key = 'link_' . $index;
1145
1146	$this->add_render_attribute( $link_key, 'class', [
1147	'elementor-icon',
1148	'elementor-social-icon',
1149	'elementor-social-icon-' . $social . $class_animation,
1150	'elementor-repeater-item-' . $item['_id'],
1151	] );
1152
1153	$this->add_link_attributes( $link_key, $item['link'] );
1154
1155	echo '<div class="elementor-grid-item">';
1156	echo '<a ' . $this->get_render_attribute_string( $link_key ) . '>';
1157	echo '<span class="elementor-screen-only">' . ucwords( esc_html($social) ) . '</span>';
1158	if ( $is_new \|\| $migrated ) {
1159	Icons_Manager::render_icon( $item['social_icon'], ['aria-hidden' => 'true'] );
1160	} else {
1161	echo '<i class="' . esc_attr( $item['social'] ) . '"></i>';
1162	}
1163	echo '</a>';
1164	echo '</div>';
1165	}
1166	echo '</div>';
1167	echo '</div>';
1168	echo '</div>';
1169	}
1170
1171
1172	protected function _content_template() {
1173
1174	}
1175
1176
1177	}