ablocks / includes / blocks / info-box / block.php

block.php in aBlocks – Gutenberg Blocks, User Dashboard Builder, Popup Builder, Form Builder & Animation Builder 2.14.0, at includes/blocks/info-box/block.php

1,115 lines 53.2 KB

Raw Download Zip

1	<?php
2	namespace ABlocks\Blocks\InfoBox;
3
4	if ( ! defined( 'ABSPATH' ) ) {
5	exit;
6	}
7
8	use ABlocks\Classes\BlockBaseAbstract;
9	use ABlocks\Classes\CssGenerator;
10	use ABlocks\Classes\CssGeneratorV2;
11	use ABlocks\Controls\Alignment;
12	use ABlocks\Controls\Typography;
13	use ABlocks\Controls\TextShadow;
14	use ABlocks\Controls\TextStroke;
15	use ABlocks\Controls\Border;
16	use ABlocks\Controls\Dimensions;
17	use ABlocks\Controls\Icon;
18	use ABlocks\Controls\Range;
19	use ABlocks\Controls\Color;
20
21	class Block extends BlockBaseAbstract {
22	protected $block_name = 'info-box';
23
24	public function build_css_v1( $attributes ) {
25	$css_generator = new CssGenerator( $attributes, $this->block_name );
26
27	$css_generator->add_class_styles(
28	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container',
29	$this->get_info_box( $attributes ),
30	$this->get_info_box( $attributes, 'Tablet' ),
31	$this->get_info_box( $attributes, 'Mobile' ),
32	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_info_box( $attributes, $device ); } )
33	);
34	$css_generator->add_class_styles(
35	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-block--info-box__content',
36	$this->get_info_box_content( $attributes ),
37	$this->get_info_box_content( $attributes, 'Tablet' ),
38	$this->get_info_box_content( $attributes, 'Mobile' ),
39	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_info_box_content( $attributes, $device ); } )
40	);
41
42	// badge starts
43	$css_generator->add_class_styles(
44	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-info-box-badge-link',
45	$this->get_badge_css( $attributes ),
46	$this->get_badge_css( $attributes, 'Tablet' ),
47	$this->get_badge_css( $attributes, 'Mobile' ),
48	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_badge_css( $attributes, $device ); } )
49	);
50	$css_generator->add_class_styles(
51	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-info-box-badge-link:hover',
52	$this->get_badge_hover_css( $attributes ),
53	$this->get_badge_hover_css( $attributes, 'Tablet' ),
54	$this->get_badge_hover_css( $attributes, 'Mobile' ),
55	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_badge_hover_css( $attributes, $device ); } )
56	);
57	$css_generator->add_class_styles(
58	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-info-box-badge-link > .ablocks-info-box-badge-link-text',
59	$this->get_badge_text_css( $attributes )
60	);
61
62	// Icon Style
63	$css_generator->add_class_styles(
64	'{{WRAPPER}}.ablocks-block--info-box .ablocks-block-container > .ablocks-icon-wrap, {{WRAPPER}}.ablocks-block--info-box .ablocks-block-container > a .ablocks-icon-wrap',
65	Icon::get_wrapper_css( $attributes ),
66	Icon::get_wrapper_css( $attributes, 'Tablet' ),
67	Icon::get_wrapper_css( $attributes, 'Mobile' ),
68	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_css( $attributes, $device ); } )
69	);
70	$css_generator->add_class_styles(
71	'{{WRAPPER}}.ablocks-block--info-box .ablocks-block-container > .ablocks-icon-wrap, {{WRAPPER}}.ablocks-block--info-box .ablocks-block-container > a .ablocks-icon-wrap',
72	$this->get_icon_wrapper_extra_css( $attributes ),
73	$this->get_icon_wrapper_extra_css( $attributes, 'Tablet' ),
74	$this->get_icon_wrapper_extra_css( $attributes, 'Mobile' ),
75	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_icon_wrapper_extra_css( $attributes, $device ); } )
76	);
77	$css_generator->add_class_styles(
78	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-icon-wrap > img.ablocks-image-icon, {{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > a .ablocks-icon-wrap > img.ablocks-image-icon',
79	Icon::get_element_image_css( $attributes ),
80	Icon::get_element_image_css( $attributes, 'Tablet' ),
81	Icon::get_element_image_css( $attributes, 'Mobile' ),
82	);
83	$css_generator->add_class_styles(
84	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > .ablocks-icon-wrap > img.ablocks-image-icon, {{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > a .ablocks-icon-wrap > img.ablocks-image-icon',
85	Icon::get_element_image_hover_css( $attributes ),
86	Icon::get_element_image_hover_css( $attributes, 'Tablet' ),
87	Icon::get_element_image_hover_css( $attributes, 'Mobile' ),
88	);
89	$css_generator->add_class_styles(
90	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-icon-wrap > svg.ablocks-svg-icon',
91	Icon::get_element_css( $attributes ),
92	Icon::get_element_css( $attributes, 'Tablet' ),
93	Icon::get_element_css( $attributes, 'Mobile' ),
94	);
95	$css_generator->add_class_styles(
96	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > .ablocks-icon-wrap > svg.ablocks-svg-icon',
97	Icon::get_element_image_hover_css( $attributes ),
98	Icon::get_element_image_hover_css( $attributes, 'Tablet' ),
99	Icon::get_element_image_hover_css( $attributes, 'Mobile' ),
100	);
101	$css_generator->add_class_styles(
102	'{{WRAPPER}}.ablocks-block--info-box:hover .ablocks-block-container > .ablocks-icon-wrap svg.ablocks-svg-icon , {{WRAPPER}}.ablocks-block--info-box:hover .ablocks-block-container > a .ablocks-icon-wrap svg.ablocks-svg-icon',
103	$this->get_icon_css_hover( $attributes ),
104	);
105	$css_generator->add_class_styles(
106	'{{WRAPPER}}.ablocks-block--info-box:hover .ablocks-block-container > .ablocks-icon-wrap , {{WRAPPER}}.ablocks-block--info-box:hover .ablocks-block-container > a .ablocks-icon-wrap',
107	$this->get_icon_css_background_hover( $attributes ),
108	);
109
110	// Heading starts
111	$desktop_heading_text_styles = $this->get_heading_text_css( $attributes );
112	if ( ! empty( $attributes['headingTextColor'] ) ) {
113	$desktop_heading_text_styles['color'] = $attributes['headingTextColor'];
114	}
115	$css_generator->add_class_styles(
116	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-heading',
117	$desktop_heading_text_styles,
118	$this->get_heading_text_css( $attributes, 'Tablet' ),
119	$this->get_heading_text_css( $attributes, 'Mobile' ),
120	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_heading_text_css( $attributes, $device ); } )
121	);
122	$css_generator->add_class_styles(
123	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-heading',
124	$this->get_heading_text_css_hover( $attributes ),
125	$this->get_heading_text_css_hover( $attributes, 'Tablet' ),
126	$this->get_heading_text_css_hover( $attributes, 'Mobile' ),
127	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_heading_text_css_hover( $attributes, $device ); } )
128	);
129
130	// Sub Heading starts
131	$desktop_sub_heading_text_styles = $this->get_sub_heading_text_css( $attributes );
132	if ( ! empty( $attributes['subHeadingTextColor'] ) ) {
133	$desktop_sub_heading_text_styles['color'] = $attributes['subHeadingTextColor'];
134	}
135	$css_generator->add_class_styles(
136	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-sub-heading',
137	$desktop_sub_heading_text_styles,
138	$this->get_sub_heading_text_css( $attributes, 'Tablet' ),
139	$this->get_sub_heading_text_css( $attributes, 'Mobile' ),
140	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_sub_heading_text_css( $attributes, $device ); } )
141	);
142	$css_generator->add_class_styles(
143	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-sub-heading',
144	$this->get_sub_heading_text_css_hover( $attributes ),
145	$this->get_sub_heading_text_css_hover( $attributes, 'Tablet' ),
146	$this->get_sub_heading_text_css_hover( $attributes, 'Mobile' ),
147	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_sub_heading_text_css_hover( $attributes, $device ); } )
148	);
149
150	// Description starts
151	$desktop_des_text_style = $this->get_des_text_css( $attributes );
152	if ( ! empty( $attributes['desTextColor'] ) ) {
153	$desktop_des_text_style['color'] = $attributes['desTextColor'];
154	}
155	$css_generator->add_class_styles(
156	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-text',
157	$desktop_des_text_style,
158	$this->get_des_text_css( $attributes, 'Tablet' ),
159	$this->get_des_text_css( $attributes, 'Mobile' ),
160	);
161	$css_generator->add_class_styles(
162	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-text',
163	$this->get_des_text_css_hover( $attributes ),
164	$this->get_des_text_css_hover( $attributes, 'Tablet' ),
165	$this->get_des_text_css_hover( $attributes, 'Mobile' ),
166	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_des_text_css_hover( $attributes, $device ); } )
167	);
168	$css_generator->add_class_styles(
169	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-text-drop-caps::first-letter',
170	$this->get_des_drop_text_css( $attributes ),
171	$this->get_des_drop_text_css( $attributes, 'Tablet' ),
172	$this->get_des_drop_text_css( $attributes, 'Mobile' ),
173	);
174
175	// rating icon css
176	$css_generator->add_class_styles(
177	'{{WRAPPER}} .ablocks-info-box-star-ratings',
178	$this->get_container_css( $attributes ),
179	$this->get_container_css( $attributes, 'Tablet' ),
180	$this->get_container_css( $attributes, 'Mobile' ),
181	);
182	$css_generator->add_class_styles(
183	'{{WRAPPER}} .ablocks-info-box-star-ratings',
184	$this->get_rating_css( $attributes ),
185	$this->get_rating_css( $attributes, 'Tablet' ),
186	$this->get_rating_css( $attributes, 'Mobile' ),
187	);
188	$css_generator->add_class_styles(
189	'{{WRAPPER}} .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__fill > .ablocks-icon-wrap, {{WRAPPER}} .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__unfill > .ablocks-icon-wrap',
190	Icon::get_wrapper_css( $attributes, '', 'starIcon' ),
191	Icon::get_wrapper_css( $attributes, 'Tablet', 'starIcon' ),
192	Icon::get_wrapper_css( $attributes, 'Mobile', 'starIcon' ),
193	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_css( $attributes, $device, 'starIcon' ); } )
194	);
195	// rating icon spacing css
196	$css_generator->add_class_styles(
197	'{{WRAPPER}} .ablocks-info-box-star-ratings-icons',
198	$this->get_rating_icon_spacing_css( $attributes ),
199	$this->get_rating_icon_spacing_css( $attributes, 'Tablet' ),
200	$this->get_rating_icon_spacing_css( $attributes, 'Mobile' ),
201	);
202	$css_generator->add_class_styles(
203	'{{WRAPPER}} .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__fill > .ablocks-icon-wrap > svg',
204	$this->get_fill_rating_css( $attributes ),
205	$this->get_fill_rating_css( $attributes, 'Tablet' ),
206	$this->get_fill_rating_css( $attributes, 'Mobile' ),
207	);
208	$css_generator->add_class_styles(
209	'{{WRAPPER}} .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__unfill > .ablocks-icon-wrap > svg',
210	$this->get_unfill_rating_css( $attributes ),
211	$this->get_unfill_rating_css( $attributes, 'Tablet' ),
212	$this->get_unfill_rating_css( $attributes, 'Mobile' ),
213	);
214	$css_generator->add_class_styles(
215	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-star-ratings > .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__fill > .ablocks-icon-wrap > svg',
216	$this->get_fill_rating_css_hover( $attributes ),
217	$this->get_fill_rating_css_hover( $attributes, 'Tablet' ),
218	$this->get_fill_rating_css_hover( $attributes, 'Mobile' ),
219	);
220	$css_generator->add_class_styles(
221	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-star-ratings > .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__unfill > .ablocks-icon-wrap > svg',
222	$this->get_unfill_rating_css_hover( $attributes ),
223	$this->get_unfill_rating_css_hover( $attributes, 'Tablet' ),
224	$this->get_unfill_rating_css_hover( $attributes, 'Mobile' ),
225	);
226	// rating number css
227	$css_generator->add_class_styles(
228	'{{WRAPPER}} .ablocks-info-box-star-rating-number',
229	$this->get_rating_number_css( $attributes ),
230	$this->get_rating_number_css( $attributes, 'Tablet' ),
231	$this->get_rating_number_css( $attributes, 'Mobile' ),
232	);
233
234	// Generate button CSS start
235	$css_generator->add_class_styles(
236	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-btn-link',
237	$this->get_button_css( $attributes ),
238	$this->get_button_css( $attributes, 'Tablet' ),
239	$this->get_button_css( $attributes, 'Mobile' ),
240	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_button_css( $attributes, $device ); } )
241	);
242	// Generate button CSS end
243	// Generate button hover CSS start
244	$css_generator->add_class_styles(
245	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-btn-link:hover',
246	$this->get_button_hover_css( $attributes ),
247	$this->get_button_hover_css( $attributes, 'Tablet' ),
248	$this->get_button_hover_css( $attributes, 'Mobile' ),
249	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_button_hover_css( $attributes, $device ); } )
250	);
251	// Generate button icon hover CSS
252	$css_generator->add_class_styles(
253	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-btn-link:hover > .ablocks-icon-wrap > svg.ablocks-svg-icon',
254	$this->get_button_icon_hover_css( $attributes ),
255	$this->get_button_icon_hover_css( $attributes, 'Tablet' ),
256	$this->get_button_icon_hover_css( $attributes, 'Mobile' ),
257	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_button_icon_hover_css( $attributes, $device ); } )
258	);
259	// Generate button text CSS start
260	$css_generator->add_class_styles(
261	'{{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container > .ablocks-block--info-box__content > .ablocks-info-box-btn-link > .ablocks-info-box-btn-link-text',
262	$this->get_button_text_css( $attributes )
263	);
264	// Generate button icon CSS start
265	$css_generator->add_class_styles(
266	'{{WRAPPER}} .ablocks-info-box-btn-link > .ablocks-icon-wrap',
267	Icon::get_wrapper_css( $attributes, '', 'btnIcon' ),
268	Icon::get_wrapper_css( $attributes, 'Tablet', 'btnIcon' ),
269	Icon::get_wrapper_css( $attributes, 'Mobile', 'btnIcon' ),
270	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_css( $attributes, $device, 'btnIcon' ); } )
271	);
272	$css_generator->add_class_styles(
273	'{{WRAPPER}} .ablocks-info-box-btn-link > .ablocks-icon-wrap > svg.ablocks-svg-icon',
274	Icon::get_element_css( $attributes, '', 'btnIcon' ),
275	Icon::get_element_css( $attributes, 'Tablet', 'btnIcon' ),
276	Icon::get_element_css( $attributes, 'Mobile', 'btnIcon' ),
277	);
278	$css_generator->add_class_styles(
279	'{{WRAPPER}} .ablocks-info-box-btn-link > .ablocks-icon-wrap > svg.ablocks-svg-icon:hover',
280	Icon::get_element_image_hover_css( $attributes, '', 'btnIcon' ),
281	Icon::get_element_image_hover_css( $attributes, 'Tablet', 'btnIcon' ),
282	Icon::get_element_image_hover_css( $attributes, 'Mobile', 'btnIcon' ),
283	);
284	$css_generator->add_class_styles(
285	'{{WRAPPER}} .ablocks-info-box-btn-link > .ablocks-icon-wrap:hover',
286	Icon::get_wrapper_hover_css( $attributes, '', 'btnIcon' ),
287	Icon::get_wrapper_hover_css( $attributes, 'Tablet', 'btnIcon' ),
288	Icon::get_wrapper_hover_css( $attributes, 'Mobile', 'btnIcon' ),
289	);
290	// Specificity override: the flex rule above has (0,2,0); the global hide rule also has (0,2,0) but
291	// comes earlier in the CSS output, so flex wins due to source order. This override uses
292	// {{WRAPPER}}:not(.ablocks-has-block-container).ablocks-hide-on-* → (0,3,0), placed last,
293	// so display:none always beats display:flex regardless of order. Restore uses flex (not block)
294	// so the Info Box layout stays intact when a device-hidden block becomes visible at a smaller breakpoint.
295	$css_generator->add_class_styles(
296	'{{WRAPPER}}:not(.ablocks-has-block-container).ablocks-hide-on-desktop,{{WRAPPER}}:not(.ablocks-has-block-container).ablocks-hide-on-tablet,{{WRAPPER}}:not(.ablocks-has-block-container).ablocks-hide-on-mobile',
297	! empty( $attributes['_hide_on_desktop'] ) ? [ 'display' => 'none' ] : [],
298	! empty( $attributes['_hide_on_tablet'] )
299	? [ 'display' => 'none' ]
300	: ( ! empty( $attributes['_hide_on_desktop'] ) ? [ 'display' => 'flex' ] : [] ),
301	! empty( $attributes['_hide_on_mobile'] )
302	? [ 'display' => 'none' ]
303	: ( ! empty( $attributes['_hide_on_tablet'] ) ? [ 'display' => 'flex' ] : [] )
304	);
305	return $css_generator->generate_css();
306	}
307	public function build_css_v2( $attributes ) {
308	$css_generator = new CssGeneratorV2( $attributes, $this->block_name );
309
310	$css_generator->add_class_styles(
311	'{{WRAPPER}}:not(.ablocks-has-block-container), {{WRAPPER}}.ablocks-block--info-box > .ablocks-block-container',
312	$this->get_info_box( $attributes ),
313	$this->get_info_box( $attributes, 'Tablet' ),
314	$this->get_info_box( $attributes, 'Mobile' ),
315	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_info_box( $attributes, $device ); } )
316	);
317	$css_generator->add_class_styles(
318	'{{WRAPPER}} .ablocks-block--info-box__content',
319	$this->get_info_box_content( $attributes ),
320	$this->get_info_box_content( $attributes, 'Tablet' ),
321	$this->get_info_box_content( $attributes, 'Mobile' ),
322	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_info_box_content( $attributes, $device ); } )
323	);
324
325	// badge starts
326	$css_generator->add_class_styles(
327	'{{WRAPPER}} .ablocks-info-box-badge-link',
328	$this->get_badge_css( $attributes ),
329	$this->get_badge_css( $attributes, 'Tablet' ),
330	$this->get_badge_css( $attributes, 'Mobile' ),
331	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_badge_css( $attributes, $device ); } )
332	);
333	$css_generator->add_class_styles(
334	'{{WRAPPER}} .ablocks-info-box-badge-link:hover',
335	$this->get_badge_hover_css( $attributes ),
336	$this->get_badge_hover_css( $attributes, 'Tablet' ),
337	$this->get_badge_hover_css( $attributes, 'Mobile' ),
338	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_badge_hover_css( $attributes, $device ); } )
339	);
340	$css_generator->add_class_styles(
341	'{{WRAPPER}} .ablocks-info-box-badge-link > .ablocks-info-box-badge-link-text',
342	$this->get_badge_text_css( $attributes )
343	);
344
345	// Icon Style
346	$css_generator->add_class_styles(
347	'{{WRAPPER}}:not(.ablocks-has-block-container) > .ablocks-icon-wrap,
348	{{WRAPPER}} > .ablocks-block-container > .ablocks-icon-wrap,
349	{{WRAPPER}}:not(.ablocks-has-block-container) > a .ablocks-icon-wrap,
350	{{WRAPPER}} > .ablocks-block-container > a .ablocks-icon-wrap',
351	Icon::get_wrapper_css( $attributes ),
352	Icon::get_wrapper_css( $attributes, 'Tablet' ),
353	Icon::get_wrapper_css( $attributes, 'Mobile' ),
354	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_css( $attributes, $device ); } )
355	);
356	// Icon Style
357	$css_generator->add_class_styles(
358	'{{WRAPPER}}:not(.ablocks-has-block-container) > .ablocks-icon-wrap:hover,
359	{{WRAPPER}} > .ablocks-block-container > .ablocks-icon-wrap:hover,
360	{{WRAPPER}}:not(.ablocks-has-block-container) > a .ablocks-icon-wrap:hover,
361	{{WRAPPER}} > .ablocks-block-container > a .ablocks-icon-wrap:hover',
362	Icon::get_wrapper_hover_css( $attributes ),
363	Icon::get_wrapper_hover_css( $attributes, 'Tablet' ),
364	Icon::get_wrapper_hover_css( $attributes, 'Mobile' ),
365	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_hover_css( $attributes, $device ); } )
366	);
367	$css_generator->add_class_styles(
368	'{{WRAPPER}}:not(.ablocks-has-block-container) > .ablocks-icon-wrap,
369	{{WRAPPER}} > .ablocks-block-container > .ablocks-icon-wrap,
370	{{WRAPPER}}:not(.ablocks-has-block-container) > a .ablocks-icon-wrap,
371	{{WRAPPER}} > .ablocks-block-container > a .ablocks-icon-wrap',
372	$this->get_icon_wrapper_extra_css( $attributes ),
373	$this->get_icon_wrapper_extra_css( $attributes, 'Tablet' ),
374	$this->get_icon_wrapper_extra_css( $attributes, 'Mobile' ),
375	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_icon_wrapper_extra_css( $attributes, $device ); } )
376	);
377	$css_generator->add_class_styles(
378	'{{WRAPPER}}:not(.ablocks-has-block-container) > .ablocks-icon-wrap > img.ablocks-image-icon, {{WRAPPER}} > .ablocks-block-container > .ablocks-icon-wrap > img.ablocks-image-icon, {{WRAPPER}} > a .ablocks-icon-wrap > img.ablocks-image-icon',
379	Icon::get_element_image_css( $attributes ),
380	Icon::get_element_image_css( $attributes, 'Tablet' ),
381	Icon::get_element_image_css( $attributes, 'Mobile' ),
382	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_element_image_css( $attributes, $device ); } )
383	);
384	$css_generator->add_class_styles(
385	'{{WRAPPER}}:not(.ablocks-has-block-container):hover > .ablocks-icon-wrap > img.ablocks-image-icon, {{WRAPPER}}:hover > .ablocks-block-container > .ablocks-icon-wrap > img.ablocks-image-icon , {{WRAPPER}}:hover > a .ablocks-icon-wrap > img.ablocks-image-icon',
386	Icon::get_element_image_hover_css( $attributes ),
387	Icon::get_element_image_hover_css( $attributes, 'Tablet' ),
388	Icon::get_element_image_hover_css( $attributes, 'Mobile' ),
389	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_element_image_hover_css( $attributes, $device ); } )
390	);
391	$css_generator->add_class_styles(
392	'{{WRAPPER}}:not(.ablocks-has-block-container) > .ablocks-icon-wrap > svg.ablocks-svg-icon, {{WRAPPER}} > .ablocks-block-container > .ablocks-icon-wrap > svg.ablocks-svg-icon',
393	Icon::get_element_css( $attributes ),
394	Icon::get_element_css( $attributes, 'Tablet' ),
395	Icon::get_element_css( $attributes, 'Mobile' ),
396	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_element_css( $attributes, $device ); } )
397	);
398	$css_generator->add_class_styles(
399	'{{WRAPPER}}:not(.ablocks-has-block-container):hover > .ablocks-icon-wrap > svg.ablocks-svg-icon, {{WRAPPER}} > .ablocks-block-container > .ablocks-icon-wrap > svg.ablocks-svg-icon',
400	Icon::get_element_image_hover_css( $attributes ),
401	Icon::get_element_image_hover_css( $attributes, 'Tablet' ),
402	Icon::get_element_image_hover_css( $attributes, 'Mobile' ),
403	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_element_image_hover_css( $attributes, $device ); } )
404	);
405	$css_generator->add_class_styles(
406	'{{WRAPPER}}:not(.ablocks-has-block-container).ablocks-block--info-box:hover > .ablocks-icon-wrap svg.ablocks-svg-icon ,
407	{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > .ablocks-icon-wrap svg.ablocks-svg-icon ,
408	{{WRAPPER}}:not(.ablocks-has-block-container).ablocks-block--info-box:hover > a .ablocks-icon-wrap svg.ablocks-svg-icon ,
409	{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > a .ablocks-icon-wrap svg.ablocks-svg-icon',
410	$this->get_icon_css_hover( $attributes ),
411	);
412	$css_generator->add_class_styles(
413	'{{WRAPPER}}:not(.ablocks-has-block-container).ablocks-block--info-box:hover > .ablocks-icon-wrap,
414	{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > .ablocks-icon-wrap,
415	{{WRAPPER}}:not(.ablocks-has-block-container).ablocks-block--info-box:hover > a .ablocks-icon-wrap,
416	{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block-container > a .ablocks-icon-wrap',
417	$this->get_icon_css_background_hover( $attributes ),
418	);
419
420	// Heading starts
421	$css_generator->add_class_styles(
422	'{{WRAPPER}} .ablocks-block--info-box__content > .ablocks-info-box-heading',
423	$this->get_heading_text_css( $attributes ),
424	$this->get_heading_text_css( $attributes, 'Tablet' ),
425	$this->get_heading_text_css( $attributes, 'Mobile' ),
426	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_heading_text_css( $attributes, $device ); } )
427	);
428	$css_generator->add_class_styles(
429	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block--info-box__content > .ablocks-info-box-heading',
430	$this->get_heading_text_css_hover( $attributes ),
431	$this->get_heading_text_css_hover( $attributes, 'Tablet' ),
432	$this->get_heading_text_css_hover( $attributes, 'Mobile' ),
433	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_heading_text_css_hover( $attributes, $device ); } )
434	);
435
436	// Sub Heading starts
437	$css_generator->add_class_styles(
438	'{{WRAPPER}} .ablocks-block--info-box__content > .ablocks-info-box-sub-heading',
439	$this->get_sub_heading_text_css( $attributes ),
440	$this->get_sub_heading_text_css( $attributes, 'Tablet' ),
441	$this->get_sub_heading_text_css( $attributes, 'Mobile' ),
442	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_sub_heading_text_css( $attributes, $device ); } )
443	);
444	$css_generator->add_class_styles(
445	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block--info-box__content > .ablocks-info-box-sub-heading',
446	$this->get_sub_heading_text_css_hover( $attributes ),
447	$this->get_sub_heading_text_css_hover( $attributes, 'Tablet' ),
448	$this->get_sub_heading_text_css_hover( $attributes, 'Mobile' ),
449	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_sub_heading_text_css_hover( $attributes, $device ); } )
450	);
451
452	// Description starts
453	$css_generator->add_class_styles(
454	'{{WRAPPER}} .ablocks-block--info-box__content > .ablocks-info-box-text',
455	$this->get_des_text_css( $attributes ),
456	$this->get_des_text_css( $attributes, 'Tablet' ),
457	$this->get_des_text_css( $attributes, 'Mobile' ),
458	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_des_text_css( $attributes, $device ); } )
459	);
460	$css_generator->add_class_styles(
461	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block--info-box__content > .ablocks-info-box-text',
462	$this->get_des_text_css_hover( $attributes ),
463	$this->get_des_text_css_hover( $attributes, 'Tablet' ),
464	$this->get_des_text_css_hover( $attributes, 'Mobile' ),
465	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_des_text_css_hover( $attributes, $device ); } )
466	);
467	$css_generator->add_class_styles(
468	'{{WRAPPER}} .ablocks-block--info-box__content > .ablocks-info-box-text-drop-caps::first-letter',
469	$this->get_des_drop_text_css( $attributes ),
470	$this->get_des_drop_text_css( $attributes, 'Tablet' ),
471	$this->get_des_drop_text_css( $attributes, 'Mobile' ),
472	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_des_drop_text_css( $attributes, $device ); } )
473	);
474
475	// rating icon css
476	$css_generator->add_class_styles(
477	'{{WRAPPER}} .ablocks-info-box-star-ratings',
478	$this->get_container_css( $attributes ),
479	$this->get_container_css( $attributes, 'Tablet' ),
480	$this->get_container_css( $attributes, 'Mobile' ),
481	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_container_css( $attributes, $device ); } )
482	);
483	$css_generator->add_class_styles(
484	'{{WRAPPER}} .ablocks-info-box-star-ratings',
485	$this->get_rating_css( $attributes ),
486	$this->get_rating_css( $attributes, 'Tablet' ),
487	$this->get_rating_css( $attributes, 'Mobile' ),
488	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_rating_css( $attributes, $device ); } )
489	);
490	$css_generator->add_class_styles(
491	'{{WRAPPER}} .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__fill > .ablocks-icon-wrap, {{WRAPPER}} .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__unfill > .ablocks-icon-wrap',
492	Icon::get_wrapper_css( $attributes, '', 'starIcon' ),
493	Icon::get_wrapper_css( $attributes, 'Tablet', 'starIcon' ),
494	Icon::get_wrapper_css( $attributes, 'Mobile', 'starIcon' ),
495	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_css( $attributes, $device, 'starIcon' ); } )
496	);
497	// rating icon spacing css
498	$css_generator->add_class_styles(
499	'{{WRAPPER}} .ablocks-info-box-star-ratings-icons',
500	$this->get_rating_icon_spacing_css( $attributes ),
501	$this->get_rating_icon_spacing_css( $attributes, 'Tablet' ),
502	$this->get_rating_icon_spacing_css( $attributes, 'Mobile' ),
503	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_rating_icon_spacing_css( $attributes, $device ); } )
504	);
505	$css_generator->add_class_styles(
506	'{{WRAPPER}} .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__fill > .ablocks-icon-wrap > svg',
507	$this->get_fill_rating_css( $attributes ),
508	$this->get_fill_rating_css( $attributes, 'Tablet' ),
509	$this->get_fill_rating_css( $attributes, 'Mobile' ),
510	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_fill_rating_css( $attributes, $device ); } )
511	);
512	$css_generator->add_class_styles(
513	'{{WRAPPER}} .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__unfill > .ablocks-icon-wrap > svg',
514	$this->get_unfill_rating_css( $attributes ),
515	$this->get_unfill_rating_css( $attributes, 'Tablet' ),
516	$this->get_unfill_rating_css( $attributes, 'Mobile' ),
517	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_unfill_rating_css( $attributes, $device ); } )
518	);
519	$css_generator->add_class_styles(
520	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block--info-box__content > .ablocks-info-box-star-ratings > .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__fill > .ablocks-icon-wrap > svg',
521	$this->get_fill_rating_css_hover( $attributes ),
522	$this->get_fill_rating_css_hover( $attributes, 'Tablet' ),
523	$this->get_fill_rating_css_hover( $attributes, 'Mobile' ),
524	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_fill_rating_css_hover( $attributes, $device ); } )
525	);
526	$css_generator->add_class_styles(
527	'{{WRAPPER}}.ablocks-block--info-box:hover > .ablocks-block--info-box__content > .ablocks-info-box-star-ratings > .ablocks-info-box-star-ratings-icons > .ablocks-info-box-rating > .ablocks-info-box-rating__unfill > .ablocks-icon-wrap > svg',
528	$this->get_unfill_rating_css_hover( $attributes ),
529	$this->get_unfill_rating_css_hover( $attributes, 'Tablet' ),
530	$this->get_unfill_rating_css_hover( $attributes, 'Mobile' ),
531	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_unfill_rating_css_hover( $attributes, $device ); } )
532	);
533	// rating number css
534	$css_generator->add_class_styles(
535	'{{WRAPPER}} .ablocks-info-box-star-rating-number',
536	$this->get_rating_number_css( $attributes ),
537	$this->get_rating_number_css( $attributes, 'Tablet' ),
538	$this->get_rating_number_css( $attributes, 'Mobile' ),
539	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_rating_number_css( $attributes, $device ); } )
540	);
541
542	// Generate button CSS start
543	$css_generator->add_class_styles(
544	'{{WRAPPER}} .ablocks-block--info-box__content > .ablocks-info-box-btn-link',
545	$this->get_button_css( $attributes ),
546	$this->get_button_css( $attributes, 'Tablet' ),
547	$this->get_button_css( $attributes, 'Mobile' ),
548	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_button_css( $attributes, $device ); } )
549	);
550	// Generate button CSS end
551	// Generate button hover CSS start
552	$css_generator->add_class_styles(
553	'{{WRAPPER}} .ablocks-block--info-box__content > .ablocks-info-box-btn-link:hover',
554	$this->get_button_hover_css( $attributes ),
555	$this->get_button_hover_css( $attributes, 'Tablet' ),
556	$this->get_button_hover_css( $attributes, 'Mobile' ),
557	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_button_hover_css( $attributes, $device ); } )
558	);
559	// Generate button icon hover CSS
560	$css_generator->add_class_styles(
561	'{{WRAPPER}} .ablocks-block--info-box__content > .ablocks-info-box-btn-link:hover > .ablocks-icon-wrap > svg.ablocks-svg-icon',
562	$this->get_button_icon_hover_css( $attributes ),
563	$this->get_button_icon_hover_css( $attributes, 'Tablet' ),
564	$this->get_button_icon_hover_css( $attributes, 'Mobile' ),
565	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_button_icon_hover_css( $attributes, $device ); } )
566	);
567	// Generate button text CSS start
568	$css_generator->add_class_styles(
569	'{{WRAPPER}} .ablocks-block--info-box__content > .ablocks-info-box-btn-link > .ablocks-info-box-btn-link-text',
570	$this->get_button_text_css( $attributes )
571	);
572	// Generate button icon CSS start
573	$css_generator->add_class_styles(
574	'{{WRAPPER}} .ablocks-info-box-btn-link > .ablocks-icon-wrap',
575	Icon::get_wrapper_css( $attributes, '', 'btnIcon' ),
576	Icon::get_wrapper_css( $attributes, 'Tablet', 'btnIcon' ),
577	Icon::get_wrapper_css( $attributes, 'Mobile', 'btnIcon' ),
578	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_css( $attributes, $device, 'btnIcon' ); } )
579	);
580	$css_generator->add_class_styles(
581	'{{WRAPPER}} .ablocks-info-box-btn-link > .ablocks-icon-wrap > svg.ablocks-svg-icon',
582	Icon::get_element_css( $attributes, '', 'btnIcon' ),
583	Icon::get_element_css( $attributes, 'Tablet', 'btnIcon' ),
584	Icon::get_element_css( $attributes, 'Mobile', 'btnIcon' ),
585	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_element_css( $attributes, $device, 'btnIcon' ); } )
586	);
587	$css_generator->add_class_styles(
588	'{{WRAPPER}} .ablocks-info-box-btn-link > .ablocks-icon-wrap > svg.ablocks-svg-icon:hover',
589	Icon::get_element_image_hover_css( $attributes, '', 'btnIcon' ),
590	Icon::get_element_image_hover_css( $attributes, 'Tablet', 'btnIcon' ),
591	Icon::get_element_image_hover_css( $attributes, 'Mobile', 'btnIcon' ),
592	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_element_image_hover_css( $attributes, $device, 'btnIcon' ); } )
593	);
594	$css_generator->add_class_styles(
595	'{{WRAPPER}} .ablocks-info-box-btn-link > .ablocks-icon-wrap:hover',
596	Icon::get_wrapper_hover_css( $attributes, '', 'btnIcon' ),
597	Icon::get_wrapper_hover_css( $attributes, 'Tablet', 'btnIcon' ),
598	Icon::get_wrapper_hover_css( $attributes, 'Mobile', 'btnIcon' ),
599	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_hover_css( $attributes, $device, 'btnIcon' ); } )
600	);
601	$css_generator->add_class_styles(
602	'{{WRAPPER}}:not(.ablocks-has-block-container).ablocks-hide-on-desktop,{{WRAPPER}}:not(.ablocks-has-block-container).ablocks-hide-on-tablet,{{WRAPPER}}:not(.ablocks-has-block-container).ablocks-hide-on-mobile',
603	! empty( $attributes['_hide_on_desktop'] ) ? [ 'display' => 'none' ] : [],
604	! empty( $attributes['_hide_on_tablet'] )
605	? [ 'display' => 'none' ]
606	: ( ! empty( $attributes['_hide_on_desktop'] ) ? [ 'display' => 'flex' ] : [] ),
607	! empty( $attributes['_hide_on_mobile'] )
608	? [ 'display' => 'none' ]
609	: ( ! empty( $attributes['_hide_on_tablet'] ) ? [ 'display' => 'flex' ] : [] )
610	);
611	return $css_generator->generate_css();
612	}
613	public function build_css( $attributes ) {
614	if ( isset( $attributes['blockVersion'] ) && (int) $attributes['blockVersion'] === 2 ) {
615	return $this->build_css_v2( $attributes );
616	}
617	return $this->build_css_v1( $attributes );
618	}
619
620	public function get_info_box( $attributes, $device = '' ) {
621	$css = [];
622
623	// Temporary approch instead of attribute migration. Might remove it in future
624	$iconPlacement = isset( $attributes['iconPlacement'][ 'value' . $device ] ) ? $attributes['iconPlacement'][ 'value' . $device ] : '';
625	if ( ! isset( $attributes['iconPlacement'] )
626	\|\| (
627	$attributes['stack'] !== ''
628	&& $iconPlacement !== $attributes['stack']
629	)
630	) {
631	$attributes['iconPlacement'][ 'value' . $device ] = $attributes['stack'];
632	$attributes['stack'] = '';
633	}
634	// Temporary approch instead of attribute migration. Might remove it in future
635
636	if ( isset( $attributes['iconPlacement'][ 'value' . $device ] ) ) {
637	$css['display'] = 'flex';
638	$css['flex-direction'] = $attributes['iconPlacement'][ 'value' . $device ];
639	}
640
641	if ( isset( $attributes['iconAlignment'][ 'value' . $device ] ) ) {
642	$css['align-items'] = $attributes['iconAlignment'][ 'value' . $device ];
643	}
644
645	return array_merge(
646	Range::get_css([
647	'attributeValue' => $attributes['iconGap'],
648	'attribute_object_key' => 'value',
649	'isResponsive' => true,
650	'defaultValue' => 16,
651	'hasUnit' => true,
652	'unitDefaultValue' => 'px',
653	'property' => 'gap',
654	'device' => $device,
655	]),
656	$css,
657	);
658	}
659
660	public function get_badge_css( $attributes, $device = '' ) {
661	$css = [];
662
663	if ( ! empty( $attributes['badgePosition'][ 'value' . $device ] ) ) {
664	$position = $attributes['badgePosition'][ 'value' . $device ];
665	if ( $position === 'top-left' ) {
666	$css['top'] = '0';
667	$css['left'] = '0';
668	$css['bottom'] = 'auto';
669	$css['right'] = 'auto';
670	} elseif ( $position === 'top-right' ) {
671	$css['top'] = '0';
672	$css['right'] = '0';
673	$css['bottom'] = 'auto';
674	$css['left'] = 'auto';
675	} elseif ( $position === 'bottom-left' ) {
676	$css['bottom'] = '0';
677	$css['left'] = '0';
678	$css['top'] = 'auto';
679	$css['right'] = 'auto';
680	} elseif ( $position === 'bottom-right' ) {
681	$css['bottom'] = '0';
682	$css['right'] = '0';
683	$css['top'] = 'auto';
684	$css['left'] = 'auto';
685	}//end if
686	}//end if
687
688	if ( ! empty( $attributes['badgeBackground'] ) ) {
689	$css['background'] = Color::get_css(
690	isset( $attributes['badgeBackground'] ) ? $attributes['badgeBackground'] : '');
691
692	} elseif ( ! empty( $attributes['badgeType'] ) ) {
693	$css['background'] = $attributes['badgeType'];
694	}
695	$typographyGlobal = ! empty( $attributes['badgeTypographyGlobal'] ) ? $attributes['badgeTypographyGlobal'] : array();
696
697	return array_merge(
698	[ 'color' => Color::get_css( isset( $attributes['badgeTextColorH'] ) ? $attributes['badgeTextColor'] : '' ) ],
699	Range::get_css([
700	'attributeValue' => $attributes['badgeTransition'],
701	'attribute_object_key' => 'value',
702	'defaultValue' => 0,
703	'unitDefaultValue' => 's',
704	'property' => 'transition-duration',
705	'device' => $device,
706	]),
707	$css,
708	Border::get_css( $attributes['badgeBorder'], '', $device ),
709	Typography::get_css( $attributes['badgeTypography'], '', $device, $typographyGlobal ),
710	Dimensions::get_css( $attributes['badgePadding'], 'padding', $device ),
711	);
712	}
713	public function get_badge_hover_css( $attributes, $device = '' ) {
714	$css = [];
715	return array_merge(
716	$css,
717	[ 'color' => Color::get_css( isset( $attributes['badgeTextColorH'] ) ? $attributes['badgeTextColorH'] : '' ) ],
718	[ 'background' => Color::get_css( isset( $attributes['badgeBackgroundH'] ) ? $attributes['badgeBackgroundH'] : '' ) ],
719	Border::get_css( $attributes['badgeBorder'], '', $device ),
720	);
721	}
722	public function get_badge_text_css( $attributes, $device = '' ) {
723	return TextShadow::get_css( $attributes['badgeTextShadow'] );
724	}
725
726	public function get_icon_wrapper_extra_css( $attributes, $device = '' ) {
727	$css = [];
728
729	return array_merge(
730	$css,
731	Dimensions::get_css( $attributes['iconMargin'], 'margin', $device ),
732	);
733	}
734
735	public function get_icon_css_hover( $attributes, $device = '' ) {
736	$css = [];
737
738	return array_merge(
739	[ 'fill' => Color::get_css( isset( $attributes['iconPrimaryColorH'] ) ? $attributes['iconPrimaryColorH'] : '' ) ],
740	Range::get_css([
741	'attributeValue' => $attributes['iconTransition'],
742	'attribute_object_key' => 'value',
743	'defaultValue' => 0,
744	'unitDefaultValue' => 's',
745	'property' => 'transition-duration',
746	'device' => $device,
747	]),
748	$css
749	);
750	}
751	public function get_icon_css_background_hover( $attributes, $device = '' ) {
752	$css = [];
753	if ( ! empty( $attributes['iconBackgroundColorH'] ) ) {
754	$css['background'] = $attributes['iconBackgroundColorH'];
755	}
756	return array_merge(
757	Range::get_css([
758	'attributeValue' => $attributes['iconTransition'],
759	'attribute_object_key' => 'value',
760	'defaultValue' => 0,
761	'unitDefaultValue' => 's',
762	'property' => 'transition-duration',
763	'device' => $device,
764	]),
765	$css
766	);
767	}
768
769	public function get_info_box_content( $attributes, $device = '' ) {
770	$css = [];
771
772	if ( isset( $attributes['alignment'][ 'value' . $device ] ) ) {
773	$css['align-items'] = $attributes['alignment'][ 'value' . $device ];
774	}
775
776	return array_merge(
777	Range::get_css([
778	'attributeValue' => $attributes['contentGap'],
779	'attribute_object_key' => 'value',
780	'isResponsive' => true,
781	'defaultValue' => 10,
782	'hasUnit' => true,
783	'unitDefaultValue' => 'px',
784	'property' => 'gap',
785	'device' => $device,
786	]),
787	$css,
788	);
789	}
790
791	public function get_heading_text_css( $attributes, $device = '' ) {
792	$typographyGlobal = ! empty( $attributes['headingTypographyGlobal'] ) ? $attributes['headingTypographyGlobal'] : array();
793	$typography_css = ! empty( $attributes['headingTypography'] ) ? Typography::get_css( $attributes['headingTypography'], '', $device, $typographyGlobal ) : array();
794	$textShadowCss = ! empty( $attributes['headingTextShadow'] ) ? TextShadow::get_css( $attributes['headingTextShadow'], '', $device ) : array();
795	$textStrokeCss = ! empty( $attributes['headingTextStroke'] ) ? TextStroke::get_css( $attributes['headingTextStroke'], '', $device ) : array();
796
797	$css = [];
798
799	if ( ! empty( $attributes['alignment'][ 'value' . $device ] ) ) {
800	if ( $attributes['alignment'][ 'value' . $device ] === 'flex-start' ) {
801	$css['text-align'] = 'left';
802	} elseif ( $attributes['alignment'][ 'value' . $device ] === 'flex-end' ) {
803	$css['text-align'] = 'right';
804	} else {
805	$css['text-align'] = $attributes['alignment'][ 'value' . $device ];
806	}
807	}
808
809	return array_merge(
810	$css,
811	$typography_css,
812	$textShadowCss,
813	$textStrokeCss,
814	[ 'color' => Color::get_css( isset( $attributes['headingTextColor'] ) ? $attributes['headingTextColor'] : '' ) ],
815	Dimensions::get_css( $attributes['headingMargin'], 'margin', $device ),
816	);
817	}
818	public function get_heading_text_css_hover( $attributes, $device = '' ) {
819	$css = [];
820	if ( ! empty( $attributes['headingTransition'] ) ) {
821	$css['transition-duration'] = $attributes['headingTransition'] . 's';
822	}
823
824	return array_merge(
825	[ 'color' => Color::get_css( isset( $attributes['headingTextColorHover'] ) ? $attributes['headingTextColorHover'] : '' ) ],
826	Range::get_css([
827	'attributeValue' => $attributes['headingTransition'],
828	'attribute_object_key' => 'value',
829	'defaultValue' => 0,
830	'unitDefaultValue' => 's',
831	'property' => 'transition-duration',
832	'device' => $device,
833	]),
834	$css
835	);
836	}
837
838
839	public function get_sub_heading_text_css( $attributes, $device = '' ) {
840	$typographyGlobal = ! empty( $attributes['subHeadingTypographyGlobal'] ) ? $attributes['subHeadingTypographyGlobal'] : array();
841	$typography_css = ! empty( $attributes['subHeadingTypography'] ) ? Typography::get_css( $attributes['subHeadingTypography'], '', $device, $typographyGlobal ) : array();
842	$textShadowCss = ! empty( $attributes['subHeadingTextShadow'] ) ? TextShadow::get_css( $attributes['subHeadingTextShadow'], '', $device ) : array();
843	$textStrokeCss = ! empty( $attributes['subHeadingTextStroke'] ) ? TextStroke::get_css( $attributes['subHeadingTextStroke'], '', $device ) : array();
844
845	$css = [];
846
847	if ( ! empty( $attributes['alignment'][ 'value' . $device ] ) ) {
848	if ( $attributes['alignment'][ 'value' . $device ] === 'flex-start' ) {
849	$css['text-align'] = 'left';
850	} elseif ( $attributes['alignment'][ 'value' . $device ] === 'flex-end' ) {
851	$css['text-align'] = 'right';
852	} else {
853	$css['text-align'] = $attributes['alignment'][ 'value' . $device ];
854	}
855	}
856
857	return array_merge(
858	$css,
859	$typography_css,
860	$textShadowCss,
861	$textStrokeCss,
862	[ 'color' => Color::get_css( isset( $attributes['subHeadingTextColor'] ) ? $attributes['subHeadingTextColor'] : '' ) ],
863	Dimensions::get_css( $attributes['subHeadingMargin'], 'margin', $device ),
864	);
865	}
866	public function get_sub_heading_text_css_hover( $attributes, $device = '' ) {
867	$css = [];
868	return array_merge(
869	[ 'color' => Color::get_css( isset( $attributes['subHeadingTextColorHover'] ) ? $attributes['subHeadingTextColorHover'] : '' ) ],
870	Range::get_css([
871	'attributeValue' => $attributes['subHeadingTransition'],
872	'attribute_object_key' => 'value',
873	'defaultValue' => 0,
874	'unitDefaultValue' => 's',
875	'property' => 'transition-duration',
876	'device' => $device,
877	]),
878	$css
879	);
880	}
881
882	public function get_des_text_css( $attributes, $device = '' ) {
883	$css = [];
884
885	if ( ! empty( $attributes['alignment'][ 'value' . $device ] ) ) {
886	if ( $attributes['alignment'][ 'value' . $device ] === 'flex-start' ) {
887	$css['text-align'] = 'left';
888	} elseif ( $attributes['alignment'][ 'value' . $device ] === 'flex-end' ) {
889	$css['text-align'] = 'right';
890	} else {
891	$css['text-align'] = $attributes['alignment'][ 'value' . $device ];
892	}
893	}
894	$typographyGlobal = ! empty( $attributes['desTypographyGlobal'] ) ? $attributes['desTypographyGlobal'] : array();
895	return array_merge(
896	$css,
897	[ 'color' => Color::get_css( isset( $attributes['desTextColor'] ) ? $attributes['desTextColor'] : '' ) ],
898	isset( $attributes['desTypography'] ) ? Typography::get_css( $attributes['desTypography'], '', $device, $typographyGlobal ) : [],
899	isset( $attributes['desTextStroke'] ) ? TextStroke::get_css( $attributes['desTextStroke'], '', $device ) : [],
900	isset( $attributes['desTextShadow'] ) ? TextShadow::get_css( $attributes['desTextShadow'], '', $device ) : [],
901	Dimensions::get_css( $attributes['desMargin'], 'margin', $device ),
902	);
903	}
904	public function get_des_text_css_hover( $attributes, $device = '' ) {
905	$css = [];
906	return array_merge(
907	[ 'color' => Color::get_css( isset( $attributes['desTextColorHover'] ) ? $attributes['desTextColorHover'] : '' ) ],
908	Range::get_css([
909	'attributeValue' => $attributes['desTransition'],
910	'attribute_object_key' => 'value',
911	'defaultValue' => 0,
912	'unitDefaultValue' => 's',
913	'property' => 'transition-duration',
914	'device' => $device,
915	]),
916	$css
917	);
918	}
919	public function get_des_drop_text_css( $attributes, $device = '' ) {
920	$css = [];
921	if ( ! empty( $attributes['desDropCapsTextColor'] ) ) {
922	$css['color'] = Color::get_css(
923	isset( $attributes['desDropCapsTextColor'] ) ? $attributes['desDropCapsTextColor'] : '');
924	}
925	return $css;
926	}
927
928	public function get_container_css( $attributes, $device = '' ) {
929	$css = [];
930
931	return array_merge(
932	Range::get_css([
933	'attributeValue' => $attributes['ratingNumberGap'],
934	'attribute_object_key' => 'value',
935	'isResponsive' => true,
936	'defaultValue' => 0,
937	'hasUnit' => true,
938	'unitDefaultValue' => 'px',
939	'property' => 'gap',
940	'device' => $device,
941	]),
942	$css,
943	isset( $attributes['alignment'] ) ? Alignment::get_css( $attributes['alignment'], 'justify-content', $device ) : [],
944	);
945	}
946	public function get_rating_number_css( $attributes, $device = '' ) {
947	$css = [];
948	if ( ! empty( $attributes['ratingNumberColor'] ) ) {
949	$css['color'] = Color::get_css(
950	isset( $attributes['ratingNumberColor'] ) ? $attributes['ratingNumberColor'] : '');
951
952	}
953	if ( ! empty( $attributes['ratingNumberPosition'] ) ) {
954	if ( 'left' === $attributes['ratingNumberPosition'] ) {
955	$css['order'] = '-5';
956	} else {
957	$css['order'] = '10';
958	}
959	}
960	$typographyGlobal = ! empty( $attributes['ratingNumberTypographyGlobal'] ) ? $attributes['ratingNumberTypographyGlobal'] : array();
961	return array_merge(
962	$css,
963	isset( $attributes['ratingNumberTypography'] ) ? Typography::get_css( $attributes['ratingNumberTypography'], '', $device, $typographyGlobal ) : [],
964	);
965	}
966	public function get_rating_css( $attributes, $device = '' ) {
967	$rating_css = [];
968	return array_merge(
969	$rating_css,
970	Dimensions::get_css( $attributes['ratingMargin'], 'margin', $device ),
971	);
972	}
973
974
975	public function get_rating_icon_spacing_css( $attributes, $device = '' ) {
976	$rating_icon_spacing_css = [];
977
978	return array_merge(
979	Range::get_css([
980	'attributeValue' => $attributes['spacing'],
981	'attribute_object_key' => 'value',
982	'isResponsive' => true,
983	'defaultValue' => 0,
984	'hasUnit' => true,
985	'unitDefaultValue' => 'px',
986	'property' => 'gap',
987	'device' => $device,
988	]),
989	$rating_icon_spacing_css
990	);
991	}
992
993	public function get_fill_rating_css( $attributes, $device = '' ) {
994	$css = [];
995	return array_merge(
996	[ 'fill' => Color::get_css( isset( $attributes['ratingColor'] ) ? $attributes['ratingColor'] : '' ) ],
997	Range::get_css([
998	'attributeValue' => $attributes['ratingTransition'],
999	'attribute_object_key' => 'value',
1000	'defaultValue' => 0,
1001	'unitDefaultValue' => 's',
1002	'property' => 'transition-duration',
1003	'device' => $device,
1004	]),
1005	$css
1006	);
1007	}
1008	public function get_unfill_rating_css( $attributes, $device = '' ) {
1009	$css = [];
1010	if ( ! empty( $attributes['ratingColor'] ) ) {
1011	$css['fill'] = Color::get_css(
1012	isset( $attributes['ratingUnmarkedColor'] ) ? $attributes['ratingUnmarkedColor'] : '');
1013	}
1014	return array_merge(
1015	Range::get_css([
1016	'attributeValue' => $attributes['ratingTransition'],
1017	'attribute_object_key' => 'value',
1018	'defaultValue' => 0,
1019	'unitDefaultValue' => 's',
1020	'property' => 'transition-duration',
1021	'device' => $device,
1022	]),
1023	$css
1024	);
1025	}
1026	public function get_fill_rating_css_hover( $attributes, $device = '' ) {
1027	$css = [];
1028	return array_merge(
1029	[ 'fill' => Color::get_css( isset( $attributes['ratingColorHover'] ) ? $attributes['ratingColorHover'] : '' ) ],
1030	Range::get_css([
1031	'attributeValue' => $attributes['ratingTransition'],
1032	'attribute_object_key' => 'value',
1033	'defaultValue' => 0,
1034	'unitDefaultValue' => 's',
1035	'property' => 'transition-duration',
1036	'device' => $device,
1037	]),
1038	$css
1039	);
1040	}
1041	public function get_unfill_rating_css_hover( $attributes, $device = '' ) {
1042	$css = [];
1043	if ( ! empty( $attributes['ratingColorHover'] ) ) {
1044	$css['fill'] = Color::get_css(
1045	isset( $attributes['ratingUnmarkedColorHover'] ) ? $attributes['ratingUnmarkedColorHover'] : '');
1046	}
1047	return array_merge(
1048	Range::get_css([
1049	'attributeValue' => $attributes['ratingTransition'],
1050	'attribute_object_key' => 'value',
1051	'defaultValue' => 0,
1052	'unitDefaultValue' => 's',
1053	'property' => 'transition-duration',
1054	'device' => $device,
1055	]),
1056	$css
1057	);
1058	}
1059
1060	public function get_button_css( $attributes, $device = '' ) {
1061	$css = [];
1062
1063	if ( ! empty( $attributes['btnBackground'] ) ) {
1064	$css['background'] = Color::get_css(
1065	isset( $attributes['btnBackground'] ) ? $attributes['btnBackground'] : '');
1066	} else {
1067	$css['background'] = $attributes['btnType'];
1068	}
1069
1070	if ( isset( $attributes['btnAlignment'][ 'value' . $device ] ) ) {
1071	$css['justify-content'] = $attributes['btnAlignment'][ 'value' . $device ];
1072	}
1073	$typographyGlobal = ! empty( $attributes['btnTypographyGlobal'] ) ? $attributes['btnTypographyGlobal'] : array();
1074
1075	return array_merge(
1076	Range::get_css([
1077	'attributeValue' => $attributes['btnIconSpace'],
1078	'attribute_object_key' => 'value',
1079	'defaultValue' => 10,
1080	'property' => 'column-gap',
1081	'device' => $device,
1082	]),
1083	Range::get_css([
1084	'attributeValue' => $attributes['btnTransition'],
1085	'attribute_object_key' => 'value',
1086	'defaultValue' => 0,
1087	'unitDefaultValue' => 's',
1088	'property' => 'transition-duration',
1089	'device' => $device,
1090	]),
1091	$css,
1092	[ 'color' => Color::get_css( isset( $attributes['btnTextColor'] ) ? $attributes['btnTextColor'] : '' ) ],
1093	Border::get_css( $attributes['btnBorder'], '', $device ),
1094	Typography::get_css( $attributes['btnTypography'], '', $device, $typographyGlobal ),
1095	Dimensions::get_css( $attributes['btnPadding'], 'padding', $device ),
1096	Dimensions::get_css( $attributes['btnMargin'], 'margin', $device ),
1097	);
1098	}
1099	public function get_button_hover_css( $attributes, $device = '' ) {
1100	$css = [];
1101	return array_merge(
1102	$css,
1103	[ 'color' => Color::get_css( isset( $attributes['btnTextColorH'] ) ? $attributes['btnTextColorH'] : '' ) ],
1104	[ 'background' => Color::get_css( isset( $attributes['btnBackgroundH'] ) ? $attributes['btnBackgroundH'] : '' ) ],
1105	Border::get_hover_css( $attributes['btnBorder'], '', $device )
1106	);
1107	}
1108	public function get_button_text_css( $attributes, $device = '' ) {
1109	return TextShadow::get_css( $attributes['btnTextShadow'] );
1110	}
1111	public function get_button_icon_hover_css( $attributes, $device = '' ) {
1112	return [ 'fill' => Color::get_css( isset( $attributes['btnTextColorH'] ) ? $attributes['btnTextColorH'] : '' ) ];
1113	}
1114	}
1115