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

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

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