PluginProbe
ShopBuilder – WooCommerce Builder For Elementor / 3.2.6
ShopBuilder – WooCommerce Builder For Elementor v3.2.6
3.4.2 3.4.1 3.4.0 2.0.1 2.0.2 2.0.3 2.1.0 2.1.1 2.1.10 2.1.11 2.1.12 2.1.13 2.1.14 2.1.15 2.1.2 2.1.3 2.1.4 2.1.5 2.1.6 2.1.7 2.1.8 2.1.9 2.2.0 2.2.1 2.2.2 All 63 releases
shopbuilder / app / Elementor / Widgets / General / FlipBox / Controls.php

Controls.php in ShopBuilder – WooCommerce Builder For Elementor 3.2.6, at app/Elementor/Widgets/General/FlipBox/Controls.php

1,353 lines 51.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2 /**
3 * Controls class.
4 *
5 * @package RadiusTheme\SB
6 */
7
8 namespace RadiusTheme\SB\Elementor\Widgets\General\FlipBox;
9
10 use RadiusTheme\SB\Helpers\Fns;
11 use RadiusTheme\SB\Elementor\Helper\ControlHelper;
12
13 // Do not allow directly accessing this file.
14 if ( ! defined( 'ABSPATH' ) ) {
15 exit( 'This script cannot be accessed directly.' );
16 }
17
18 /**
19 * Settings class.
20 *
21 * @package RadiusTheme\SB
22 */
23 class Controls {
24 /**
25 * Content section
26 *
27 * @param object $obj Reference object.
28 *
29 * @return array
30 */
31 public static function content( $obj ) {
32 return array_merge(
33 self::preset( $obj ),
34 self::flip_settings( $obj ),
35 self::front_back_settings( $obj, 'front' ),
36 self::front_back_settings( $obj, 'back' ),
37 self::flip_box_button( $obj ),
38 );
39 }
40
41 /**
42 * Style section
43 *
44 * @param object $obj Reference object.
45 *
46 * @return array
47 */
48 public static function style( $obj ) {
49 return array_merge(
50 self::content_box_style( $obj ),
51 self::icon_box_style( $obj ),
52 self::title_style( $obj ),
53 self::content_style( $obj ),
54 self::button_style( $obj, 'front' ),
55 self::button_style( $obj, 'back' ),
56 );
57 }
58
59 /**
60 * Preset section
61 *
62 * @param object $obj Reference object.
63 *
64 * @return array
65 */
66 private static function preset( $obj ) {
67 $alignment_options = ControlHelper::alignment();
68
69 // Remove 'justify' from alignment options.
70 unset( $alignment_options['justify'] );
71 $fields['flip_box_preset'] = $obj->start_section(
72 esc_html__( 'Layout', 'shopbuilder' ),
73 'content'
74 );
75 $fields['layout_note'] = $obj->el_heading( esc_html__( 'Predefined Layouts', 'shopbuilder' ) );
76 $fields['layout_style'] = [
77 'type' => 'rtsb-image-selector',
78 'options' => ControlHelper::general_widgets_flip_box_layouts(),
79 'default' => 'rtsb-flip-box-layout1',
80 ];
81
82 $fields['sb_button_hover_effect_note'] = $obj->el_heading( esc_html__( 'Button Hover Effect Preset', 'shopbuilder' ), 'before' );
83 $fields['button_hover_effects'] = [
84 'type' => 'rtsb-image-selector',
85 'options' => ControlHelper::general_widgets_button_hover_effect_preset(),
86 'default' => 'rtsb-sb-button-hover-effect-default',
87 ];
88 $fields['hover_animation'] = [
89 'mode' => 'responsive',
90 'type' => 'choose',
91 'label' => esc_html__( 'Hover Animation', 'shopbuilder' ),
92 'options' => [
93 'left' => [
94 'title' => esc_html__( 'Left', 'shopbuilder' ),
95 'icon' => 'eicon-h-align-left',
96 ],
97 'top' => [
98 'title' => esc_html__( 'Top', 'shopbuilder' ),
99 'icon' => 'eicon-v-align-top',
100 ],
101 'right' => [
102 'title' => esc_html__( 'Right', 'shopbuilder' ),
103 'icon' => 'eicon-h-align-right',
104 ],
105
106 ],
107 'toggle' => true,
108 'default' => 'left',
109 'condition' => [
110 'button_hover_effects' => [ 'rtsb-sb-button-hover-effect-preset2' ],
111 ],
112 ];
113 $fields['flip_box_element_alignment'] = [
114 'mode' => 'responsive',
115 'type' => 'choose',
116 'label' => esc_html__( 'Element Alignment', 'shopbuilder' ),
117 'options' => $alignment_options,
118 'separator' => 'before',
119 'selectors' => [ $obj->selectors['layout']['alignment'] => 'text-align: {{VALUE}};' ],
120 ];
121 $fields['flip_box_preset_end'] = $obj->end_section();
122 return $fields;
123 }
124 /**
125 * Flip Settings section
126 *
127 * @param object $obj Reference object.
128 *
129 * @return array
130 */
131 private static function flip_settings( $obj ) {
132 $fields['flip_box_flip_settings_start'] = $obj->start_section(
133 esc_html__( 'General Settings', 'shopbuilder' ),
134 'content'
135 );
136 $fields['flip_behavior'] = [
137 'type' => 'select',
138 'label' => esc_html__( 'Flip Behavior', 'shopbuilder' ),
139 'label_block' => true,
140 'options' => [
141 'hover' => esc_html__( 'Hover', 'shopbuilder' ),
142 'click' => esc_html__( 'Click', 'shopbuilder' ),
143 ],
144 'default' => 'hover',
145 ];
146 $fields['flip_direction'] = [
147 'type' => 'select',
148 'label' => esc_html__( 'Flip Direction', 'shopbuilder' ),
149 'label_block' => true,
150 'options' => ControlHelper::flip_box_widget_flip_direction(),
151 'default' => 'sb-flip-3d-left',
152 ];
153 $fields['flip_selected_side'] = [
154 'type' => 'select',
155 'label' => esc_html__( 'Selected Side', 'shopbuilder' ),
156 'label_block' => true,
157 'options' => [
158 'front' => esc_html__( 'Front', 'shopbuilder' ),
159 'back' => esc_html__( 'Back', 'shopbuilder' ),
160 ],
161 'default' => 'front',
162 ];
163 $fields['flip_transition'] = [
164 'type' => 'number',
165 'label' => esc_html__( 'Transition', 'shopbuilder' ),
166 'selectors' => [ $obj->selectors['flip_box']['transition'] => 'transition-duration: {{VALUE}}ms;' ],
167 'description' => esc_html__( 'This time calculate with milliseconds and this transition value is not working 3d,zoom in,zoom out and fade in effect', 'shopbuilder' ),
168 ];
169 $fields['flip_box_content_box_style_flip_box_width'] = [
170 'type' => 'slider',
171 'mode' => 'responsive',
172 'label' => esc_html__( 'Flip Box Width', 'shopbuilder' ),
173 'size_units' => [ 'px','%' ],
174 'range' => [
175 'px' => [
176 'min' => 100,
177 'max' => 2000,
178 ],
179 '%' => [
180 'min' => 0,
181 'max' => 100,
182 ],
183 ],
184 'selectors' => [ $obj->selectors['flip_box']['flip_box_width'] => 'max-width: {{SIZE}}{{UNIT}};' ],
185 ];
186 $fields['flip_box_content_box_style_flip_box_height'] = [
187 'type' => 'slider',
188 'mode' => 'responsive',
189 'label' => esc_html__( 'Flip Box Height', 'shopbuilder' ),
190 'size_units' => [ 'px','%' ],
191 'range' => [
192 'px' => [
193 'min' => 100,
194 'max' => 2000,
195 ],
196 '%' => [
197 'min' => 0,
198 'max' => 100,
199 ],
200 ],
201 'selectors' => [ $obj->selectors['flip_box']['flip_box_height'] => 'height: {{SIZE}}{{UNIT}};' ],
202 ];
203 $fields['flip_box_flip_settings_end'] = $obj->end_section();
204 return $fields;
205 }
206 /**
207 * Front Settings section
208 *
209 * @param object $obj Reference object.
210 *
211 * @return array
212 */
213 private static function front_back_settings( $obj, $prefix ) {
214 $title_condition = [
215 'display_' . $prefix . '_title' => 'yes',
216 ];
217 $content_condition = [
218 'display_' . $prefix . '_content' => 'yes',
219 ];
220 $icon_condition = [
221 'display_' . $prefix . '_icon' => 'yes',
222 ];
223 $fields[ 'flip_box_' . $prefix . '_settings_start' ] = $obj->start_section(
224 sprintf(
225 // Translators: %s is the prefix for the side title (e.g., 'Front', 'Back').
226 esc_html__( '%s Side', 'shopbuilder' ),
227 ucfirst( $prefix )
228 ),
229 'content'
230 );
231 $fields[ 'flip_box_' . $prefix . '_title_heading' ] = $obj->el_heading( esc_html__( 'Title', 'shopbuilder' ), 'default' );
232 $fields[ 'display_' . $prefix . '_title' ] = [
233 'label' => esc_html__( 'Show Title?', 'shopbuilder' ),
234 'description' => esc_html__( 'Switch on to show icon.', 'shopbuilder' ),
235 'label_on' => esc_html__( 'On', 'shopbuilder' ),
236 'label_off' => esc_html__( 'Off', 'shopbuilder' ),
237 'type' => 'switch',
238 'default' => 'yes',
239 ];
240 $fields[ 'flip_box_' . $prefix . '_title_html_tag' ] = [
241 'label' => esc_html__( 'Title Tag', 'shopbuilder' ),
242 'description' => esc_html__( 'Please select the title tag.', 'shopbuilder' ),
243 'type' => 'select',
244 'options' => ControlHelper::heading_tags(),
245 'default' => 'h2',
246 'label_block' => true,
247 'condition' => $title_condition,
248 ];
249 $fields[ 'flip_box_' . $prefix . '_title' ] = [
250 'label' => esc_html__( 'Title', 'shopbuilder' ),
251 'description' => esc_html__( 'Please enter the title text.', 'shopbuilder' ),
252 'type' => 'textarea',
253 'label_block' => true,
254 'default' => __( 'ShopBuilder for Easy Store Customization', 'shopbuilder' ),
255 'condition' => $title_condition,
256 ];
257 $fields[ 'flip_box_' . $prefix . '_content_heading' ] = $obj->el_heading( esc_html__( 'Content', 'shopbuilder' ), 'default' );
258 $fields[ 'display_' . $prefix . '_content' ] = [
259 'label' => esc_html__( 'Show Content?', 'shopbuilder' ),
260 'description' => esc_html__( 'Switch on to show content.', 'shopbuilder' ),
261 'label_on' => esc_html__( 'On', 'shopbuilder' ),
262 'label_off' => esc_html__( 'Off', 'shopbuilder' ),
263 'type' => 'switch',
264 'default' => 'yes',
265 ];
266 $fields[ 'flip_box_' . $prefix . '_content' ] = [
267 'label' => esc_html__( 'Content', 'shopbuilder' ),
268 'description' => esc_html__( 'Please enter the call to action description text.', 'shopbuilder' ),
269 'type' => 'wysiwyg',
270 'label_block' => true,
271 'default' => sprintf( '<p>%s</p>', esc_html__( 'ShopBuilder is a versatile plugin designed for Elementor Page Builder. This plugin helps you design and customize your online store easily, letting you create attractive product pages and improve the shopping experience for your customers.', 'shopbuilder' ) ),
272 'condition' => $content_condition,
273 ];
274 $fields[ 'flip_box_' . $prefix . '_icon_heading' ] = $obj->el_heading( esc_html__( 'Icon', 'shopbuilder' ), 'default' );
275 $fields[ 'display_' . $prefix . '_icon' ] = [
276 'label' => esc_html__( 'Show Icon?', 'shopbuilder' ),
277 'description' => esc_html__( 'Switch on to show icon.', 'shopbuilder' ),
278 'label_on' => esc_html__( 'On', 'shopbuilder' ),
279 'label_off' => esc_html__( 'Off', 'shopbuilder' ),
280 'type' => 'switch',
281 'default' => 'yes',
282 ];
283
284 $fields[ 'flip_box_' . $prefix . '_icon_type' ] = [
285 'label' => __( 'Icon Type', 'shopbuilder' ),
286 'type' => 'select',
287 'default' => 'icon',
288 'options' => [
289 'icon' => __( 'Icon', 'shopbuilder' ),
290 'image' => __( 'Image', 'shopbuilder' ),
291 ],
292 'condition' => $icon_condition,
293 ];
294
295 $fields[ 'flip_box_' . $prefix . '_icon' ] = [
296 'label' => esc_html__( 'Icon', 'shopbuilder' ),
297 'type' => 'icons',
298 'default' => [
299 'value' => 'fas fa-code',
300 'library' => 'fa-solid',
301 ],
302 'condition' => [
303 'flip_box_' . $prefix . '_icon_type' => [ 'icon' ],
304 'display_' . $prefix . '_icon' => 'yes',
305 ],
306
307 ];
308
309 $fields[ 'flip_box_' . $prefix . '_image' ] = [
310 'type' => 'media',
311 'label' => esc_html__( 'Upload Image', 'shopbuilder' ),
312 'default' => [
313 'url' => \Elementor\Utils::get_placeholder_image_src(),
314 ],
315 'condition' => [
316 'flip_box_' . $prefix . '_icon_type' => [ 'image' ],
317 'display_' . $prefix . '_icon' => 'yes',
318 ],
319 ];
320
321 $fields[ 'flip_box_' . $prefix . '_image_size' ] = [
322 'type' => 'select2',
323 'label' => esc_html__( 'Select Image Size', 'shopbuilder' ),
324 'description' => esc_html__( 'Please select the image size.', 'shopbuilder' ),
325 'options' => Fns::get_image_sizes(),
326 'default' => 'full',
327 'label_block' => true,
328 'content_classes' => 'elementor-descriptor',
329 'condition' => [
330 'flip_box_' . $prefix . '_icon_type' => [ 'image' ],
331 'display_' . $prefix . '_icon' => 'yes',
332 ],
333 ];
334
335 $fields[ 'flip_box_' . $prefix . '_img_dimension' ] = [
336 'type' => 'image-dimensions',
337 'label' => esc_html__( 'Enter Custom Image Size', 'shopbuilder' ),
338 'label_block' => true,
339 'default' => [
340 'width' => 400,
341 'height' => 400,
342 ],
343 'conditions' => [
344 'relation' => 'and',
345 'terms' => [
346 [
347 'name' => 'flip_box_' . $prefix . '_image_size',
348 'operator' => '==',
349 'value' => 'rtsb_custom',
350 ],
351 [
352 'name' => 'flip_box_' . $prefix . '_icon_type',
353 'operator' => '==',
354 'value' => 'image',
355 ],
356 [
357 'name' => 'display_' . $prefix . '_icon',
358 'operator' => '==',
359 'value' => 'yes',
360 ],
361 ],
362 ],
363 ];
364
365 $fields[ 'flip_box_' . $prefix . '_img_crop' ] = [
366 'type' => 'select2',
367 'label' => esc_html__( 'Image Crop', 'shopbuilder' ),
368 'description' => esc_html__( 'Please click on "Apply" to update the image.', 'shopbuilder' ),
369 'options' => [
370 'soft' => esc_html__( 'Soft Crop', 'shopbuilder' ),
371 'hard' => esc_html__( 'Hard Crop', 'shopbuilder' ),
372 ],
373 'default' => 'hard',
374 'condition' => [
375 'flip_box_' . $prefix . '_icon_type' => [ 'image' ],
376 'display_' . $prefix . '_icon' => 'yes',
377 'flip_box_' . $prefix . '_image_size' => 'rtsb_custom',
378 ],
379 ];
380
381 $fields[ 'flip_box_' . $prefix . '_img_custom_dimension_note' ] = [
382 'type' => 'html',
383 'raw' => sprintf(
384 '<span style="display: block; background: #fffbf1; padding: 10px; font-weight: 500; line-height: 1.4; color: #bd3a3a;border: 1px solid #bd3a3a;">%s</span>',
385 esc_html__( 'Please note that, if you enter image size larger than the actual image itself, the image sizes will fallback to the full image dimension.', 'shopbuilder' )
386 ),
387 'condition' => [
388 'flip_box_' . $prefix . '_icon_type' => [ 'image' ],
389 'display_' . $prefix . '_icon' => 'yes',
390 'flip_box_' . $prefix . '_image_size' => 'rtsb_custom',
391 ],
392 ];
393 $fields[ 'flip_box_' . $prefix . '_settings_end' ] = $obj->end_section();
394 return $fields;
395 }
396
397
398 /**
399 * Button section
400 *
401 * @param object $obj Reference object.
402 *
403 * @return array
404 */
405 private static function flip_box_button( $obj ) {
406 $front_condition = [
407 'display_front_button' => 'yes',
408 ];
409 $back_condition = [
410 'display_back_button' => 'yes',
411 ];
412 $fields['flip_box_button_sec_start'] = $obj->start_section(
413 esc_html__( 'Button', 'shopbuilder' ),
414 'content'
415 );
416 $fields['flip_box_front_button_heading'] = $obj->el_heading( esc_html__( 'Front', 'shopbuilder' ), 'default' );
417 $fields['display_front_button'] = [
418 'label' => esc_html__( 'Show Button?', 'shopbuilder' ),
419 'description' => esc_html__( 'Switch on to show button.', 'shopbuilder' ),
420 'label_on' => esc_html__( 'On', 'shopbuilder' ),
421 'label_off' => esc_html__( 'Off', 'shopbuilder' ),
422 'type' => 'switch',
423 'default' => 'yes',
424 ];
425 $fields['sb_front_button_icon'] = [
426 'label' => esc_html__( 'Button Icon', 'shopbuilder' ),
427 'type' => 'icons',
428 'default' => [
429 'value' => 'fas fa-arrow-right',
430 'library' => 'fa-solid',
431 ],
432 'condition' => $front_condition,
433 ];
434 $fields['sb_front_button_icon_position'] = [
435 'mode' => 'responsive',
436 'type' => 'choose',
437 'label' => esc_html__( 'Position', 'shopbuilder' ),
438 'options' => [
439 'left' => [
440 'title' => esc_html__( 'Left', 'shopbuilder' ),
441 'icon' => 'eicon-h-align-left',
442 ],
443 'right' => [
444 'title' => esc_html__( 'Right', 'shopbuilder' ),
445 'icon' => 'eicon-h-align-right',
446 ],
447
448 ],
449 'toggle' => true,
450 'default' => 'right',
451 'condition' => $front_condition,
452 ];
453
454 $fields['sb_front_button_content'] = [
455 'label' => esc_html__( 'Text', 'shopbuilder' ),
456 'description' => esc_html__( 'Please enter the button text.', 'shopbuilder' ),
457 'type' => 'text',
458 'label_block' => true,
459 'default' => __( 'ShopBuilder Button', 'shopbuilder' ),
460 'condition' => $front_condition,
461 ];
462 $fields['sb_front_button_link'] = [
463 'type' => 'link',
464 'label' => esc_html__( 'Link', 'shopbuilder' ),
465 'description' => esc_html__( 'Please enter a button link.', 'shopbuilder' ),
466 'placeholder' => esc_html__( 'https://custom-link.com', 'shopbuilder' ),
467 'options' => [ 'url', 'is_external', 'nofollow' ],
468 'condition' => $front_condition,
469 ];
470 $fields['flip_box_back_button_heading'] = $obj->el_heading( esc_html__( 'Back', 'shopbuilder' ), 'default' );
471 $fields['display_back_button'] = [
472 'label' => esc_html__( 'Show Button?', 'shopbuilder' ),
473 'description' => esc_html__( 'Switch on to show button.', 'shopbuilder' ),
474 'label_on' => esc_html__( 'On', 'shopbuilder' ),
475 'label_off' => esc_html__( 'Off', 'shopbuilder' ),
476 'type' => 'switch',
477 'default' => 'yes',
478 ];
479 $fields['sb_back_button_icon'] = [
480 'label' => esc_html__( 'Button Icon', 'shopbuilder' ),
481 'type' => 'icons',
482 'default' => [
483 'value' => 'fas fa-arrow-right',
484 'library' => 'fa-solid',
485 ],
486 'condition' => $back_condition,
487 ];
488 $fields['sb_back_button_icon_position'] = [
489 'mode' => 'responsive',
490 'type' => 'choose',
491 'label' => esc_html__( 'Position', 'shopbuilder' ),
492 'options' => [
493 'left' => [
494 'title' => esc_html__( 'Left', 'shopbuilder' ),
495 'icon' => 'eicon-h-align-left',
496 ],
497 'right' => [
498 'title' => esc_html__( 'Right', 'shopbuilder' ),
499 'icon' => 'eicon-h-align-right',
500 ],
501
502 ],
503 'toggle' => true,
504 'default' => 'right',
505 'condition' => $back_condition,
506 ];
507
508 $fields['sb_back_button_content'] = [
509 'label' => esc_html__( 'Text', 'shopbuilder' ),
510 'description' => esc_html__( 'Please enter the button text.', 'shopbuilder' ),
511 'type' => 'text',
512 'label_block' => true,
513 'default' => __( 'ShopBuilder Button', 'shopbuilder' ),
514 'condition' => $back_condition,
515 ];
516 $fields['sb_back_button_link'] = [
517 'type' => 'link',
518 'label' => esc_html__( 'Link', 'shopbuilder' ),
519 'description' => esc_html__( 'Please enter a button link.', 'shopbuilder' ),
520 'placeholder' => esc_html__( 'https://custom-link.com', 'shopbuilder' ),
521 'options' => [ 'url', 'is_external', 'nofollow' ],
522 'condition' => $back_condition,
523 ];
524
525 $fields['flip_box_button_sec_end'] = $obj->end_section();
526
527 return $fields;
528 }
529
530 /**
531 * Content style section
532 *
533 * @param object $obj Reference object.
534 *
535 * @return array
536 */
537 public static function content_style( $obj ) {
538 $css_selectors = $obj->selectors['content_style'];
539 $selectors = [
540 'front_typography' => $css_selectors['front_typography'],
541 'front_color' => [
542 $css_selectors['front_color'] => 'color: {{VALUE}};',
543 $css_selectors['front_list_icon_color'] => 'background-color: {{VALUE}};',
544 ],
545 'front_border' => $css_selectors['front_border'],
546 'front_padding' => [ $css_selectors['front_padding'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
547 'front_margin' => [ $css_selectors['front_margin'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}!important;' ],
548 'back_typography' => $css_selectors['back_typography'],
549 'back_color' => [
550 $css_selectors['back_color'] => 'color: {{VALUE}};',
551 $css_selectors['back_list_icon_color'] => 'background-color: {{VALUE}};',
552 ],
553 'back_border' => $css_selectors['back_border'],
554 'back_padding' => [ $css_selectors['back_padding'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
555 'back_margin' => [ $css_selectors['back_margin'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}!important;' ],
556 ];
557 $fields['flip_box_content_style_sec_start'] = $obj->start_section(
558 esc_html__( 'Content Style', 'shopbuilder' ),
559 'style',
560 [],
561 );
562 $fields['flipbox_content_tabs'] = $obj->start_tab_group();
563 $fields['flipbox_content_front_tab'] = $obj->start_tab( esc_html__( 'Front', 'shopbuilder' ) );
564 $fields['front_content_typo_note'] = $obj->el_heading( esc_html__( 'Typography', 'shopbuilder' ), 'default' );
565 $fields['front_content_typography'] = [
566 'mode' => 'group',
567 'type' => 'typography',
568 'selector' => $selectors['front_typography'],
569 ];
570 $fields['front_content_color_note'] = $obj->el_heading( esc_html__( 'Color', 'shopbuilder' ), 'default' );
571 $fields['front_content_color'] = [
572 'type' => 'color',
573 'label' => esc_html__( 'Color', 'shopbuilder' ),
574 'selectors' => $selectors['front_color'],
575 'separator' => 'default',
576 ];
577 $fields['front_content_border_note'] = $obj->el_heading( esc_html__( 'Border', 'shopbuilder' ), 'default' );
578 $fields['front_content_border'] = [
579 'mode' => 'group',
580 'type' => 'border',
581 'label' => esc_html__( 'Border', 'shopbuilder' ),
582 'selector' => $selectors['front_border'],
583 'fields_options' => [
584 'color' => [
585 'label' => esc_html__( 'Border Color', 'shopbuilder' ),
586 ],
587 ],
588 'separator' => 'default',
589 ];
590 $fields['front_content_spacing_note'] = $obj->el_heading( esc_html__( 'Spacing', 'shopbuilder' ), 'default' );
591 $fields['front_content_padding'] = [
592 'mode' => 'responsive',
593 'type' => 'dimensions',
594 'label' => esc_html__( 'Padding', 'shopbuilder' ),
595 'size_units' => [ 'px', '%', 'em' ],
596 'selectors' => $selectors['front_padding'],
597 'separator' => 'default',
598 ];
599 $fields['front_content_margin'] = [
600 'mode' => 'responsive',
601 'type' => 'dimensions',
602 'label' => esc_html__( 'Margin', 'shopbuilder' ),
603 'size_units' => [ 'px', '%', 'em' ],
604 'selectors' => $selectors['front_margin'],
605 ];
606 $fields['flipbox_content_front_tab_end'] = $obj->end_tab();
607
608 $fields['flipbox_content_back_tab'] = $obj->start_tab( esc_html__( 'Back', 'shopbuilder' ) );
609 $fields['back_content_typo_note'] = $obj->el_heading( esc_html__( 'Typography', 'shopbuilder' ), 'default' );
610 $fields['back_content_typography'] = [
611 'mode' => 'group',
612 'type' => 'typography',
613 'selector' => $selectors['back_typography'],
614 ];
615 $fields['back_content_color_note'] = $obj->el_heading( esc_html__( 'Color', 'shopbuilder' ), 'default' );
616 $fields['back_content_color'] = [
617 'type' => 'color',
618 'label' => esc_html__( 'Color', 'shopbuilder' ),
619 'selectors' => $selectors['back_color'],
620 'separator' => 'default',
621 ];
622 $fields['back_content_border_note'] = $obj->el_heading( esc_html__( 'Border', 'shopbuilder' ), 'default' );
623 $fields['back_content_border'] = [
624 'mode' => 'group',
625 'type' => 'border',
626 'label' => esc_html__( 'Border', 'shopbuilder' ),
627 'selector' => $selectors['back_border'],
628 'fields_options' => [
629 'color' => [
630 'label' => esc_html__( 'Border Color', 'shopbuilder' ),
631 ],
632 ],
633 'separator' => 'default',
634 ];
635 $fields['back_content_spacing_note'] = $obj->el_heading( esc_html__( 'Spacing', 'shopbuilder' ), 'default' );
636 $fields['back_content_padding'] = [
637 'mode' => 'responsive',
638 'type' => 'dimensions',
639 'label' => esc_html__( 'Padding', 'shopbuilder' ),
640 'size_units' => [ 'px', '%', 'em' ],
641 'selectors' => $selectors['back_padding'],
642 'separator' => 'default',
643 ];
644 $fields['back_content_margin'] = [
645 'mode' => 'responsive',
646 'type' => 'dimensions',
647 'label' => esc_html__( 'Margin', 'shopbuilder' ),
648 'size_units' => [ 'px', '%', 'em' ],
649 'selectors' => $selectors['back_margin'],
650 ];
651 $fields['flipbox_content_back_tab_end'] = $obj->end_tab();
652
653 $fields['flipbox_content_tabs_end'] = $obj->end_tab_group();
654 $fields['flip_box_content_style_sec_end'] = $obj->end_section();
655 return $fields;
656 }
657 /**
658 * Title style section
659 *
660 * @param object $obj Reference object.
661 *
662 * @return array
663 */
664 public static function title_style( $obj ) {
665 $css_selectors = $obj->selectors['title_style'];
666 $selectors = [
667 'front_typography' => $css_selectors['front_typography'],
668 'front_color' => [ $css_selectors['front_color'] => 'color: {{VALUE}};' ],
669 'front_bg_color' => [ $css_selectors['front_bg_color'] => 'background: {{VALUE}};' ],
670 'front_title_box_shadow' => $css_selectors['front_title_box_shadow'],
671 'front_border' => $css_selectors['front_border'],
672 'front_padding' => [ $css_selectors['front_padding'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
673 'front_margin' => [ $css_selectors['front_margin'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}!important;' ],
674 'front_border_radius' => [ $css_selectors['front_border_radius'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}!important;' ],
675 'back_typography' => $css_selectors['back_typography'],
676 'back_color' => [ $css_selectors['back_color'] => 'color: {{VALUE}};' ],
677 'back_bg_color' => [ $css_selectors['back_bg_color'] => 'background: {{VALUE}};' ],
678 'back_title_box_shadow' => $css_selectors['back_title_box_shadow'],
679 'back_border' => $css_selectors['back_border'],
680 'back_padding' => [ $css_selectors['back_padding'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
681 'back_border_radius' => [ $css_selectors['back_border_radius'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}!important;' ],
682 'back_margin' => [ $css_selectors['back_margin'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}!important;' ],
683 ];
684 $fields['flip_box_title_style_sec_start'] = $obj->start_section(
685 esc_html__( 'Title Style', 'shopbuilder' ),
686 'style',
687 [],
688 );
689 $fields['flipbox_title_tabs'] = $obj->start_tab_group();
690 $fields['flipbox_title_front_tab'] = $obj->start_tab( esc_html__( 'Front', 'shopbuilder' ) );
691 $fields['front_typo_note'] = $obj->el_heading( esc_html__( 'Typography', 'shopbuilder' ), 'default' );
692 $fields['front_title_typography'] = [
693 'mode' => 'group',
694 'type' => 'typography',
695 'selector' => $selectors['front_typography'],
696 ];
697 $fields['front_title_color_note'] = $obj->el_heading( esc_html__( 'Color', 'shopbuilder' ), 'default' );
698 $fields['front_title_color'] = [
699 'type' => 'color',
700 'label' => esc_html__( 'Color', 'shopbuilder' ),
701 'selectors' => $selectors['front_color'],
702 'separator' => 'default',
703 ];
704 $fields['front_title_bg_color'] = [
705 'type' => 'color',
706 'label' => esc_html__( 'Background', 'shopbuilder' ),
707 'selectors' => $selectors['front_bg_color'],
708 'separator' => 'default',
709 ];
710 $fields['front_title_box_shadow'] = [
711 'type' => 'box-shadow',
712 'mode' => 'group',
713 'label' => esc_html__( 'Box Shadow', 'shopbuilder' ),
714 'selector' => $selectors['front_title_box_shadow'],
715 ];
716 $fields['front_title_border_note'] = $obj->el_heading( esc_html__( 'Border', 'shopbuilder' ), 'default' );
717 $fields['front_title_border'] = [
718 'mode' => 'group',
719 'type' => 'border',
720 'label' => esc_html__( 'Border', 'shopbuilder' ),
721 'selector' => $selectors['front_border'],
722 'fields_options' => [
723 'color' => [
724 'label' => esc_html__( 'Border Color', 'shopbuilder' ),
725 ],
726 ],
727 'separator' => 'default',
728 ];
729 $fields['front_title_border_radius'] = [
730 'mode' => 'responsive',
731 'type' => 'dimensions',
732 'label' => esc_html__( 'Border Radius', 'shopbuilder' ),
733 'size_units' => [ 'px', '%', 'em' ],
734 'selectors' => $selectors['front_border_radius'],
735 'separator' => 'default',
736 ];
737 $fields['front_title_spacing_note'] = $obj->el_heading( esc_html__( 'Spacing', 'shopbuilder' ), 'default' );
738 $fields['front_title_padding'] = [
739 'mode' => 'responsive',
740 'type' => 'dimensions',
741 'label' => esc_html__( 'Padding', 'shopbuilder' ),
742 'size_units' => [ 'px', '%', 'em' ],
743 'selectors' => $selectors['front_padding'],
744 'separator' => 'default',
745 ];
746 $fields['front_title_margin'] = [
747 'mode' => 'responsive',
748 'type' => 'dimensions',
749 'label' => esc_html__( 'Margin', 'shopbuilder' ),
750 'size_units' => [ 'px', '%', 'em' ],
751 'selectors' => $selectors['front_margin'],
752 ];
753 $fields['flipbox_title_front_tab_end'] = $obj->end_tab();
754
755 $fields['flipbox_title_back_tab'] = $obj->start_tab( esc_html__( 'Back', 'shopbuilder' ) );
756 $fields['back_title_typo_note'] = $obj->el_heading( esc_html__( 'Typography', 'shopbuilder' ), 'default' );
757 $fields['back_title_typography'] = [
758 'mode' => 'group',
759 'type' => 'typography',
760 'selector' => $selectors['back_typography'],
761 ];
762 $fields['back_title_color_note'] = $obj->el_heading( esc_html__( 'Color', 'shopbuilder' ), 'default' );
763 $fields['back_title_color'] = [
764 'type' => 'color',
765 'label' => esc_html__( 'Color', 'shopbuilder' ),
766 'selectors' => $selectors['back_color'],
767 'separator' => 'default',
768 ];
769 $fields['back_title_bg_color'] = [
770 'type' => 'color',
771 'label' => esc_html__( 'Background', 'shopbuilder' ),
772 'selectors' => $selectors['back_bg_color'],
773 'separator' => 'default',
774 ];
775 $fields['back_title_box_shadow'] = [
776 'type' => 'box-shadow',
777 'mode' => 'group',
778 'label' => esc_html__( 'Box Shadow', 'shopbuilder' ),
779 'selector' => $selectors['back_title_box_shadow'],
780 ];
781 $fields['back_title_border_note'] = $obj->el_heading( esc_html__( 'Border', 'shopbuilder' ), 'default' );
782 $fields['back_title_border'] = [
783 'mode' => 'group',
784 'type' => 'border',
785 'label' => esc_html__( 'Border', 'shopbuilder' ),
786 'selector' => $selectors['back_border'],
787 'fields_options' => [
788 'color' => [
789 'label' => esc_html__( 'Border Color', 'shopbuilder' ),
790 ],
791 ],
792 'separator' => 'default',
793 ];
794 $fields['back_title_border_radius'] = [
795 'mode' => 'responsive',
796 'type' => 'dimensions',
797 'label' => esc_html__( 'Border Radius', 'shopbuilder' ),
798 'size_units' => [ 'px', '%', 'em' ],
799 'selectors' => $selectors['back_border_radius'],
800 'separator' => 'default',
801 ];
802 $fields['back_title_spacing_note'] = $obj->el_heading( esc_html__( 'Spacing', 'shopbuilder' ), 'default' );
803 $fields['back_title_padding'] = [
804 'mode' => 'responsive',
805 'type' => 'dimensions',
806 'label' => esc_html__( 'Padding', 'shopbuilder' ),
807 'size_units' => [ 'px', '%', 'em' ],
808 'selectors' => $selectors['back_padding'],
809 'separator' => 'default',
810 ];
811 $fields['back_title_margin'] = [
812 'mode' => 'responsive',
813 'type' => 'dimensions',
814 'label' => esc_html__( 'Margin', 'shopbuilder' ),
815 'size_units' => [ 'px', '%', 'em' ],
816 'selectors' => $selectors['back_margin'],
817 ];
818 $fields['flipbox_title_back_tab_end'] = $obj->end_tab();
819
820 $fields['flipbox_title_tabs_end'] = $obj->end_tab_group();
821 $fields['flip_box_title_style_sec_end'] = $obj->end_section();
822 return $fields;
823 }
824 /**
825 * Icon style section
826 *
827 * @param object $obj Reference object.
828 *
829 * @return array
830 */
831 public static function icon_box_style( $obj ) {
832 $css_selectors = $obj->selectors['flip_box_icon_style'];
833 $selectors = [
834 'front_icon_size' => [
835 $css_selectors['front_icon_size']['font_size'] => 'font-size: {{SIZE}}{{UNIT}};',
836 $css_selectors['front_icon_size']['svg'] => 'height: {{SIZE}}{{UNIT}};width: {{SIZE}}{{UNIT}};',
837 ],
838 'front_box_shadow' => $css_selectors['front_box_shadow'],
839 'front_icon_width' => [ $css_selectors['front_icon_width'] => 'width: {{SIZE}}{{UNIT}};' ],
840 'front_icon_height' => [ $css_selectors['front_icon_height'] => 'height: {{SIZE}}{{UNIT}};' ],
841 'front_color' => [ $css_selectors['front_color'] => 'color: {{VALUE}};' ],
842 'front_gradient_bg' => $css_selectors['front_gradient_bg'],
843 'front_border' => $css_selectors['front_border'],
844 'front_margin' => [ $css_selectors['front_margin'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
845 'front_border_radius' => [ $css_selectors['front_border_radius'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
846 'back_icon_size' => [
847 $css_selectors['back_icon_size']['font_size'] => 'font-size: {{SIZE}}{{UNIT}};',
848 $css_selectors['back_icon_size']['svg'] => 'height: {{SIZE}}{{UNIT}};width: {{SIZE}}{{UNIT}};',
849 ],
850 'back_box_shadow' => $css_selectors['back_box_shadow'],
851 'back_icon_width' => [ $css_selectors['back_icon_width'] => 'width: {{SIZE}}{{UNIT}};' ],
852 'back_icon_height' => [ $css_selectors['back_icon_height'] => 'height: {{SIZE}}{{UNIT}};' ],
853 'back_color' => [ $css_selectors['back_color'] => 'color: {{VALUE}};' ],
854 'back_gradient_bg' => $css_selectors['back_gradient_bg'],
855 'back_border' => $css_selectors['back_border'],
856 'back_margin' => [ $css_selectors['back_margin'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
857 'back_border_radius' => [ $css_selectors['back_border_radius'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
858
859 ];
860 $fields['flip_box_icon_style_sec_start'] = $obj->start_section(
861 esc_html__( 'Icon Style', 'shopbuilder' ),
862 'style',
863 [],
864 );
865 $fields['flipbox_icon_tabs'] = $obj->start_tab_group();
866 $fields['flipbox_icon_front_tab'] = $obj->start_tab( esc_html__( 'Front', 'shopbuilder' ) );
867 $fields['front_color_note'] = $obj->el_heading( esc_html__( 'Color', 'shopbuilder' ), 'default' );
868 $fields['front_icon_color'] = [
869 'type' => 'color',
870 'label' => esc_html__( 'Color', 'shopbuilder' ),
871 'selectors' => $selectors['front_color'],
872 'separator' => 'default',
873 ];
874 $fields['front_icon_style_gradient_bg'] = [
875 'label' => esc_html__( 'Background', 'shopbuilder' ),
876 'type' => 'background',
877 'mode' => 'group',
878 'selector' => $selectors['front_gradient_bg'],
879 ];
880 $fields['front_icon_style_box_shadow'] = [
881 'type' => 'box-shadow',
882 'mode' => 'group',
883 'label' => esc_html__( 'Box Shadow', 'shopbuilder' ),
884 'selector' => $selectors['front_box_shadow'],
885 ];
886 $fields['front_border_note'] = $obj->el_heading( esc_html__( 'Border', 'shopbuilder' ), 'default' );
887 $fields['front_icon_border'] = [
888 'mode' => 'group',
889 'type' => 'border',
890 'label' => esc_html__( 'Border', 'shopbuilder' ),
891 'selector' => $selectors['front_border'],
892 'fields_options' => [
893 'color' => [
894 'label' => esc_html__( 'Border Color', 'shopbuilder' ),
895 ],
896 ],
897 'separator' => 'default',
898 ];
899 $fields['front_icon_style_border_radius'] = [
900 'label' => esc_html__( 'Border Radius', 'shopbuilder' ),
901 'type' => 'dimensions',
902 'mode' => 'responsive',
903 'size_units' => [ 'px' ],
904 'selectors' => $selectors['front_border_radius'],
905 ];
906 $fields['front_spacing_note'] = $obj->el_heading( esc_html__( 'Spacing', 'shopbuilder' ), 'default' );
907 $fields['front_icon_style_icon_width'] = [
908 'type' => 'slider',
909 'mode' => 'responsive',
910 'label' => esc_html__( 'Icon Width', 'shopbuilder' ),
911 'size_units' => [ 'px','%' ],
912 'range' => [
913 'px' => [
914 'min' => 10,
915 'max' => 1000,
916 ],
917 '%' => [
918 'min' => 0,
919 'max' => 100,
920 ],
921 ],
922 'selectors' => $selectors['front_icon_width'],
923 ];
924 $fields['front_icon_style_icon_height'] = [
925 'type' => 'slider',
926 'mode' => 'responsive',
927 'label' => esc_html__( 'Icon Height', 'shopbuilder' ),
928 'size_units' => [ 'px','%' ],
929 'range' => [
930 'px' => [
931 'min' => 10,
932 'max' => 1000,
933 ],
934 '%' => [
935 'min' => 0,
936 'max' => 100,
937 ],
938 ],
939 'selectors' => $selectors['front_icon_height'],
940 ];
941 $fields['front_icon_style_icon_size'] = [
942 'type' => 'slider',
943 'mode' => 'responsive',
944 'label' => esc_html__( 'Icon Size', 'shopbuilder' ),
945 'size_units' => [ 'px' ],
946 'range' => [
947 'px' => [
948 'min' => 0,
949 'max' => 100,
950 ],
951 ],
952 'selectors' => $selectors['front_icon_size'],
953 ];
954 $fields['front_icon_margin'] = [
955 'mode' => 'responsive',
956 'type' => 'dimensions',
957 'label' => esc_html__( 'Margin', 'shopbuilder' ),
958 'size_units' => [ 'px', '%', 'em' ],
959 'selectors' => $selectors['front_margin'],
960 ];
961 $fields['flipbox_icon_front_tab_end'] = $obj->end_tab();
962
963 $fields['flipbox_icon_back_tab'] = $obj->start_tab( esc_html__( 'Back', 'shopbuilder' ) );
964 $fields['back_color_note'] = $obj->el_heading( esc_html__( 'Color', 'shopbuilder' ), 'default' );
965 $fields['back_icon_color'] = [
966 'type' => 'color',
967 'label' => esc_html__( 'Color', 'shopbuilder' ),
968 'selectors' => $selectors['back_color'],
969 'separator' => 'default',
970 ];
971 $fields['back_icon_style_gradient_bg'] = [
972 'label' => esc_html__( 'Background', 'shopbuilder' ),
973 'type' => 'background',
974 'mode' => 'group',
975 'selector' => $selectors['back_gradient_bg'],
976 ];
977 $fields['back_icon_style_box_shadow'] = [
978 'type' => 'box-shadow',
979 'mode' => 'group',
980 'label' => esc_html__( 'Box Shadow', 'shopbuilder' ),
981 'selector' => $selectors['back_box_shadow'],
982 ];
983 $fields['back_border_note'] = $obj->el_heading( esc_html__( 'Border', 'shopbuilder' ), 'default' );
984 $fields['back_icon_border'] = [
985 'mode' => 'group',
986 'type' => 'border',
987 'label' => esc_html__( 'Border', 'shopbuilder' ),
988 'selector' => $selectors['back_border'],
989 'fields_options' => [
990 'color' => [
991 'label' => esc_html__( 'Border Color', 'shopbuilder' ),
992 ],
993 ],
994 'separator' => 'default',
995 ];
996 $fields['back_icon_style_border_radius'] = [
997 'label' => esc_html__( 'Border Radius', 'shopbuilder' ),
998 'type' => 'dimensions',
999 'mode' => 'responsive',
1000 'size_units' => [ 'px' ],
1001 'selectors' => $selectors['back_border_radius'],
1002 ];
1003 $fields['back_spacing_note'] = $obj->el_heading( esc_html__( 'Spacing', 'shopbuilder' ), 'default' );
1004 $fields['back_icon_style_icon_width'] = [
1005 'type' => 'slider',
1006 'mode' => 'responsive',
1007 'label' => esc_html__( 'Icon Width', 'shopbuilder' ),
1008 'size_units' => [ 'px','%' ],
1009 'range' => [
1010 'px' => [
1011 'min' => 10,
1012 'max' => 1000,
1013 ],
1014 '%' => [
1015 'min' => 0,
1016 'max' => 100,
1017 ],
1018 ],
1019 'selectors' => $selectors['back_icon_width'],
1020 ];
1021 $fields['back_icon_style_icon_height'] = [
1022 'type' => 'slider',
1023 'mode' => 'responsive',
1024 'label' => esc_html__( 'Icon Height', 'shopbuilder' ),
1025 'size_units' => [ 'px','%' ],
1026 'range' => [
1027 'px' => [
1028 'min' => 10,
1029 'max' => 1000,
1030 ],
1031 '%' => [
1032 'min' => 0,
1033 'max' => 100,
1034 ],
1035 ],
1036 'selectors' => $selectors['back_icon_height'],
1037 ];
1038 $fields['back_icon_style_icon_size'] = [
1039 'type' => 'slider',
1040 'mode' => 'responsive',
1041 'label' => esc_html__( 'Icon Size', 'shopbuilder' ),
1042 'size_units' => [ 'px' ],
1043 'range' => [
1044 'px' => [
1045 'min' => 0,
1046 'max' => 100,
1047 ],
1048 ],
1049 'selectors' => $selectors['back_icon_size'],
1050 ];
1051 $fields['back_icon_margin'] = [
1052 'mode' => 'responsive',
1053 'type' => 'dimensions',
1054 'label' => esc_html__( 'Margin', 'shopbuilder' ),
1055 'size_units' => [ 'px', '%', 'em' ],
1056 'selectors' => $selectors['back_margin'],
1057 ];
1058 $fields['flipbox_icon_back_tab_end'] = $obj->end_tab();
1059
1060 $fields['flipbox_icon_tabs_end'] = $obj->end_tab_group();
1061 $fields['flip_box_icon_style_sec_end'] = $obj->end_section();
1062 return $fields;
1063 }
1064 /**
1065 * Content Box style section
1066 *
1067 * @param object $obj Reference object.
1068 *
1069 * @return array
1070 */
1071 public static function content_box_style( $obj ) {
1072 $css_selectors = $obj->selectors['content_box_style'];
1073 $selectors = [
1074 'front_box_shadow' => $css_selectors['front_box_shadow'],
1075 'front_gradient_bg' => $css_selectors['front_gradient_bg'],
1076 'front_bg_overlay' => $css_selectors['front_bg_overlay'],
1077 'front_border' => $css_selectors['front_border'],
1078 'front_padding' => [ $css_selectors['front_padding'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
1079 'front_border_radius' => [ $css_selectors['front_border_radius'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
1080 'back_box_shadow' => $css_selectors['back_box_shadow'],
1081 'back_gradient_bg' => $css_selectors['back_gradient_bg'],
1082 'back_bg_overlay' => $css_selectors['back_bg_overlay'],
1083 'back_border' => $css_selectors['back_border'],
1084 'back_padding' => [ $css_selectors['back_padding'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
1085 'back_border_radius' => [ $css_selectors['back_border_radius'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
1086 ];
1087 $fields['content_box_style_sec_start'] = $obj->start_section(
1088 esc_html__( 'Content Box Style', 'shopbuilder' ),
1089 'style',
1090 [],
1091 );
1092 $fields['content_box_tabs'] = $obj->start_tab_group();
1093 $fields['content_box_front_tab'] = $obj->start_tab( esc_html__( 'Front', 'shopbuilder' ) );
1094 $fields['front_content_box_color_note'] = $obj->el_heading( esc_html__( 'Color', 'shopbuilder' ), 'default' );
1095 $fields['front_content_box_style_gradient_bg'] = [
1096 'label' => esc_html__( 'Background', 'shopbuilder' ),
1097 'type' => 'background',
1098 'mode' => 'group',
1099 'selector' => $selectors['front_gradient_bg'],
1100 ];
1101 $fields['front_content_box_style_bg_overlay'] = [
1102 'label' => esc_html__( 'Background Overlay', 'shopbuilder' ),
1103 'type' => 'background',
1104 'mode' => 'group',
1105 'exclude' => [ 'image' ], // phpcs:ignore WordPressVIPMinimum.Performance.WPQueryParams.PostNotIn_exclude
1106 'selector' => $selectors['front_bg_overlay'],
1107 'fields_options' => [
1108 'background' => [
1109 'label' => esc_html__( 'Overlay Background Type', 'shopbuilder' ),
1110 ],
1111 ],
1112 ];
1113 $fields['front_content_box_style_box_shadow'] = [
1114 'type' => 'box-shadow',
1115 'mode' => 'group',
1116 'label' => esc_html__( 'Box Shadow', 'shopbuilder' ),
1117 'selector' => $selectors['front_box_shadow'],
1118 ];
1119 $fields['front_content_box_border_note'] = $obj->el_heading( esc_html__( 'Border', 'shopbuilder' ), 'default' );
1120 $fields['front_content_box_border'] = [
1121 'mode' => 'group',
1122 'type' => 'border',
1123 'label' => esc_html__( 'Border', 'shopbuilder' ),
1124 'selector' => $selectors['front_border'],
1125 'fields_options' => [
1126 'color' => [
1127 'label' => esc_html__( 'Border Color', 'shopbuilder' ),
1128 ],
1129 ],
1130 'separator' => 'default',
1131 ];
1132 $fields['front_content_box_style_border_radius'] = [
1133 'label' => esc_html__( 'Border Radius', 'shopbuilder' ),
1134 'type' => 'dimensions',
1135 'mode' => 'responsive',
1136 'size_units' => [ 'px' ],
1137 'selectors' => $selectors['front_border_radius'],
1138 ];
1139 $fields['content_box_front_spacing_note'] = $obj->el_heading( esc_html__( 'Spacing', 'shopbuilder' ), 'default' );
1140
1141 $fields['front_content_box_padding'] = [
1142 'mode' => 'responsive',
1143 'type' => 'dimensions',
1144 'label' => esc_html__( 'Padding', 'shopbuilder' ),
1145 'size_units' => [ 'px', '%', 'em' ],
1146 'selectors' => $selectors['front_padding'],
1147 ];
1148 $fields['content_box_front_tab_end'] = $obj->end_tab();
1149
1150 $fields['content_box_back_tab'] = $obj->start_tab( esc_html__( 'Back', 'shopbuilder' ) );
1151
1152 $fields['back_content_box_color_note'] = $obj->el_heading( esc_html__( 'Color', 'shopbuilder' ), 'default' );
1153 $fields['back_content_box_style_gradient_bg'] = [
1154 'label' => esc_html__( 'Background', 'shopbuilder' ),
1155 'type' => 'background',
1156 'mode' => 'group',
1157 'selector' => $selectors['back_gradient_bg'],
1158 ];
1159 $fields['back_content_box_style_bg_overlay'] = [
1160 'label' => esc_html__( 'Background Overlay', 'shopbuilder' ),
1161 'type' => 'background',
1162 'mode' => 'group',
1163 'exclude' => [ 'image' ], // phpcs:ignore WordPressVIPMinimum.Performance.WPQueryParams.PostNotIn_exclude
1164 'selector' => $selectors['back_bg_overlay'],
1165 'fields_options' => [
1166 'background' => [
1167 'label' => esc_html__( 'Overlay Background Type', 'shopbuilder' ),
1168 ],
1169 ],
1170 ];
1171 $fields['back_content_box_style_box_shadow'] = [
1172 'type' => 'box-shadow',
1173 'mode' => 'group',
1174 'label' => esc_html__( 'Box Shadow', 'shopbuilder' ),
1175 'selector' => $selectors['back_box_shadow'],
1176 ];
1177 $fields['back_content_box_border_note'] = $obj->el_heading( esc_html__( 'Border', 'shopbuilder' ), 'default' );
1178 $fields['back_content_box_border'] = [
1179 'mode' => 'group',
1180 'type' => 'border',
1181 'label' => esc_html__( 'Border', 'shopbuilder' ),
1182 'selector' => $selectors['back_border'],
1183 'fields_options' => [
1184 'color' => [
1185 'label' => esc_html__( 'Border Color', 'shopbuilder' ),
1186 ],
1187 ],
1188 'separator' => 'default',
1189 ];
1190 $fields['back_content_box_style_border_radius'] = [
1191 'label' => esc_html__( 'Border Radius', 'shopbuilder' ),
1192 'type' => 'dimensions',
1193 'mode' => 'responsive',
1194 'size_units' => [ 'px' ],
1195 'selectors' => $selectors['back_border_radius'],
1196 ];
1197 $fields['back_content_box_spacing_note'] = $obj->el_heading( esc_html__( 'Spacing', 'shopbuilder' ), 'default' );
1198 $fields['back_content_box_padding'] = [
1199 'mode' => 'responsive',
1200 'type' => 'dimensions',
1201 'label' => esc_html__( 'Padding', 'shopbuilder' ),
1202 'size_units' => [ 'px', '%', 'em' ],
1203 'selectors' => $selectors['back_padding'],
1204 'separator' => 'default',
1205 ];
1206
1207 $fields['content_box_back_tab_end'] = $obj->end_tab();
1208
1209 $fields['content_box_tabs_end'] = $obj->end_tab_group();
1210 $fields['content_box_style_end'] = $obj->end_section();
1211 return $fields;
1212 }
1213 /**
1214 * Button style section
1215 *
1216 * @param object $obj Reference object.
1217 *
1218 * @return array
1219 */
1220 private static function button_style( $obj, $type = 'front' ) {
1221 $condition = [
1222 'display_' . $type . '_button' => 'yes',
1223 ];
1224 $css_selectors = $obj->selectors[ $type . '_button_style' ];
1225 $title = sprintf(
1226 // Translators: %s is replaced with the button type, e.g., "Front", "Back", etc.
1227 esc_html__( '%s Button Style', 'shopbuilder' ),
1228 ucfirst( $type )
1229 );
1230 $selectors = [
1231 'typography' => $css_selectors['typography'],
1232 'icon_size' => [
1233 $css_selectors['icon_size']['font_size'] => 'font-size: {{SIZE}}{{UNIT}};',
1234 $css_selectors['icon_size']['svg'] => 'height: {{SIZE}}{{UNIT}};width: {{SIZE}}{{UNIT}};',
1235 ],
1236 'icon_gap' => [ $css_selectors['icon_gap'] => 'gap: {{SIZE}}{{UNIT}};' ],
1237 'btn_width' => [ $css_selectors['btn_width'] => 'min-width: {{SIZE}}{{UNIT}};' ],
1238 'btn_height' => [ $css_selectors['btn_height'] => 'height: {{SIZE}}{{UNIT}};' ],
1239 'color' => [ $css_selectors['color'] => 'color: {{VALUE}};' ],
1240 'hover_color' => [ $css_selectors['hover_color'] => 'color: {{VALUE}};' ],
1241 'gradient_bg' => $css_selectors['gradient_bg'],
1242 'hover_gradient_bg' => $css_selectors['hover_gradient_bg'],
1243 'border' => $css_selectors['border'],
1244 'box_shadow' => $css_selectors['box_shadow'],
1245 'border_hover_color' => [ $css_selectors['border_hover_color'] => 'border-color: {{VALUE}};' ],
1246 'padding' => [ $css_selectors['padding'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
1247 'margin' => [ $css_selectors['margin'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
1248 'border_radius' => [ $css_selectors['border_radius'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;' ],
1249 ];
1250
1251 $fields = ControlHelper::general_elementor_style( 'sb_' . $type . '_button_style', $title, $obj, $condition, $selectors );
1252 unset(
1253 $fields[ 'sb_' . $type . '_button_style_bg_color' ],
1254 $fields[ 'sb_' . $type . '_button_style_alignment' ],
1255 $fields[ 'sb_' . $type . '_button_style_hover_bg_color' ],
1256 );
1257 $extra_controls[ 'sb_' . $type . '_button_style_border_radius' ] = [
1258 'label' => esc_html__( 'Border Radius', 'shopbuilder' ),
1259 'type' => 'dimensions',
1260 'mode' => 'responsive',
1261 'size_units' => [ 'px' ],
1262 'selectors' => $selectors['border_radius'],
1263 ];
1264 $fields = Fns::insert_controls( 'sb_' . $type . '_button_style_spacing_note', $fields, $extra_controls );
1265 $extra_controls2[ 'sb_' . $type . '_button_style_btn_width' ] = [
1266 'type' => 'slider',
1267 'mode' => 'responsive',
1268 'label' => esc_html__( 'Button Width', 'shopbuilder' ),
1269 'size_units' => [ 'px','%' ],
1270 'range' => [
1271 'px' => [
1272 'min' => 10,
1273 'max' => 1000,
1274 ],
1275 '%' => [
1276 'min' => 0,
1277 'max' => 100,
1278 ],
1279 ],
1280 'selectors' => $selectors['btn_width'],
1281 ];
1282 $extra_controls2[ 'sb_' . $type . '_button_style_btn_height' ] = [
1283 'type' => 'slider',
1284 'mode' => 'responsive',
1285 'label' => esc_html__( 'Button Height', 'shopbuilder' ),
1286 'size_units' => [ 'px','%' ],
1287 'range' => [
1288 'px' => [
1289 'min' => 10,
1290 'max' => 1000,
1291 ],
1292 '%' => [
1293 'min' => 0,
1294 'max' => 100,
1295 ],
1296 ],
1297 'selectors' => $selectors['btn_height'],
1298 ];
1299
1300 $extra_controls2[ 'sb_' . $type . '_button_style_icon_size' ] = [
1301 'type' => 'slider',
1302 'mode' => 'responsive',
1303 'label' => esc_html__( 'Icon Size', 'shopbuilder' ),
1304 'size_units' => [ 'px' ],
1305 'range' => [
1306 'px' => [
1307 'min' => 0,
1308 'max' => 100,
1309 ],
1310 ],
1311 'selectors' => $selectors['icon_size'],
1312 ];
1313 $extra_controls2[ 'sb_' . $type . '_button_style_icon_gap' ] = [
1314 'type' => 'slider',
1315 'mode' => 'responsive',
1316 'label' => esc_html__( 'Icon Gap', 'shopbuilder' ),
1317 'size_units' => [ 'px' ],
1318 'range' => [
1319 'px' => [
1320 'min' => 0,
1321 'max' => 100,
1322 ],
1323 ],
1324 'selectors' => $selectors['icon_gap'],
1325 ];
1326 $extra_controls2[ 'sb_' . $type . '_button_style_box_shadow' ] = [
1327 'type' => 'box-shadow',
1328 'mode' => 'group',
1329 'label' => esc_html__( 'Box Shadow', 'shopbuilder' ),
1330 'selector' => $selectors['box_shadow'],
1331 ];
1332 $fields = Fns::insert_controls( 'sb_' . $type . '_button_style_spacing_note', $fields, $extra_controls2, true );
1333
1334 $extra_controls3[ 'sb_' . $type . '_button_style_gradient_bg' ] = [
1335 'label' => esc_html__( 'Background', 'shopbuilder' ),
1336 'type' => 'background',
1337 'mode' => 'group',
1338 'selector' => $selectors['gradient_bg'],
1339 ];
1340 $fields = Fns::insert_controls( 'sb_' . $type . '_button_style_color', $fields, $extra_controls3, true );
1341
1342 $extra_controls4[ 'sb_' . $type . '_button_style_hover_gradient_bg' ] = [
1343 'label' => esc_html__( 'Hover Background', 'shopbuilder' ),
1344 'type' => 'background',
1345 'mode' => 'group',
1346 'selector' => $selectors['hover_gradient_bg'],
1347 ];
1348 $fields = Fns::insert_controls( 'sb_' . $type . '_button_style_hover_color', $fields, $extra_controls4, true );
1349
1350 return $fields;
1351 }
1352 }
1353