← All changes | includes/blocks/advance-list-item/block.php +88 -32 2.9.1 → 2.14.0 View file →

		@@ -1,7 +1,11 @@
1	1	<?php
2	2	namespace ABlocks\Blocks\AdvanceListItem;
3	3
	4	+if ( ! defined( 'ABSPATH' ) ) {
	5	+ exit;
	6	+}
	7	+
4	8	use ABlocks\Classes\BlockBaseAbstract;
5	9	use ABlocks\Classes\CssGenerator;
6	10	use ABlocks\Controls\Alignment;
7	11	use ABlocks\Controls\Dimensions;
		@@ -11,8 +15,9 @@
11	15	use ABlocks\Controls\Width;
12	16	use ABlocks\Controls\Border;
13	17	use ABlocks\Controls\Icon;
14	18	use ABlocks\Controls\Range;
	19	+use ABlocks\Controls\Color;
15	20
16	21	class Block extends BlockBaseAbstract {
17	22
18	23	protected $parent_block_name = 'advance-lists';
		@@ -22,9 +27,9 @@
22	27	// Generate CSS
23	28	$css_generator = new CssGenerator( $attributes );
24	29
25	30	$css_generator->add_class_styles(
26		- '{{WRAPPER}}.ablocks-block--advance-list-item .ablocks-block-container',
	31	+ '{{WRAPPER}}.ablocks-block--advance-list-item .ablocks-block-container .ablocks-advance-list-item-link',
27	32	$this->get_container_css( $attributes, '' ),
28	33	$this->get_container_css( $attributes, 'Tablet' ),
29	34	$this->get_container_css( $attributes, 'Mobile' ),
30	35	);
		@@ -34,16 +39,30 @@
34	39	$this->get_marker_css( $attributes, '' ),
35	40	$this->get_marker_css( $attributes, 'Tablet' ),
36	41	$this->get_marker_css( $attributes, 'Mobile' ),
37	42	);
	43	+ $css_generator->add_class_styles(
	44	+ '{{WRAPPER}}.ablocks-block--advance-list-item .advance-list-item-marker,{{WRAPPER}}.ablocks-block--advance-list-item .ablocks-icon-wrap',
	45	+ $this->get_icon_order_css( $attributes, '' ),
	46	+ $this->get_icon_order_css( $attributes, 'Tablet' ),
	47	+ $this->get_icon_order_css( $attributes, 'Mobile' ),
	48	+ );
38	49	// Icon Style
39	50	$css_generator->add_class_styles(
40	51	'{{WRAPPER}} .ablocks-icon-wrap',
41	52	Icon::get_wrapper_css( $attributes ),
42	53	Icon::get_wrapper_css( $attributes, 'Tablet' ),
43		- Icon::get_wrapper_css( $attributes, 'Mobile' )
	54	+ Icon::get_wrapper_css( $attributes, 'Mobile' ),
	55	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_css( $attributes, $device ); } )
44	56	);
45	57	$css_generator->add_class_styles(
	58	+ '{{WRAPPER}} .ablocks-icon-wrap:hover',
	59	+ Icon::get_wrapper_hover_css( $attributes ),
	60	+ Icon::get_wrapper_hover_css( $attributes, 'Tablet' ),
	61	+ Icon::get_wrapper_hover_css( $attributes, 'Mobile' ),
	62	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_hover_css( $attributes, $device ); } )
	63	+ );
	64	+ $css_generator->add_class_styles(
46	65	'{{WRAPPER}} .ablocks-icon-wrap img.ablocks-image-icon',
47	66	Icon::get_element_image_css( $attributes ),
48	67	Icon::get_element_image_css( $attributes, 'Tablet' ),
49	68	Icon::get_element_image_css( $attributes, 'Mobile' ),
		@@ -55,15 +74,12 @@
55	74	Icon::get_element_css( $attributes, 'Mobile' ),
56	75	);
57	76
58	77	// text
59		- $desktop_paragraph_text_style = $this->get_paragraph_text_css( $attributes );
60		- if ( ! empty( $attributes['textColor'] ) ) {
61		- $desktop_paragraph_text_style['color'] = $attributes['textColor'];
62		- }
63	78	$css_generator->add_class_styles(
64		- '{{WRAPPER}} .ablocks-block-container .ablocks-advance-list-item-text',
65		- $desktop_paragraph_text_style,
	79	+ '{{WRAPPER}} .ablocks-block-container .ablocks-advance-list-item-text,
	80	+ {{WRAPPER}} .ablocks-block-container .ablocks-advance-list-item-text a',
	81	+ $this->get_paragraph_text_css( $attributes ),
66	82	$this->get_paragraph_text_css( $attributes, 'Tablet' ),
67	83	$this->get_paragraph_text_css( $attributes, 'Mobile' ),
68	84	);
69	85	$css_generator->add_class_styles(
		@@ -88,9 +104,9 @@
88	104	public function get_marker_css( $attributes, $device = '' ) {
89	105	$css = [];
90	106
91	107	if ( ! empty( $attributes['shapeColor'] ) && $attributes['markerType'] === 'Shapes' ) {
92		- $css['border-color'] = $attributes['shapeColor'] . ' !important';
	108	+ $css['border-color'] = Color::get_css( isset( $attributes['shapeColor'] ) ? $attributes['shapeColor'] : '' ) . '!important';
93	109	}
94	110	if ( ! empty( $attributes['shapeSize'][ 'value' . $device ] ) ) {
95	111	$shapeSize = $attributes['shapeSize'][ 'value' . $device ] . 'px';
96	112
		@@ -109,26 +125,39 @@
109	125	}
110	126
111	127	public function get_container_css( $attributes, $device = '' ) {
112	128	$css = [];
113		- if ( ! empty( $attributes['alignment'][ 'value' . $device ] ) && $attributes['alignment'][ 'value' . $device ] === 'flex-start' ) {
114		- if ( ! empty( $attributes['iconAlignment'][ 'value' . $device ] ) && $attributes['iconAlignment'][ 'value' . $device ] ) {
115		- $css['justify-content'] = 'flex-start';
116		- } else {
117		- $css['justify-content'] = 'flex-end';
118		- };
119		- } elseif ( ! empty( $attributes['alignment'][ 'value' . $device ] ) && $attributes['alignment'][ 'value' . $device ] === 'flex-end' ) {
120		- if ( ! empty( $attributes['iconAlignment'][ 'value' . $device ] ) && $attributes['iconAlignment'][ 'value' . $device ] === 'row' ) {
121		- $css['justify-content'] = 'flex-end';
122		- } else {
123		- $css['justify-content'] = 'flex-start';
124		- };
125		- } else {
126		- $css['justify-content'] = 'center';
	129	+ return array_merge(
	130	+ $css,
	131	+ isset( $attributes['alignment'] ) ? Alignment::get_css( $attributes['alignment'], 'justify-items', $device ) : [],
	132	+ Range::get_css([
	133	+ 'attributeValue' => $attributes['innerGap'],
	134	+ 'attribute_object_key' => 'value',
	135	+ 'isResponsive' => true,
	136	+ 'defaultValue' => null,
	137	+ 'hasUnit' => true,
	138	+ 'unitDefaultValue' => 'px',
	139	+ 'property' => 'gap',
	140	+ 'device' => $device,
	141	+ ]),
	142	+ );
	143	+ }
	144	+
	145	+ public function get_icon_order_css( $attributes, $device = '' ) {
	146	+ $css = [];
	147	+
	148	+ $css['margin'] = 'auto';
	149	+
	150	+ $iconAlignmentValue = $this->get_responsive_attribute_value( $attributes['iconAlignment'], $device );
	151	+ if ( $iconAlignmentValue === 'row' ) {
	152	+ $css['order'] = 1;
	153	+ } elseif ( $iconAlignmentValue === 'row-reverse' ) {
	154	+ $css['order'] = 2;
127	155	}
	156	+
128	157	return array_merge(
129	158	$css,
130		- isset( $attributes['iconAlignment'] ) ? Alignment::get_css( $attributes['iconAlignment'], 'flex-direction', $device ) : [],
	159	+ isset( $attributes['alignment'] ) ? Alignment::get_css( $attributes['alignment'], 'justify-items', $device ) : [],
131	160	Range::get_css([
132	161	'attributeValue' => $attributes['innerGap'],
133	162	'attribute_object_key' => 'value',
134	163	'isResponsive' => true,
		@@ -141,26 +170,34 @@
141	170	);
142	171	}
143	172
144	173	public function get_paragraph_text_css( $attributes, $device = '' ) {
	174	+ $css = [];
	175	+ $iconAlignmentValue = $this->get_responsive_attribute_value( $attributes['iconAlignment'], $device );
	176	+ $typographyValueGlobal = ! empty( $attributes['listTypographyGlobal'] ) ? $attributes['listTypographyGlobal'] : '';
	177	+ $typography_value = isset( $attributes['listTypography'] ) ? $attributes['listTypography'] : [];
	178	+
	179	+ if ( $iconAlignmentValue === 'row' ) {
	180	+ $css['order'] = 2;
	181	+ } elseif ( $iconAlignmentValue === 'row-reverse' ) {
	182	+ $css['order'] = 1;
	183	+ }
145	184	return array_merge(
146		- isset( $attributes['listTypography'] ) ? Typography::get_css( $attributes['listTypography'], '', $device ) : [],
	185	+ $css,
	186	+ [ 'color' => Color::get_css( isset( $attributes['textColor'] ) ? $attributes['textColor'] : '' ) ],
	187	+ Typography::get_css( $typography_value, '', $device, $typographyValueGlobal ),
147	188	isset( $attributes['listTextStroke'] ) ? TextStroke::get_css( $attributes['listTextStroke'], '', $device ) : [],
148	189	isset( $attributes['listTextShadow'] ) ? TextShadow::get_css( $attributes['listTextShadow'] ) : [],
149	190	);
150	191	}
151	192	public function get_paragraph_drop_text_css( $attributes, $device = '' ) {
152		- $css = [];
153		- if ( ! empty( $attributes['dropCapsTextColor'] ) ) {
154		- $css['color'] = $attributes['dropCapsTextColor'];
155		- }
156		- return $css;
	193	+ return [ 'color' => Color::get_css( isset( $attributes['dropCapsTextColor'] ) ? $attributes['dropCapsTextColor'] : '' ) ];
157	194	}
158	195
159	196	public function get_divider_css( $attributes, $device = '' ) {
160	197	$css = [];
	198	+ $css['order'] = 3;
161	199	$divider_width = isset( $attributes['width'][ 'value' . $device ] ) ? $attributes['width'][ 'value' . $device ] : 60;
162		- $divider_color = isset( $attributes['color'] ) ? $attributes['color'] : '#000000';
163	200	$default_Unit = '%';
164	201
165	202	if ( ! empty( $attributes['listsDirection'][ 'value' . $device ] ) && $attributes['listsDirection'][ 'value' . $device ] === 'row' ) {
166	203	$css['display'] = 'none';
		@@ -167,9 +204,9 @@
167	204	} else {
168	205	$css['display'] = 'block';
169	206	}
170	207	if ( ! empty( $attributes['color'] ) ) {
171		- $css['--ablocks-divider-pattern-color'] = $divider_color;
	208	+ $css['--ablocks-divider-pattern-color'] = Color::get_css( isset( $attributes['color'] ) ? $attributes['color'] : '#000000' );
172	209	}
173	210
174	211	$moreRangeCSS = [];
175	212	if ( isset( $attributes['dividerType'] ) && $attributes['dividerType'] === 'mask-style' && isset( $attributes['size'] ) && ! empty( $attributes['size'] ) ) {
		@@ -203,8 +240,9 @@
203	240	}
204	241
205	242	return array_merge(
206	243	$css,
	244	+ isset( $attributes['alignment'] ) ? Alignment::get_css( $attributes['alignment'], 'justify-self', $device ) : [],
207	245	Range::get_css([
208	246	'attributeValue' => $attributes['width'],
209	247	'attribute_object_key' => 'value',
210	248	'isResponsive' => true,
		@@ -215,7 +253,25 @@
215	253	'device' => $device,
216	254	]),
217	255	$moreRangeCSS,
218	256	);
	257	+ }
	258	+
	259	+ // don't delete this function, it's used in the render method to get responsive attribute values
	260	+ public function get_responsive_attribute_value( $attribute, $device ) {
	261	+
	262	+ if ( $device === 'Mobile' ) {
	263	+ return ! empty( $attribute['valueMobile'] ) ? $attribute['valueMobile']
	264	+ : ( ! empty( $attribute['valueTablet'] ) ? $attribute['valueTablet']
	265	+ : ( $attribute['value'] ?? '' ) );
	266	+ }
	267	+
	268	+ if ( $device === 'Tablet' ) {
	269	+ return ! empty( $attribute['valueTablet'] ) ? $attribute['valueTablet']
	270	+ : ( $attribute['value'] ?? '' );
	271	+ }
	272	+
	273	+ // Default (Desktop or others)
	274	+ return $attribute['value'] ?? '';
219	275	}
220	276
221	277	}