Newsletter Type 6
Sign up to receive our monthly newsletter, filled with timely
The above block is copied from the site: https://cascadefinadev.wpenginepowered.com/charity-and-community/
Pattern HTML
<!-- wp:group {"metadata":{"name":"CTA"},"align":"full","className":"cta-section","backgroundColor":"five","layout":{"type":"default"}} -->
<div class="wp-block-group alignfull cta-section has-five-background-color has-background"><!-- wp:acf/responsive-picture {"name":"acf/responsive-picture","data":{"desktop_image":2645,"_desktop_image":"field_68fc75d331296","tablet_image":"","_tablet_image":"field_68fc760731297","mobile_image":2642,"_mobile_image":"field_68fc763331298"},"mode":"preview"} /-->
<!-- wp:group {"layout":{"type":"constrained"}} -->
<div class="wp-block-group"><!-- wp:columns {"verticalAlignment":"center"} -->
<div class="wp-block-columns are-vertically-aligned-center"><!-- wp:column {"verticalAlignment":"center","width":"65%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:65%"><!-- wp:group {"metadata":{"name":"Content"},"animationsForBlocks":{"animation":"zoom","variation":"in-right","once":true,"mirror":false,"easing":"linear"},"layout":{"type":"constrained","justifyContent":"center"}} -->
<div class="wp-block-group" data-aos="zoom-in-right" data-aos-easing="linear" data-aos-once="true"><!-- wp:heading {"level":6,"style":{"elements":{"link":{"color":{"text":"var:preset|color|white"}}}},"textColor":"white"} -->
<h6 class="wp-block-heading has-white-color has-text-color has-link-color">Stay Connected With Us!</h6>
<!-- /wp:heading -->
<!-- wp:heading {"style":{"elements":{"link":{"color":{"text":"var:preset|color|one"}}}},"textColor":"one"} -->
<h2 class="wp-block-heading has-one-color has-text-color has-link-color">Sign up to receive our monthly newsletter, filled with timely <br>insights and financial tips</h2>
<!-- /wp:heading --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"center","width":"35%","animationsForBlocks":{"animation":"zoom","variation":"in-left","once":true,"mirror":false,"easing":"linear"},"style":{"elements":{"link":{"color":{"text":"var:preset|color|nine"}}}},"textColor":"nine"} -->
<div class="wp-block-column is-vertically-aligned-center has-nine-color has-text-color has-link-color" style="flex-basis:35%" data-aos="zoom-in-left" data-aos-easing="linear" data-aos-once="true"><!-- wp:gravityforms/form {"formId":"7","title":false,"description":false,"inputPrimaryColor":"#204ce5"} /--></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group --></div>
<!-- /wp:group -->
Pattern CSS
.upt-responsive-picture {
display: block;
}
.responsive-hero-section {
position: relative;
overflow: hidden;
min-height: 436px;
display: flex;
flex-direction: column;
justify-content: center;
padding: 50px 0;
}
body.home .responsive-hero-section {
min-height: 850px;
justify-content: flex-end;
padding-bottom: var(--wp--preset--spacing--110);
}
.cta-section{
position: relative;
overflow: hidden;
flex-direction: column;
justify-content: center;
padding: 105px 0;
}
.responsive-hero-section .upt-responsive-picture img,
.cta-section .upt-responsive-picture img{
display: block;
border: none;
bottom: 0;
box-shadow: none;
height: 100%;
left: 0;
margin: 0;
max-height: none;
max-width: none;
object-fit: cover;
outline: 0;
padding: 0;
position: absolute;
right: 0;
top: 0;
width: 100%;
object-position: center bottom;
}
.cta-section .gform_wrapper.gravity-theme .gfield_required{
color: var(--wp--preset--color--one);
}
.responsive-hero-section .hero-content {
margin-top: -12px;
}
.block-editor-block-list__block.wp-block-acf-responsive-picture * {
width: 100%;
height: 100%;
display: block;
min-height: 100% !important;
}
.block-editor-block-list__block.wp-block-acf-responsive-picture {
position: unset !important;
}
@media only screen and (max-width: 780px) {
.responsive-hero-section{
min-height: 336px;
}
}
