PluginProbe
Borderless – Addons and Templates for Elementor / 1.2.5
Borderless – Addons and Templates for Elementor v1.2.5
trunk 1.0.0 1.0.1 1.0.2 1.0.3 1.0.4 1.0.5 1.0.6 1.0.7 1.0.8 1.0.9 1.1.0 1.1.1 1.1.2 1.1.3 1.1.4 1.1.5 1.1.6 1.1.7 1.1.8 1.1.9 1.2.0 1.2.1 1.2.2 1.2.3 All 78 releases
borderless / modules / wpbakery / elements / infobox.php

infobox.php in Borderless – Addons and Templates for Elementor 1.2.5, at modules/wpbakery/elements/infobox.php

609 lines 23.2 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2 if ( ! defined( 'ABSPATH' ) ) {
3 die( '-1' );
4 }
5
6 /*-----------------------------------------------------------------------------------*/
7 /* Infobox
8 /*-----------------------------------------------------------------------------------*/
9
10 class WPBakeryShortCode_borderless_wpbakery_infobox extends WPBakeryShortCode {
11 protected function content( $atts, $content = null ) {
12 extract( shortcode_atts( array(
13 'title' => '',
14 'link' => '',
15 'icon_display' => '',
16 'custom_image_icon' => '',
17 'custom_svg_icon' => '',
18 'icon' => '',
19 'icon_color' => '',
20 'custom_icon_color' => '',
21 'shape' => '',
22 'color_shape' => '',
23 'icon_size' => '',
24 'icon_spacing' => '',
25 'icon_gap' => '0',
26 'height' => 'auto',
27 'width' => '100px',
28 'style' => 'column',
29 'alignment' => 'flex-start',
30 'animations' => '',
31 'animation_delay' => '',
32 'animation_speed' => 'slower animated infinite',
33 'title_tag' => 'h3',
34 'title_size' => '',
35 'title_line_height' => '',
36 'title_spacing' => '',
37 'title_alignment' => '',
38 'title_color' => '',
39 //Static
40 'el_id' => '',
41 'el_class' => '',
42 'css' => '',
43 'css_animation' => ''
44 ), $atts ) );
45 $output = '';
46
47
48 // Retrieve data from the database.
49 $options = get_option( 'borderless' );
50
51
52 // Set default values
53 $borderless_primary_color = isset( $options['primary_color'] ) ? $options['primary_color'] : '#3379fc'; //Primary Color
54 $borderless_secondary_color = isset( $options['secondary_color'] ) ? $options['secondary_color'] : '#3379fc'; //Secondary Color
55 $borderless_text_color = isset( $options['text_color'] ) ? $options['text_color'] : ''; //Text Color
56 $borderless_accent_color = isset( $options['accent_color'] ) ? $options['accent_color'] : '#3379fc'; //Accent Color
57
58
59 // Default Extra Class, CSS and CSS animation
60 $css = isset( $atts['css'] ) ? $atts['css'] : '';
61 $el_id = isset( $atts['el_id'] ) ? 'id="' . esc_attr( $el_id ) . '"' : '';
62 $el_class = isset( $atts['el_class'] ) ? $atts['el_class'] : '';
63 if ( '' !== $css_animation ) {
64 wp_enqueue_script( 'waypoints' );
65 $css_animation_style = ' wpb_animate_when_almost_visible wpb_' . $css_animation;
66 }
67 $class_to_filter = vc_shortcode_custom_css_class( $css, ' ' ) . $this->getExtraClass( $el_class ) . $this->getCSSAnimation( $css_animation );
68 $css_class = apply_filters( VC_SHORTCODE_CUSTOM_CSS_FILTER_TAG, $class_to_filter, $this->settings['base'], $atts );
69
70
71 // Set custom values
72
73 // Link
74 if($link != '') {
75 $link = vc_build_link( $link );
76 $link_start = '<a href="'.esc_attr( $link['url'] ).'">';
77 $link_finish = '</a>';
78 } else {
79 $link_start = '';
80 $link_finish = '';
81 }
82
83 $title_color = $title_color ? 'color:'.$title_color.';' : 'color:'.$borderless_primary_color.';'; //Title Color
84 $title_size = $title_size ? 'font-size:'.$title_size.';' : ''; //Title Size
85 $title_line_height = $title_line_height ? 'line-height:'.$title_line_height.';' : ''; //Title Line Height
86 $title_spacing = $title_spacing ? 'margin:'.$title_spacing.';' : ''; //Title Spacing
87 $title_alignment = $title_alignment ? 'text-align:'.$title_alignment.';' : ''; //Title Alignment
88 $title_content = ''.$link_start.'<'.$title_tag.' style="'.$title_size.$title_line_height.$title_spacing.$title_alignment.$title_color.'">'.$title.'</'.$title_tag.'>'.$link_finish.'';
89
90 // Icon
91 if ($icon_display == 'image_icon') {
92
93 $default_src = vc_asset_url( 'vc/no_image.png' );
94 $img = wp_get_attachment_image_src( $custom_image_icon );
95 $src = $img[0];
96 $custom_src = $src ? esc_attr( $src ) : $default_src;
97
98 $icon_content = '<img src="'.$custom_src.'" >';
99
100 } elseif ($icon_display == 'svg_icon') {
101
102 $default_src = vc_asset_url( 'vc/no_image.png' );
103 $img = wp_get_attachment_image_src( $custom_svg_icon );
104 $src = $img[0];
105 $custom_src = $src ? esc_attr( $src ) : $default_src;
106
107 $icon_content = '<div class="borderless-wpbakery-infobox-svg" style="height:'.$height.';width:'.$width.';"><img class="borderless-svg-img" src="'.$custom_src.'" ></div>';
108
109 } else {
110
111 $iconClass = isset( $icon ) ? esc_attr( $icon ) : 'fa fa-adjust';
112
113 $custom_icon_color = $icon_color ? 'color:'.$custom_icon_color.';' : 'color:'.$borderless_primary_color.';'; //Icon Color
114
115 $font_size_reference = $icon_size;
116
117 if($icon_size != '') {
118 $icon_size = 'font-size:'.$icon_size.';';
119 }
120
121 if($shape != '') {
122
123 if($shape == 'rounded' || $shape == 'square' || $shape == 'round') {
124 $color_shape = $color_shape ? 'background-color:'.$color_shape.';' : 'background-color:'.$borderless_primary_color.';'; //Background Color Shape
125 } else {
126 $color_shape = $color_shape ? 'border-color:'.$color_shape.';' : 'border-color:'.$borderless_primary_color.';'; //Border Color Shape
127 }
128
129 if($icon_spacing != '') {
130 $icon_spacing = 'height:'.$icon_spacing.'; width:'.$icon_spacing.';';
131 } else {
132 $icon_spacing = 'height:calc('.$font_size_reference.' + 2em); width:calc('.$font_size_reference.' + 2em);';
133 }
134
135 $shape_render_start = '<div class="borderless-wpbakery-infobox-type '.$shape.'" style="'.$color_shape.''.$icon_spacing.'">';
136 $shape_render_finish = '</div>';
137
138 } else {
139 $shape_render_start = $shape_render_finish = '';
140 }
141
142 $icon_content = ''.$shape_render_start.'<span style="'.$custom_icon_color.' '.$icon_size.'" class="borderless-wpbakery-infobox-icon-item '.$iconClass.'"></span>'.$shape_render_finish.'';
143 }
144
145 // Gap
146
147 $icon_gap = 'style="margin:'.$icon_gap.';"';
148
149 // Style
150
151 $style_alignment = 'style="flex-direction:'.$style.'; align-items:'.$alignment.';"';
152
153 //Output
154 $output .= '<div '.$el_id.' class="borderless-wpbakery-infobox '.$css_class.'" '.$style_alignment.'>';
155 $output .= '<div class="borderless-wpbakery-infobox-icon '.$animations.' '.$animation_delay.' '.$animation_speed.'" '.$icon_gap.'>';
156 $output .= $icon_content;
157 $output .= '</div>';
158 $output .= '<div class="borderless-wpbakery-infobox-content">';
159 $output .= $title_content;
160 $output .= $content;
161 $output .= '</div>';
162 $output .= '</div>';
163
164 return $output;
165 }
166 }
167
168 return array(
169 'name' => __( 'Infobox', 'borderless' ),
170 'base' => 'borderless_wpbakery_infobox',
171 'icon' => plugins_url('../images/infobox.png', __FILE__),
172 'show_settings_on_create' => true,
173 'category' => __( 'Borderless', 'borderless' ),
174 'description' => __( 'Create nice looking infoboxes', 'borderless' ),
175 'params' => array(
176
177 array(
178 'type' => 'textfield',
179 'heading' => __( 'Title', 'borderless' ),
180 'param_name' => 'title',
181 'description' => __( 'Enter the title here.', 'borderless' ),
182 ),
183
184 array(
185 'type' => 'vc_link',
186 'heading' => __( 'URL (Link)', 'borderless' ),
187 'param_name' => 'link',
188 'description' => __( 'Add link to infobox title.', 'borderless' ),
189 ),
190
191 array(
192 'type' => 'textarea_html',
193 'holder' => 'div',
194 'heading' => __( 'Description', 'borderless' ),
195 'param_name' => 'content',
196 'description' => __( 'Provide the description for this Infobox.', 'borderless' ),
197 'value' => __( '<p>I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.</p>', 'borderless' ),
198 ),
199
200 /*
201 * Icon Tab
202 */
203
204 array(
205 'type' => 'dropdown',
206 'heading' => __( 'Icon to display', 'borderless' ),
207 'param_name' => 'icon_display',
208 'value' => array(
209 __( 'Icon Manager', 'borderless' ) => 'icon_manager',
210 __( 'Image Icon', 'borderless' ) => 'image_icon',
211 __( 'SVG Icon', 'borderless' ) => 'svg_icon',
212 ),
213 'description' => __( 'Enable Icon Library.', 'borderless' ),
214 'group' => 'Icon',
215 ),
216
217 array(
218 'type' => 'attach_image',
219 'heading' => __( 'Upload Image Icon', 'borderless' ),
220 'param_name' => 'custom_image_icon',
221 'description' => __( 'Upload the custom image icon.', 'borderless' ),
222 'group' => 'Icon',
223 'dependency' => array(
224 'element' => 'icon_display',
225 'value' => array( 'image_icon' ),
226 ),
227 ),
228
229 array(
230 'type' => 'attach_image',
231 'heading' => __( 'Upload SVG Icon', 'borderless' ),
232 'param_name' => 'custom_svg_icon',
233 'description' => __( 'Upload the custom svg icon.', 'borderless' ),
234 'group' => 'Icon',
235 'dependency' => array(
236 'element' => 'icon_display',
237 'value' => array( 'svg_icon' ),
238 ),
239 ),
240
241 array(
242 'type' => 'iconmanager',
243 'heading' => __( 'Icon', 'borderless' ),
244 'param_name' => 'icon',
245 'description' => __( 'Select icon from library.', 'borderless' ),
246 'group' => 'Icon',
247 'dependency' => array(
248 'element' => 'icon_display',
249 'value' => array( 'icon_manager' ),
250 ),
251 ),
252
253 array(
254 'type' => 'dropdown',
255 'heading' => __( 'Icon color', 'borderless' ),
256 'param_name' => 'icon_color',
257 'value' => array(
258 __( 'Preset Color', 'borderless' ) => '',
259 __( 'Custom Color', 'borderless' ) => 'custom',
260 ),
261 'description' => __( 'Select icon color.', 'borderless' ),
262 'dependency' => array(
263 'element' => 'icon_display',
264 'value' => array( 'icon_manager' ),
265 ),
266 'group' => 'Icon',
267 ),
268 array(
269 'type' => 'colorpicker',
270 'heading' => __( 'Custom Icon Color', 'borderless' ),
271 'param_name' => 'custom_icon_color',
272 'description' => __( 'Select custom icon color.', 'borderless' ),
273 'group' => 'Icon',
274 'dependency' => array(
275 'element' => 'icon_color',
276 'value' => array( 'custom' ),
277 ),
278 ),
279 array(
280 'type' => 'dropdown',
281 'heading' => __( 'Shape', 'borderless' ),
282 'description' => __( 'Select icon shape.', 'borderless' ),
283 'param_name' => 'shape',
284 'group' => 'Icon',
285 'dependency' => array(
286 'element' => 'icon_display',
287 'value' => array( 'icon_manager' ),
288 ),
289 'value' => array(
290 __( 'None', 'borderless' ) => '',
291 __( 'Rounded', 'borderless' ) => 'rounded',
292 __( 'Square', 'borderless' ) => 'square',
293 __( 'Round', 'borderless' ) => 'round',
294 __( 'Outline Rounded', 'borderless' ) => 'outline-rounded',
295 __( 'Outline Square', 'borderless' ) => 'outline-square',
296 __( 'Outline Round', 'borderless' ) => 'outline-round',
297 ),
298 ),
299 array(
300 'type' => 'colorpicker',
301 'heading' => __( 'Color Shape', 'borderless' ),
302 'param_name' => 'color_shape',
303 'description' => __( 'Select custom shape background color.', 'borderless' ),
304 'group' => 'Icon',
305 'dependency' => array(
306 'element' => 'shape',
307 'value' => array( 'rounded','square','round','outline-rounded','outline-square','outline-round', ),
308 ),
309 ),
310 array(
311 'type' => 'textfield',
312 'heading' => __( 'Size', 'borderless' ),
313 'param_name' => 'icon_size',
314 'description' => __( 'Icon size. Default value is 16px.', 'borderless' ),
315 'dependency' => array(
316 'element' => 'icon_display',
317 'value' => array( 'icon_manager' ),
318 ),
319 'group' => 'Icon',
320 ),
321 array(
322 'type' => 'textfield',
323 'heading' => __( 'Spacing', 'borderless' ),
324 'param_name' => 'icon_spacing',
325 'description' => __( 'Select icon spacing. e.g. 16px.', 'borderless' ),
326 'dependency' => array(
327 'element' => 'icon_display',
328 'value' => array( 'icon_manager' ),
329 ),
330 'group' => 'Icon',
331 ),
332 array(
333 'type' => 'textfield',
334 'heading' => __( 'Height', 'borderless' ),
335 'param_name' => 'height',
336 'description' => __( 'Insert the SVG height.', 'borderless' ),
337 'dependency' => array(
338 'element' => 'icon_display',
339 'value' => array( 'svg_icon' ),
340 ),
341 'group' => 'Icon',
342 ),
343 array(
344 'type' => 'textfield',
345 'heading' => __( 'Width', 'borderless' ),
346 'param_name' => 'width',
347 'description' => __( 'Insert the SVG width.', 'borderless' ),
348 'dependency' => array(
349 'element' => 'icon_display',
350 'value' => array( 'svg_icon' ),
351 ),
352 'group' => 'Icon',
353 ),
354 array(
355 'type' => 'textfield',
356 'heading' => __( 'Gap', 'borderless' ),
357 'param_name' => 'icon_gap',
358 'description' => __( 'Select icon gap. e.g. 16px.', 'borderless' ),
359 'group' => 'Icon',
360 ),
361 array(
362 'type' => 'dropdown',
363 'heading' => __( 'Style', 'borderless' ),
364 'param_name' => 'style',
365 'value' => array(
366 __( 'Icon at Top', 'borderless' ) => 'column',
367 __( 'Icon at Bottom', 'borderless' ) => 'column-reverse',
368 __( 'Icon at Left', 'borderless' ) => 'row',
369 __( 'Icon at Right', 'borderless' ) => 'row-reverse',
370 ),
371 'description' => __( 'Select icon position. Icon box style will be changed according to the icon position.', 'borderless' ),
372 'group' => 'Icon',
373 ),
374
375 array(
376 'type' => 'dropdown',
377 'heading' => __( 'Alignment', 'borderless' ),
378 'param_name' => 'alignment',
379 'value' => array(
380 __( 'Start', 'borderless' ) => 'flex-start',
381 __( 'Center', 'borderless' ) => 'center',
382 __( 'End', 'borderless' ) => 'flex-end',
383 ),
384 'description' => __( 'Select icon alignment.', 'borderless' ),
385 'group' => 'Icon',
386 ),
387
388 array(
389 'type' => 'dropdown',
390 'heading' => __( 'Animations', 'borderless' ),
391 'param_name' => 'animations',
392 'value' => array(
393 __( 'No Animation', 'borderless' ) => '',
394 __( 'Bounce', 'borderless' ) => 'bounce',
395 __( 'Flash', 'borderless' ) => 'flash',
396 __( 'Pulse', 'borderless' ) => 'pulse',
397 __( 'Rubber Band', 'borderless' ) => 'rubberBand',
398 __( 'Shake', 'borderless' ) => 'shake',
399 __( 'Head Shake', 'borderless' ) => 'headShake',
400 __( 'Swing', 'borderless' ) => 'swing',
401 __( 'Tada', 'borderless' ) => 'tada',
402 __( 'Wobble', 'borderless' ) => 'wobble',
403 __( 'Jello', 'borderless' ) => 'jello',
404 __( 'Bounce In', 'borderless' ) => 'bounceIn',
405 __( 'Bounce In Down', 'borderless' ) => 'bounceInDown',
406 __( 'Bounce In Left', 'borderless' ) => 'bounceInLeft',
407 __( 'Bounce In Right', 'borderless' ) => 'bounceInRight',
408 __( 'Bounce In Up', 'borderless' ) => 'bounceInUp',
409 __( 'Bounce Out', 'borderless' ) => 'bounceOut',
410 __( 'Bounce Out Down', 'borderless' ) => 'bounceOutDown',
411 __( 'Bounce Out Left', 'borderless' ) => 'bounceOutLeft',
412 __( 'Bounce Out Right', 'borderless' ) => 'bounceOutRight',
413 __( 'Bounce Out Up', 'borderless' ) => 'bounceOutUp',
414 __( 'Fade In', 'borderless' ) => 'fadeIn',
415 __( 'Fade In Down', 'borderless' ) => 'fadeInDown',
416 __( 'Fade In Down Big', 'borderless' ) => 'fadeInDownBig',
417 __( 'Fade In Left', 'borderless' ) => 'fadeInLeft',
418 __( 'Fade In Left Big', 'borderless' ) => 'fadeInLeftBig',
419 __( 'Fade In Right', 'borderless' ) => 'fadeInRight',
420 __( 'Fade In Right Big', 'borderless' ) => 'fadeInRightBig',
421 __( 'Fade In Up', 'borderless' ) => 'fadeInUp',
422 __( 'Fade In Up Big', 'borderless' ) => 'fadeInUpBig',
423 __( 'Fade Out', 'borderless' ) => 'fadeOut',
424 __( 'Fade Out Down', 'borderless' ) => 'fadeOutDown',
425 __( 'Fade Out Down Big', 'borderless' ) => 'fadeOutDownBig',
426 __( 'Fade Out Left', 'borderless' ) => 'fadeOutLeft',
427 __( 'Fade Out Left Big', 'borderless' ) => 'fadeOutLeftBig',
428 __( 'Fade Out Right', 'borderless' ) => 'fadeOutRight',
429 __( 'Fade Out Right Big', 'borderless' ) => 'fadeOutRightBig',
430 __( 'Fade Out Up', 'borderless' ) => 'fadeOutUp',
431 __( 'Fade Out Up Big', 'borderless' ) => 'fadeOutUpBig',
432 __( 'Flip In X', 'borderless' ) => 'flipInX',
433 __( 'Flip In Y', 'borderless' ) => 'flipInY',
434 __( 'Flip Out X', 'borderless' ) => 'flipOutX',
435 __( 'Flip Out Y', 'borderless' ) => 'flipOutY',
436 __( 'Light Speed In', 'borderless' ) => 'lightSpeedIn',
437 __( 'Light Speed Out', 'borderless' ) => 'lightSpeedOut',
438 __( 'Rotate In', 'borderless' ) => 'rotateIn',
439 __( 'Rotate In Down Left', 'borderless' ) => 'rotateInDownLeft',
440 __( 'Rotate In Down Right', 'borderless' ) => 'rotateInDownRight',
441 __( 'Rotate In Up Left', 'borderless' ) => 'rotateInUpLeft',
442 __( 'Rotate In Up Right', 'borderless' ) => 'rotateInUpRight',
443 __( 'Rotate Out', 'borderless' ) => 'rotateOut',
444 __( 'Rotate Out Down Left', 'borderless' ) => 'rotateOutDownLeft',
445 __( 'Rotate Out Down Right', 'borderless' ) => 'rotateOutDownRight',
446 __( 'Rotate Out Up Left', 'borderless' ) => 'rotateOutUpLeft',
447 __( 'Rotate Out Up Right', 'borderless' ) => 'rotateOutUpRight',
448 __( 'Hinge', 'borderless' ) => 'hinge',
449 __( 'Jack In The Box', 'borderless' ) => 'jackInTheBox',
450 __( 'Roll In', 'borderless' ) => 'rollIn',
451 __( 'Roll Out', 'borderless' ) => 'rollOut',
452 __( 'Zoom In', 'borderless' ) => 'zoomIn',
453 __( 'Zoom In Down', 'borderless' ) => 'zoomInDown',
454 __( 'Zoom In Left', 'borderless' ) => 'zoomInLeft',
455 __( 'Zoom In Right', 'borderless' ) => 'zoomInRight',
456 __( 'Zoom In Up', 'borderless' ) => 'zoomInUp',
457 __( 'Zoom Out', 'borderless' ) => 'zoomOut',
458 __( 'Zoom Out Down', 'borderless' ) => 'zoomOutDown',
459 __( 'Zoom Out Left', 'borderless' ) => 'zoomOutLeft',
460 __( 'Zoom Out Right', 'borderless' ) => 'zoomOutRight',
461 __( 'Zoom Out Up', 'borderless' ) => 'zoomOutUp',
462 __( 'Slide In Down', 'borderless' ) => 'slideInDown',
463 __( 'Slide In Left', 'borderless' ) => 'slideInLeft',
464 __( 'Slide In Right', 'borderless' ) => 'slideInRight',
465 __( 'Slide In Up', 'borderless' ) => 'slideInUp',
466 __( 'Slide Out Down', 'borderless' ) => 'slideOutDown',
467 __( 'Slide Out Left', 'borderless' ) => 'slideOutLeft',
468 __( 'Slide Out Right', 'borderless' ) => 'slideOutRight',
469 __( 'Slide Out Up', 'borderless' ) => 'slideOutUp',
470 __( 'Heart Beat', 'borderless' ) => 'heartBeat',
471
472 ),
473 'description' => __( 'Select the type of animation you want on hover.', 'borderless' ),
474 'group' => 'Icon',
475 ),
476
477 array(
478 'type' => 'dropdown',
479 'heading' => __( 'Animation Delay', 'borderless' ),
480 'param_name' => 'animation_delay',
481 'value' => array(
482 __( 'No Delay', 'borderless' ) => '',
483 __( 'Delay 1 second', 'borderless' ) => 'delay-1s',
484 __( 'Delay 2 seconds', 'borderless' ) => 'delay-2s',
485 __( 'Delay 3 seconds', 'borderless' ) => 'delay-3s',
486 __( 'Delay 4 seconds', 'borderless' ) => 'delay-4s',
487 __( 'Delay 5 seconds', 'borderless' ) => 'delay-5s',
488
489 ),
490 'dependency' => array(
491 'element' => 'animations',
492 'value' => array( 'bounce','flash','pulse','rubberBand','shake','headShake','swing','tada','wobble','jello','bounceIn','bounceInDown','bounceInLeft','bounceInRight','bounceInUp','bounceOut','bounceOutDown','bounceOutLeft','bounceOutRight','bounceOutUp','fadeIn','fadeInDown','fadeInDownBig','fadeInLeft','fadeInLeftBig','fadeInRight','fadeInRightBig','fadeInUp','fadeInUpBig','fadeOut','fadeOutDown','fadeOutDownBig','fadeOutLeft','fadeOutLeftBig','fadeOutRight','fadeOutRightBig','fadeOutUp','fadeOutUpBig','flipInX','flipInY','flipOutX','flipOutY','lightSpeedIn','lightSpeedOut','rotateIn','rotateInDownLeft','rotateInDownRight','rotateInUpLeft','rotateInUpRight','rotateOut','rotateOutDownLeft','rotateOutDownRight','rotateOutUpLeft','rotateOutUpRight','hinge','jackInTheBox','rollIn','rollOut','zoomIn','zoomInDown','zoomInLeft','zoomInRight','zoomInUp','zoomOut','zoomOutDown','zoomOutLeft','zoomOutRight','zoomOutUp','slideInDown','slideInLeft','slideInRight','slideInUp','slideOutDown','slideOutLeft','slideOutRight','slideOutUp','heartBeat' ),
493 ),
494 'description' => __( 'Select delay for animation.', 'borderless' ),
495 'group' => 'Icon',
496 ),
497
498 array(
499 'type' => 'dropdown',
500 'heading' => __( 'Animation Speed', 'borderless' ),
501 'param_name' => 'animation_speed',
502 'value' => array(
503 __( 'Slower - 3s', 'borderless' ) => 'slower animated infinite',
504 __( 'Slow - 2s', 'borderless' ) => 'slow animated infinite',
505 __( 'Fast - 800ms', 'borderless' ) => 'fast animated infinite',
506 __( 'Faster - 500ms', 'borderless' ) => 'faster animated infinite',
507
508 ),
509 'dependency' => array(
510 'element' => 'animations',
511 'value' => array( 'bounce','flash','pulse','rubberBand','shake','headShake','swing','tada','wobble','jello','bounceIn','bounceInDown','bounceInLeft','bounceInRight','bounceInUp','bounceOut','bounceOutDown','bounceOutLeft','bounceOutRight','bounceOutUp','fadeIn','fadeInDown','fadeInDownBig','fadeInLeft','fadeInLeftBig','fadeInRight','fadeInRightBig','fadeInUp','fadeInUpBig','fadeOut','fadeOutDown','fadeOutDownBig','fadeOutLeft','fadeOutLeftBig','fadeOutRight','fadeOutRightBig','fadeOutUp','fadeOutUpBig','flipInX','flipInY','flipOutX','flipOutY','lightSpeedIn','lightSpeedOut','rotateIn','rotateInDownLeft','rotateInDownRight','rotateInUpLeft','rotateInUpRight','rotateOut','rotateOutDownLeft','rotateOutDownRight','rotateOutUpLeft','rotateOutUpRight','hinge','jackInTheBox','rollIn','rollOut','zoomIn','zoomInDown','zoomInLeft','zoomInRight','zoomInUp','zoomOut','zoomOutDown','zoomOutLeft','zoomOutRight','zoomOutUp','slideInDown','slideInLeft','slideInRight','slideInUp','slideOutDown','slideOutLeft','slideOutRight','slideOutUp','heartBeat' ),
512 ),
513 'description' => __( 'Select Speed for animation.', 'borderless' ),
514 'group' => 'Icon',
515 ),
516
517 /*
518 * Typography Tab
519 */
520
521 array(
522 'type' => 'dropdown',
523 'heading' => __( 'Title Tag', 'borderless' ),
524 'param_name' => 'title_tag',
525 'group' => 'Typography',
526 'value' => array(
527 __( 'H1', 'borderless' ) => 'h1',
528 __( 'H2', 'borderless' ) => 'h2',
529 __( 'H3', 'borderless' ) => 'h3',
530 __( 'H4', 'borderless' ) => 'h4',
531 __( 'H5', 'borderless' ) => 'h5',
532 __( 'H6', 'borderless' ) => 'h6',
533 __( 'p', 'borderless' ) => 'p',
534 __( 'div', 'borderless' ) => 'div',
535 ),
536 'default' => 'h3',
537 'description' => __( 'Select title tag.', 'borderless' ),
538 ),
539
540 array(
541 'type' => 'textfield',
542 'heading' => __( 'Title Font Size', 'borderless' ),
543 'param_name' => 'title_size',
544 'description' => __( 'Enter font size.', 'borderless' ),
545 'group' => 'Typography',
546 ),
547
548 array(
549 'type' => 'textfield',
550 'heading' => __( 'Title Line Height', 'borderless' ),
551 'param_name' => 'title_line_height',
552 'description' => __( 'Enter line height.', 'borderless' ),
553 'group' => 'Typography',
554 ),
555
556 array(
557 'type' => 'textfield',
558 'heading' => __( 'Title Spacing', 'borderless' ),
559 'param_name' => 'title_spacing',
560 'description' => __( 'Select title spacing. e.g. 16px.', 'borderless' ),
561 'group' => 'Typography',
562 ),
563 array(
564 'type' => 'dropdown',
565 'heading' => __( 'Title Alignment', 'borderless' ),
566 'param_name' => 'title_alignment',
567 'value' => array(
568 __( 'Left', 'borderless' ) => 'left',
569 __( 'Right', 'borderless' ) => 'right',
570 __( 'Center', 'borderless' ) => 'center',
571 ),
572 'description' => __( 'Select title alignment.', 'borderless' ),
573 'group' => 'Typography',
574 ),
575
576 array(
577 'type' => 'colorpicker',
578 'heading' => __( 'Title Color', 'borderless' ),
579 'param_name' => 'title_color',
580 'description' => __( 'Select custom color for the title.', 'borderless' ),
581 'group' => 'Typography',
582 ),
583
584 // Animation
585 vc_map_add_css_animation(),
586
587 array(
588 'type' => 'el_id',
589 'heading' => __( 'Element ID', 'borderless' ),
590 'param_name' => 'el_id',
591 'description' => sprintf( __( 'Enter element ID (Note: make sure it is unique and valid according to %sw3c specification%s).', 'borderless' ), '<a href="https://www.w3schools.com/tags/att_global_id.asp" target="_blank">', '</a>' ),
592 ),
593
594 array(
595 'type' => 'textfield',
596 'heading' => __( 'Extra class name', 'borderless' ),
597 'param_name' => 'el_class',
598 'description' => __( 'Style particular content element differently - add a class name and refer to it in custom CSS.', 'borderless' ),
599 ),
600
601 array(
602 'type' => 'css_editor',
603 'heading' => __( 'CSS box', 'borderless' ),
604 'param_name' => 'css',
605 'group' => __( 'Design Options', 'borderless' ),
606 ),
607 ),
608 );
609