Bricks Builder Custom Interaction

add_filter( 'bricks/setup/control_options', function( $options ) {
  // Add custom animation called Flash and Fade
  $options['animationTypes']['flashFadeIn'] = esc_html__( 'Flash and Fade In', 'bricks' );

  return $options;
}, 10 );


function enqueue_custom_animations() {
  // Register a handle for the CSS or JS to attach the inline
  wp_register_style( 'custom-animation-style', false );
  
  // The CSS we want to load globally
  $custom_css = '
    .brx-animate-flashFadeIn {
      animation-name: flash-fade-in;
      animation-duration: 4s;
      animation-timing-function: ease-in-out;
      animation-fill-mode: both;
    }

    @keyframes flash-fade-in {
      0%, 100% {        opacity: 0;      }
      10%, 30% {        opacity: 1;      }
      40%, 50% {        opacity: 0;      }
      60%, 80% {        opacity: 1;      }
      90% {        opacity: 0.5;      }
      100% {        opacity: 1;      }
    }
	
	<script>
	
	
	</script>
  ';

  // Add the inline CSS
  wp_add_inline_style( 'custom-animation-style', $custom_css );

  // Enqueue the registered style handle so it loads
  wp_enqueue_style( 'custom-animation-style' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_custom_animations' );