
Animated Gradient Cover Background
To use animated background gradients to cover blocks we use this CSS, and apply the class .has-animated-bg
In this application, it is expecting a background image, if no image is required a spacer.gif file could be used and opacity on the background gradient can be set to 100.
.has-animated-bg .wp-block-cover__gradient-background { @include breakpoint(large) { background-size: 400% !important; animation: bganimation 12s ease infinite; } } @keyframes bganimation { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
Title
Title
Title