feat (Acf_Block): handle mutliple gutenberg options

[n-langle]

Cette PR permet de supporter plusieurs options native de Gutenberg sur les blocs ACF :

• Couleur de texte (color)
• Couleur d'arrière plan (background-color)
• Marges internes (margin)
• Marge externes (pudding)
• Style de bordure (radius, width, style, color)

Les propriétés doivent être déclarées dans le fichier block.json :

{
	"name": "namespace/block-name",
	"title": "Block title",
	"description": "Block description",
	"category": "widgets",
	"icon": "megaphone",
	"acf": {
		"mode": "auto"
	},
	"attributes": {
		"backgroundColor": {
			"default": "",
			"type": "string"
		},
		"textColor": {
			"default": "",
			"type": "string"
		}
	},
	"supports": {
		"align": true,
		"color": true,
		"inserter": true,
		"mode": true,
		"spacing": {
			"margin": true,
			"padding": true
		},
		"__experimentalBorder": {
			"color": true,
			"radius": true,
			"style": true,
			"width": true
		}
	}
}

Dans le fichier php, la variable $block_style doit être ajoutée :

<div class="block <?php echo esc_attr( $block_classname ); ?>" style="<?php echo esc_attr( $block_style ); ?>">
	...
</div>

À noter que la structure du block étant différente entre l’éditeur et le front office, il est impératif d’annuler le style sur la balise englobant le bloc ACF :

.acf-block-component {
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	
	// cancel margins on children in order to keep margin merging capability
	> * {
		margin: 0 !important;
	}
}

[cedric07]

@n-langle

Pour le style, à déporter dans le BFF non ?

[n-langle]

@cedric07 le plugin n'étant pas tout le temps présent, je dirais non. Je l'ai mis ici à titre d'information

[n-langle]

<div <?php echo wp_kses_data( get_block_wrapper_attributes() ); ?>>