Subscription with gradient background

Usa il markup del blocco e l’anteprima forniti come specifica e, per prima cosa, esamina come questo repository memorizza i pattern di blocchi WordPress esistenti. Il lavoro è terminato quando il pattern “Subscription with gradient background” è rappresentato nel repository e la sua anteprima renderizzata corrisponde all’esempio fornito.

Screenshot:

<!-- wp:cover {"minHeight":60,"minHeightUnit":"vh","customGradient":"linear-gradient(45deg,rgb(198,136,187) 0%,rgb(242,156,115) 100%)","isDark":false,"align":"full","style":{"spacing":{"padding":{"bottom":"40px","top":"40px"}}}} -->
<div class="wp-block-cover alignfull is-light" style="padding-top:40px;padding-bottom:40px;min-height:60vh"><span aria-hidden="true" class="wp-block-cover__background has-background-dim-100 has-background-dim has-background-gradient" style="background:linear-gradient(45deg,rgb(198,136,187) 0%,rgb(242,156,115) 100%)"></span><div class="wp-block-cover__inner-container"><!-- wp:group {"layout":{"inherit":true}} -->
<div class="wp-block-group"><!-- wp:group {"style":{"spacing":{"padding":{"top":"30px","right":"30px","bottom":"30px","left":"30px"}}}} -->
<div class="wp-block-group" style="padding-top:30px;padding-right:30px;padding-bottom:30px;padding-left:30px"><!-- wp:image {"id":6062,"width":150,"height":150,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large is-resized"><img src="https://dotcompatterns.files.wordpress.com/2022/08/vub7ymwqhum.png?w=300" alt="" class="wp-image-6062" width="150" height="150"/></figure>
<!-- /wp:image -->

<!-- wp:heading {"textAlign":"center","style":{"typography":{"fontStyle":"normal","fontWeight":"700"}}} -->
<h2 class="has-text-align-center" style="font-style:normal;font-weight:700">John Doe</h2>
<!-- /wp:heading -->

<!-- wp:paragraph {"align":"center"} -->
<p class="has-text-align-center">Subscribe to this newsletter for full of inspiring stories about the life and work of John Doe.</p>
<!-- /wp:paragraph -->

<!-- wp:group {"style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"}},"color":{"background":"#a76b7d"},"border":{"radius":"10px"}}} -->
<div class="wp-block-group has-background" style="border-radius:10px;background-color:#a76b7d;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px"><!-- wp:jetpack/subscriptions {"buttonWidth":"","submitButtonText":"\u003cstrong\u003e Subscribe\u003c/strong\u003e","customButtonBackgroundColor":"#fffffa","customTextColor":"#3a2325","borderRadius":10,"borderWeight":0,"customBorderColor":"#fffffa","padding":15,"spacing":10,"className":"is-style-compact"} -->
<div class="wp-block-jetpack-subscriptions wp-block-jetpack-subscriptions__supports-newline is-style-compact">[jetpack_subscription_form show_subscribers_total="false" button_on_newline="false" submit_button_text="&lt;strong&gt; Subscribe&lt;/strong&gt;" custom_background_button_color="#fffffa" custom_text_button_color="#3a2325" custom_font_size="16px" custom_border_radius="10" custom_border_weight="1" custom_border_color="#fffffa" custom_padding="15" custom_spacing="10" submit_button_classes="" email_field_classes="" show_only_email_and_button="true" success_message="Success! An email was just sent to confirm your subscription. Please find the email now and click &#039;Confirm Follow&#039; to start subscribing."]</div>
<!-- /wp:jetpack/subscriptions --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div></div>
<!-- /wp:cover -->

Preview:
https://dotcompatterns.wordpress.com/?p=6048&preview=true