$style ){ $new = ''; foreach( $style as $property => $value ){ if( $value == '' ){ $new .= $property; }else { $new .= " $property: $value;"; } } $output .= "$selector { $new }"; } return $output; } } // Image Gallery class BIGBImageGallery{ function __construct(){ add_action( 'init', [$this, 'onInit'] ); } function onInit() { wp_register_style( 'bigb-image-gallery-editor-style', plugins_url( 'dist/editor.css', __FILE__ ), [ 'wp-edit-blocks' ], BIGB_PLUGIN_VERSION ); // Backend Style wp_register_style( 'bigb-image-gallery-style', plugins_url( 'dist/style.css', __FILE__ ), [ 'wp-editor' ], BIGB_PLUGIN_VERSION ); // Both Style register_block_type( __DIR__, [ 'editor_style' => 'bigb-image-gallery-editor-style', 'style' => 'bigb-image-gallery-style', 'render_callback' => [$this, 'render'] ] ); // Register Block wp_set_script_translations( 'bigb-image-gallery-editor-script', 'image-gallery', plugin_dir_path( __FILE__ ) . 'languages' ); // Translate } function render( $attributes ){ extract( $attributes ); $imageGalleryStyle = new BIGBStyleGenerator(); // Generate Styles $imageGalleryStyle::addStyle( "#bigbImageGallery-$cId .bigbImageGallery .galleryItems", [ 'grid-gap' => "$rowGap $columnGap" ] ); $imageGalleryStyle::addStyle( "#bigbImageGallery-$cId .bigbImageGallery .galleryItem", [ 'height' => $itemHeight, $background['styles'] ?? 'background: linear-gradient(#ff5f6d, #ffc371)' => '', 'box-shadow' => $shadow['styles'] ?? '0 4px 4px 0 #000a1459' ] ); $imageGalleryStyle::addStyle( "#bigbImageGallery-$cId .bigbImageGallery .galleryItem:hover", [ 'box-shadow' => $hoverShadow['styles'] ?? '0 12px 20px -12px #000a14cc' ] ); $imageGalleryStyle::addStyle( "#bigbImageGallery-$cId .bigbImageGallery .galleryHeader h3", [ $titleTypo['styles'] ?? 'font-size: 48px;' => '' ] ); $imageGalleryStyle::addStyle( "#bigbImageGallery-$cId .bigbImageGallery .galleryHeader h5", [ $subtitleTypo['styles'] ?? 'font-size: 20px;' => '' ] ); ob_start(); ?>