← All changes | includes/blocks/notice/block.php +92 -16 2.9.1 → 2.14.0 View file →

		@@ -12,25 +12,29 @@
12	12	use ABlocks\Controls\TextShadow;
13	13	use ABlocks\Controls\TextStroke;
14	14	use ABlocks\Controls\Dimensions;
15	15	use ABlocks\Controls\Icon;
	16	+use ABlocks\Classes\CssGeneratorV2;
	17	+use ABlocks\Controls\Color;
16	18
17	19	class Block extends BlockBaseAbstract {
18	20	protected $block_name = 'notice';
19	21
20		- public function build_css( $attributes ) {
	22	+ public function build_css_v1( $attributes ) {
21	23	$css_generator = new CssGenerator( $attributes, $this->block_name );
22	24	$css_generator->add_class_styles(
23	25	'{{WRAPPER}} .ablocks-notice-header',
24	26	$this->get_notice_header_css( $attributes ),
25	27	$this->get_notice_header_css( $attributes, 'Tablet' ),
26		- $this->get_notice_header_css( $attributes, 'Mobile' )
	28	+ $this->get_notice_header_css( $attributes, 'Mobile' ),
	29	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_notice_header_css( $attributes, $device ); } )
27	30	);
28	31	$css_generator->add_class_styles(
29	32	'{{WRAPPER}} .ablocks-notice-header .ablocks-notice-title',
30	33	$this->get_notice_header_title_css( $attributes ),
31	34	$this->get_notice_header_title_css( $attributes, 'Tablet' ),
32		- $this->get_notice_header_title_css( $attributes, 'Mobile' )
	35	+ $this->get_notice_header_title_css( $attributes, 'Mobile' ),
	36	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_notice_header_title_css( $attributes, $device ); } )
33	37	);
34	38
35	39	// Icon CSS
36	40	$css_generator->add_class_styles(
		@@ -36,10 +40,18 @@
36	40	$css_generator->add_class_styles(
37	41	'{{WRAPPER}} .ablocks-notice-header .ablocks-icon-wrap',
38	42	Icon::get_wrapper_css( $attributes ),
39	43	Icon::get_wrapper_css( $attributes, 'Tablet' ),
40		- Icon::get_wrapper_css( $attributes, 'Mobile' )
	44	+ Icon::get_wrapper_css( $attributes, 'Mobile' ),
	45	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_css( $attributes, $device ); } )
41	46	);
	47	+ $css_generator->add_class_styles(
	48	+ '{{WRAPPER}} .ablocks-notice-header .ablocks-icon-wrap:hover',
	49	+ Icon::get_wrapper_hover_css( $attributes ),
	50	+ Icon::get_wrapper_hover_css( $attributes, 'Tablet' ),
	51	+ Icon::get_wrapper_hover_css( $attributes, 'Mobile' ),
	52	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_hover_css( $attributes, $device ); } )
	53	+ );
42	54
43	55	$css_generator->add_class_styles(
44	56	'{{WRAPPER}} .ablocks-notice-header .ablocks-icon-wrap img.ablocks-image-icon',
45	57	Icon::get_element_image_css( $attributes ),
		@@ -66,31 +78,95 @@
66	78	);
67	79
68	80	return $css_generator->generate_css();
69	81	}
	82	+ public function build_css_v2( $attributes ) {
	83	+ $css_generator = new CssGeneratorV2( $attributes, $this->block_name );
70	84
	85	+ $css_generator->add_class_styles(
	86	+ '{{WRAPPER}} .ablocks-notice-header',
	87	+ $this->get_notice_header_css( $attributes ),
	88	+ $this->get_notice_header_css( $attributes, 'Tablet' ),
	89	+ $this->get_notice_header_css( $attributes, 'Mobile' ),
	90	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_notice_header_css( $attributes, $device ); } )
	91	+ );
	92	+ $css_generator->add_class_styles(
	93	+ '{{WRAPPER}} .ablocks-notice-header .ablocks-notice-title',
	94	+ $this->get_notice_header_title_css( $attributes ),
	95	+ $this->get_notice_header_title_css( $attributes, 'Tablet' ),
	96	+ $this->get_notice_header_title_css( $attributes, 'Mobile' ),
	97	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_notice_header_title_css( $attributes, $device ); } )
	98	+ );
	99	+
	100	+ // Icon CSS
	101	+ $css_generator->add_class_styles(
	102	+ '{{WRAPPER}} .ablocks-notice-header .ablocks-icon-wrap',
	103	+ Icon::get_wrapper_css( $attributes ),
	104	+ Icon::get_wrapper_css( $attributes, 'Tablet' ),
	105	+ Icon::get_wrapper_css( $attributes, 'Mobile' ),
	106	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_css( $attributes, $device ); } )
	107	+ );
	108	+ $css_generator->add_class_styles(
	109	+ '{{WRAPPER}} .ablocks-notice-header .ablocks-icon-wrap:hover',
	110	+ Icon::get_wrapper_hover_css( $attributes ),
	111	+ Icon::get_wrapper_hover_css( $attributes, 'Tablet' ),
	112	+ Icon::get_wrapper_hover_css( $attributes, 'Mobile' ),
	113	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_wrapper_hover_css( $attributes, $device ); } )
	114	+ );
	115	+
	116	+ $css_generator->add_class_styles(
	117	+ '{{WRAPPER}} .ablocks-notice-header .ablocks-icon-wrap img.ablocks-image-icon',
	118	+ Icon::get_element_image_css( $attributes ),
	119	+ Icon::get_element_image_css( $attributes, 'Tablet' ),
	120	+ Icon::get_element_image_css( $attributes, 'Mobile' ),
	121	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_element_image_css( $attributes, $device ); } )
	122	+ );
	123	+ $css_generator->add_class_styles(
	124	+ '{{WRAPPER}} .ablocks-notice-header .ablocks-icon-wrap img.ablocks-image-icon:hover',
	125	+ Icon::get_element_image_hover_css( $attributes ),
	126	+ Icon::get_element_image_hover_css( $attributes, 'Tablet' ),
	127	+ Icon::get_element_image_hover_css( $attributes, 'Mobile' ),
	128	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_element_image_hover_css( $attributes, $device ); } )
	129	+ );
	130	+ $css_generator->add_class_styles(
	131	+ '{{WRAPPER}} .ablocks-notice-header .ablocks-icon-wrap svg.ablocks-svg-icon',
	132	+ Icon::get_element_css( $attributes ),
	133	+ Icon::get_element_css( $attributes, 'Tablet' ),
	134	+ Icon::get_element_css( $attributes, 'Mobile' ),
	135	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_element_css( $attributes, $device ); } )
	136	+ );
	137	+ $css_generator->add_class_styles(
	138	+ '{{WRAPPER}} .ablocks-notice-header .ablocks-icon-wrap svg.ablocks-svg-icon:hover',
	139	+ Icon::get_element_image_hover_css( $attributes ),
	140	+ Icon::get_element_image_hover_css( $attributes, 'Tablet' ),
	141	+ Icon::get_element_image_hover_css( $attributes, 'Mobile' ),
	142	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return Icon::get_element_image_hover_css( $attributes, $device ); } )
	143	+ );
	144	+
	145	+ return $css_generator->generate_css();
	146	+ }
	147	+
	148	+ public function build_css( $attributes ) {
	149	+ if ( isset( $attributes['blockVersion'] ) && (int) $attributes['blockVersion'] === 2 ) {
	150	+ return $this->build_css_v2( $attributes );
	151	+ }
	152	+ return $this->build_css_v1( $attributes );
	153	+ }
71	154	public function get_notice_header_css( $attributes, $device = '' ) {
72		- $css = [];
73		- if ( ! empty( $attributes['backgroundColor'] ) ) {
74		- $css['background'] = $attributes['backgroundColor'];
75		- }
76	155	return array_merge(
77		- Dimensions::get_css( $attributes['noticeHeaderPadding'], 'padding', $device ),
78		- $css
	156	+ [ 'background' => Color::get_css( isset( $attributes['backgroundColor'] ) ? $attributes['backgroundColor'] : '' ) ],
	157	+ Dimensions::get_css( $attributes['noticeHeaderPadding'], 'padding', $device )
79	158	);
80	159	}
81	160
82	161	public function get_notice_header_title_css( $attributes, $device = '' ) {
83		- $css = [];
84		- if ( ! empty( $attributes['textColor'] ) ) {
85		- $css['color'] = $attributes['textColor'];
86		- }
	162	+ $typographyValueGlobal = ! empty( $attributes['typographyGlobal'] ) ? $attributes['typographyGlobal'] : array();
87	163	return array_merge(
	164	+ [ 'color' => Color::get_css( isset( $attributes['textColor'] ) ? $attributes['textColor'] : '' ) ],
88	165	Alignment::get_css( $attributes['alignment'], 'justify-content', $device ),
89		- Typography::get_css( $attributes['typography'], '', $device ),
	166	+ Typography::get_css( $attributes['typography'], '', $device, $typographyValueGlobal ),
90	167	TextShadow::get_css( $attributes['textShadow'], '', $device ),
91	168	TextStroke::get_css( $attributes['textStroke'], '', $device ),
92		- $css,
93	169	);
94	170	}
95	171
96	172	}