Remote: refactor patterns to load directly from the editor (#5829)

* refactor patterns to load directly from the editor

* wrong pattern name fixed

remote/functions.php

@@ -60,7 +60,46 @@ endif;
 
 add_action( 'wp_enqueue_scripts', 'remote_styles' );
 
+
 /**
- * Block Patterns.
+ * Registers block patterns and categories.
+ *
+ * @since Remote 1.0
+ *
+ * @return void
  */
-require get_template_directory() . '/inc/block-patterns.php';
+function remote_register_block_pattern_categories() {
+
+	//Needed until https://github.com/WordPress/gutenberg/issues/39500 is fixed.
+	$block_pattern_categories = array(
+		'featured' => array( 'label' => __( 'Featured', 'remote' ) ),
+		'columns'  => array( 'label' => __( 'Columns', 'remote' ) ),
+		'text'     => array( 'label' => __( 'Text', 'remote' ) ),
+		'query'    => array( 'label' => __( 'Query', 'remote' ) ),
+	);
+
+	/**
+	 * Filters the theme block pattern categories.
+	 *
+	 * @since remote 1.0
+	 *
+	 * @param array[] $block_pattern_categories {
+	 *     An associative array of block pattern categories, keyed by category name.
+	 *
+	 *     @type array[] $properties {
+	 *         An array of block category properties.
+	 *
+	 *         @type string $label A human-readable label for the pattern category.
+	 *     }
+	 * }
+	 */
+	$block_pattern_categories = apply_filters( 'remote_block_pattern_categories', $block_pattern_categories );
+
+	foreach ( $block_pattern_categories as $name => $properties ) {
+		if ( ! WP_Block_Pattern_Categories_Registry::get_instance()->is_registered( $name ) ) {
+			register_block_pattern_category( $name, $properties );
+		}
+	}
+
+}
+add_action( 'init', 'remote_register_block_pattern_categories', 9 );

remote/inc/block-patterns.php

@@ -1,82 +0,0 @@
-<?php
-/**
- * remote: Block Patterns
- *
- * @since remote 1.0
- */
-
-/**
- * Registers block patterns and categories.
- *
- * @since remote 1.0
- *
- * @return void
- */
-function remote_register_block_patterns() {
-
-	//Needed until https://github.com/WordPress/gutenberg/issues/39500 is fixed.
-	$block_pattern_categories = array(
-		'featured' => array( 'label' => __( 'Featured', 'remote' ) ),
-		'columns'  => array( 'label' => __( 'Columns', 'remote' ) ),
-		'text'     => array( 'label' => __( 'Text', 'remote' ) ),
-		'query'    => array( 'label' => __( 'Query', 'remote' ) ),
-	);
-
-	/**
-	 * Filters the theme block pattern categories.
-	 *
-	 * @since remote 1.0
-	 *
-	 * @param array[] $block_pattern_categories {
-	 *     An associative array of block pattern categories, keyed by category name.
-	 *
-	 *     @type array[] $properties {
-	 *         An array of block category properties.
-	 *
-	 *         @type string $label A human-readable label for the pattern category.
-	 *     }
-	 * }
-	 */
-	$block_pattern_categories = apply_filters( 'remote_block_pattern_categories', $block_pattern_categories );
-
-	foreach ( $block_pattern_categories as $name => $properties ) {
-		if ( ! WP_Block_Pattern_Categories_Registry::get_instance()->is_registered( $name ) ) {
-			register_block_pattern_category( $name, $properties );
-		}
-	}
-
-	$block_patterns = array(
-		'hero-text',
-		'large-quote',
-		'small-quote',
-		'hidden-404-content',
-		'hidden-search-form',
-		'image-with-text',
-		'posts-grid',
-		'posts-list',
-		'subscribe',
-		'tags',
-		'categories',
-	);
-
-	/**
-	 * Filters the theme block patterns.
-	 *
-	 * @since remote 1.0
-	 *
-	 * @param array $block_patterns List of block patterns by name.
-	 */
-	$block_patterns = apply_filters( 'remote_block_patterns', $block_patterns );
-
-	foreach ( $block_patterns as $block_pattern ) {
-		$pattern_file = get_theme_file_path( '/inc/patterns/' . $block_pattern . '.php' );
-
-		register_block_pattern(
-			'remote/' . $block_pattern,
-			require $pattern_file
-		);
-	}
-}
-add_action( 'init', 'remote_register_block_patterns', 9 );
-
-

remote/inc/patterns/categories.php

@@ -1,12 +0,0 @@
-<?php
-/**
- * Categories Pattern
- */
-return array(
-	'title'      => __( 'Categories', 'remote' ),
-	'categories' => array( 'text', 'featured' ),
-	'content'    => '<!-- wp:paragraph {"style":{"typography":{"textTransform":"uppercase"}},"fontSize":"small"} -->
-		<p class="has-small-font-size" style="text-transform:uppercase">' . esc_html__( 'Categories', 'remote' ) . '</p>
-		<!-- /wp:paragraph -->
-		<!-- wp:tag-cloud {"className":"is-style-outline","taxonomy":"category"} /-->',
-);

remote/inc/patterns/hero-text.php

@@ -1,21 +0,0 @@
-<?php
-/**
- * Hero text
- */
-return array(
-	'title'      => __( 'Hero text', 'remote' ),
-	'categories' => array( 'text', 'featured' ),
-	'content'    => '<!-- wp:group {"align":"wide"} -->
-    <div class="wp-block-group alignwide"><!-- wp:spacer {"height":"32px"} -->
-    <div style="height:32px" aria-hidden="true" class="wp-block-spacer"></div>
-    <!-- /wp:spacer -->
-    
-    <!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.17"}},"fontSize":"huge"} -->
-    <p class="has-huge-font-size" style="line-height:1.17">' . esc_html__( 'Hi, I’m Tiffany! After years of long commutes and crowded offices, I’m now a happy advocate for remote work.', 'remote' ) . '</p>
-    <!-- /wp:paragraph -->
-    
-    <!-- wp:spacer -->
-    <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
-    <!-- /wp:spacer --></div>
-    <!-- /wp:group -->',
-);

remote/inc/patterns/hidden-404-content.php

@@ -1,24 +0,0 @@
-<?php
-/**
- * 404 content.
- */
-return array(
-	'title'    => __( '404 content', 'remote' ),
-	'inserter' => false,
-	'content'  => '<!-- wp:heading {"style":{"typography":{"fontSize":"min(max(42px, 5vw), 72px)","fontWeight":"100","lineHeight":"1"}},"className":"has-text-align-center"} -->
-	<h2 class="has-text-align-center" style="font-size:min(max(42px, 5vw), 72px);font-weight:100;line-height:1">' . esc_html( _x( '404', 'Error code for a webpage that is not found.', 'remote' ) ) . '</h2>
-	<!-- /wp:heading -->
-	<!-- wp:paragraph {"align":"center"} -->
-	<p class="has-text-align-center">' . esc_html__( 'This page could not be found. Maybe try a search?', 'remote' ) . '</p>
-	<!-- /wp:paragraph -->
-
-	<!-- wp:spacer {"height":"1em"} -->
-	<div style="height:1em" aria-hidden="true" class="wp-block-spacer"></div>
-	<!-- /wp:spacer -->
-
-	<!-- wp:search {"label":"' . esc_html__( 'Search', 'remote' ) . '","showLabel":false,"width":100,"widthUnit":"%","buttonText":"' . esc_html__( 'Search', 'remote' ) . '","buttonUseIcon":true,"align":"center"} /-->
-	
-	<!-- wp:spacer {"height":"2em"} -->
-	<div style="height:2em" aria-hidden="true" class="wp-block-spacer"></div>
-	<!-- /wp:spacer -->',
-);

remote/inc/patterns/hidden-search-form.php

@@ -1,17 +0,0 @@
-<?php
-/**
- * Search form
- */
-return array(
-	'title'    => __( 'Search form', 'remote' ),
-	'inserter' => false,
-	'content'  => '<!-- wp:group {"layout":{"inherit":true}} -->
-    <div class="wp-block-group"><!-- wp:spacer {"height":"32px"} -->
-    <div style="height:32px" aria-hidden="true" class="wp-block-spacer"></div>
-    <!-- /wp:spacer -->
-    <!-- wp:search {"label":"' . esc_attr__( 'Search', 'remote' ) . '","width":100,"widthUnit":"%","buttonText":"' . esc_attr__( 'Search', 'remote' ) . '","style":{"border":{"radius":"0px"}}} /-->
-    <!-- wp:spacer -->
-    <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
-    <!-- /wp:spacer --></div>
-    <!-- /wp:group -->',
-);

remote/inc/patterns/image-with-text.php

@@ -1,25 +0,0 @@
-<?php
-/**
- * Image with text
- */
-return array(
-	'title'      => __( 'Image with text', 'remote' ),
-	'categories' => array( 'text', 'columns', 'featured' ),
-	'content'    => '<!-- wp:image {"align":"wide","sizeSlug":"large","linkDestination":"none"} -->
-	<figure class="wp-block-image alignwide size-large"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/Laptop.jpg" alt="' . esc_attr__( 'Picture of a laptop', 'remote' ) . '"/></figure>
-	<!-- /wp:image -->
-	
-	<!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":"50px","padding":{"top":"20px"}}}} -->
-	<div class="wp-block-columns alignwide" style="padding-top:20px"><!-- wp:column -->
-	<div class="wp-block-column"><!-- wp:paragraph -->
-	<p>' . esc_html__( 'Now that I’m working from home, I find that I am spending more time with my family, exercising more, and getting more sleep. This has not been at the expense of my productivity at work — if anything, my productivity has improved as well. I’ve become a pro at collaborating effectively across time zones. Most of my colleagues are in Europe or Asia, but I’m in way over California. I’d been worried that the distance would become a problem for us, but we’ve embraced asynchronous communication styles.', 'remote' ) . '</p>
-	<!-- /wp:paragraph --></div>
-	<!-- /wp:column -->
-	
-	<!-- wp:column {"width":"27%"} -->
-	<div class="wp-block-column" style="flex-basis:27%"><!-- wp:paragraph {"fontSize":"small"} -->
-	<p class="has-small-font-size">' . esc_html__( 'I setup my home office on day one, but it wasn’t ergonomically correct for me. So I’ve been revising it throughout the past few months.', 'remote' ) . '</p>
-	<!-- /wp:paragraph --></div>
-	<!-- /wp:column --></div>
-	<!-- /wp:columns -->',
-);

remote/inc/patterns/large-quote.php

@@ -1,25 +0,0 @@
-<?php
-/**
- * Large Quote
- *
- * @package Remote
- */
-
-return array(
-	'title'      => __( 'Large quote', 'remote' ),
-	'categories' => array( 'text', 'featured' ),
-	'content'    => 
-    '<!-- wp:group {"style":{"spacing":{"blockGap":"40px","padding":{"top":"20px","bottom":"20px"}}}} -->
-    <div class="wp-block-group" style="padding-top:20px;padding-bottom:20px">
-
-    <!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.25"}},"fontSize":"medium"} -->
-    <p class="has-medium-font-size" style="line-height:1.25">' . esc_html__( 'I’m spending more time with my family, exercising more, and getting more sleep.', 'remote' ) . '</p>
-    <!-- /wp:paragraph -->
-
-    <!-- wp:paragraph {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","lineHeight":"1.3"}},"fontSize":"small"} -->
-    <p class="has-small-font-size" style="font-style:normal;font-weight:400;line-height:1.3">' . esc_html__( '— Jane Adams', 'remote' ) . '</p>
-    <!-- /wp:paragraph -->
-
-    </div>
-    <!-- /wp:group -->',
-);

remote/inc/patterns/posts-grid.php

@@ -1,43 +0,0 @@
-<?php
-/**
- * Posts grid.
- *
- * @package Remote
- */
-
-return array(
-	'title'      => __( 'Posts grid', 'remote' ),
-	'categories' => array( 'query', 'featured' ),
-	'blockTypes' => array( 'core/query' ),
-	'content'    => '<!-- wp:group {"align":"full","layout":{"inherit":true}} -->
-	<div class="wp-block-group alignfull"><!-- wp:query {"queryId":0,"query":{"perPage":6,"pages":0,"offset":0,"postType":"post","order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":true,"taxQuery":null},"tagName":"main","displayLayout":{"type":"flex","columns":2},"align":"wide"} -->
-	<main class="wp-block-query alignwide"><!-- wp:post-template -->
-	<!-- wp:separator {"className":"is-style-wide"} -->
-	<hr class="wp-block-separator is-style-wide"/>
-	<!-- /wp:separator -->
-
-	<!-- wp:spacer {"height":"60px"} -->
-	<div style="height:60px" aria-hidden="true" class="wp-block-spacer"></div>
-	<!-- /wp:spacer -->
-	
-	<!-- wp:post-featured-image {"isLink":true,"width":"100%","height":"220px","style":{"spacing":{"margin":{"top":"0px","bottom":"30px"}}}} /-->
-	
-	<!-- wp:post-date {"format":"M j","fontSize":"small"} /-->
-	
-	<!-- wp:post-title {"isLink":true,"style":{"spacing":{"margin":{"top":"0.3em","bottom":"20px"}},"typography":{"lineHeight":"1.17"}},"fontSize":"medium"} /-->
-	<!-- /wp:post-template -->
-	
-	<!-- wp:spacer {"height":"32px"} -->
-	<div style="height:32px" aria-hidden="true" class="wp-block-spacer"></div>
-	<!-- /wp:spacer -->
-	
-	<!-- wp:query-pagination {"layout":{"type":"flex","justifyContent":"space-between"}} -->
-	<!-- wp:query-pagination-previous /-->
-	
-	<!-- wp:query-pagination-next /-->
-	<!-- /wp:query-pagination --></main>
-	<!-- /wp:query --></div>
-	<!-- /wp:group -->',
-);
-
-

remote/inc/patterns/posts-list.php

@@ -1,37 +0,0 @@
-<?php
-/**
- * Posts list
- */
-return array(
-	'title'      => __( 'Posts list', 'remote' ),
-	'categories' => array( 'query', 'featured' ),
-	'content'    => '<!-- wp:group {"align":"full","layout":{"inherit":true}} -->
-    <div class="wp-block-group alignfull"><!-- wp:query {"queryId":0,"query":{"perPage":10,"pages":0,"offset":0,"postType":"post","order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":true,"taxQuery":null},"tagName":"main","align":"wide"} -->
-    <main class="wp-block-query alignwide"><!-- wp:post-template -->
-    <!-- wp:separator {"className":"is-style-wide"} -->
-    <hr class="wp-block-separator is-style-wide"/>
-    <!-- /wp:separator -->
-
-    <!-- wp:columns {"style":{"spacing":{"padding":{"top":"1em"}}}} -->
-    <div class="wp-block-columns" style="padding-top:1em"><!-- wp:column {"verticalAlignment":"top","width":"10%","style":{"spacing":{"padding":{"top":"1em"}}}} -->
-    <div class="wp-block-column is-vertically-aligned-top" style="padding-top:1em;flex-basis:10%"><!-- wp:post-date {"format":"M j","fontSize":"small"} /--></div>
-    <!-- /wp:column -->
-
-    <!-- wp:column {"verticalAlignment":"center","width":""} -->
-    <div class="wp-block-column is-vertically-aligned-center"><!-- wp:post-title {"isLink":true,"style":{"spacing":{"margin":{"top":"0px","bottom":"0px"}},"typography":{"fontSize":"min(max(42px, 5vw), 72px)","lineHeight":"1.17"}}} /--></div>
-    <!-- /wp:column --></div>
-    <!-- /wp:columns -->
-    <!-- /wp:post-template -->
-
-    <!-- wp:spacer {"height":"32px"} -->
-    <div style="height:32px" aria-hidden="true" class="wp-block-spacer"></div>
-    <!-- /wp:spacer -->
-
-    <!-- wp:query-pagination {"layout":{"type":"flex","justifyContent":"space-between","flexWrap":"nowrap","orientation":"horizontal"}} -->
-    <!-- wp:query-pagination-previous /-->
-
-    <!-- wp:query-pagination-next /-->
-    <!-- /wp:query-pagination --></main>
-    <!-- /wp:query --></div>
-    <!-- /wp:group -->',
-);

remote/inc/patterns/small-quote.php

@@ -1,34 +0,0 @@
-<?php
-/**
- * Small quote.
- *
- * @package Remote
- */
-
-return array(
-	'title'      => __( 'Small quote', 'remote' ),
-	'categories' => array( 'text', 'featured' ),
-	'content'    => '
-    <!-- wp:columns {"style":{"spacing":{"blockGap":"30px"}}} -->
-    <div class="wp-block-columns"><!-- wp:column {"width":"50px","style":{"spacing":{"padding":{"top":"28px"}}}} -->
-    <div class="wp-block-column" style="padding-top:28px;flex-basis:50px"><!-- wp:image {"width":48,"sizeSlug":"large","className":"is-style-rounded"} -->
-    <figure class="wp-block-image size-large is-resized is-style-rounded"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/coworker.jpg" alt="' . esc_attr__( 'Picture of a user', 'remote' ) . '" width="48"/></figure>
-    <!-- /wp:image --></div>
-    <!-- /wp:column -->
-    
-    <!-- wp:column -->
-    <div class="wp-block-column"><!-- wp:group {"style":{"spacing":{"blockGap":"30px","padding":{"top":"20px","bottom":"20px"}}}} -->
-    <div class="wp-block-group" style="padding-top:20px;padding-bottom:20px"><!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.5"}},"fontSize":"normal"} -->
-    <p class="has-normal-font-size" style="line-height:1.5">' . esc_html__( 'Now that I’m working from home, I find that I am spending more time with my family, exercising more, and getting more sleep. This has not been at the expense of my productivity at work — if anything, my productivity has improved as well.', 'remote' ) . '</p>
-    <!-- /wp:paragraph -->
-    
-    <!-- wp:paragraph {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","lineHeight":"1.3"}},"fontSize":"small"} -->
-    <p class="has-small-font-size" style="font-style:normal;font-weight:400;line-height:1.3">' . esc_html__( '— Jane Adams', 'remote' ) . '</p>
-    <!-- /wp:paragraph --></div>
-    <!-- /wp:group --></div>
-    <!-- /wp:column --></div>
-    <!-- /wp:columns -->
-  ',
-);
-
-

remote/inc/patterns/subscribe.php

@@ -1,19 +0,0 @@
-<?php
-/**
- * Subscription form
- */
-return array(
-	'title'      => __( 'Subscription form', 'remote' ),
-	'categories' => array( 'text', 'featured' ),
-	'content'    => '<!-- wp:paragraph {"style":{"typography":{"textTransform":"uppercase"}},"fontSize":"small"} -->
-	<p class="has-small-font-size" style="text-transform:uppercase">' . esc_html__( 'Follow this blog', 'remote' ) . '</p>
-	<!-- /wp:paragraph -->
-
-	<!-- wp:paragraph -->
-	<p>' . esc_html__( 'Sign up to have each new post delivered to your inbox.', 'remote' ) . '</p>
-	<!-- /wp:paragraph -->
-
-	<!-- wp:jetpack/subscriptions {"buttonBackgroundColor":"primary","textColor":"background","borderRadius":6,"borderColor":"primary","className":"is-style-split","style":{"spacing":{"margin":{"top":"1.45em"}}}} -->
-	<div class="wp-block-jetpack-subscriptions wp-block-jetpack-subscriptions__supports-newline is-style-split" style="margin-top:1.45em">[jetpack_subscription_form show_subscribers_total="false" button_on_newline="false" custom_font_size="16px" custom_border_radius="6" custom_border_weight="1" custom_padding="15" custom_spacing="10" submit_button_classes="has-primary-border-color has-text-color has-background-color has-background has-primary-background-color" email_field_classes="has-primary-border-color" show_only_email_and_button="true" success_message="' . esc_html__( 'Success! An email was just sent to confirm your subscription. Please find the email now and click \'Confirm Follow\' to start subscribing.', 'remote' ) . '"]</div>
-	<!-- /wp:jetpack/subscriptions -->',
-);

remote/inc/patterns/tags.php

@@ -1,12 +0,0 @@
-<?php
-/**
- * Tags Pattern
- */
-return array(
-	'title'      => __( 'Tags', 'remote' ),
-	'categories' => array( 'text', 'featured' ),
-	'content'    => '<!-- wp:paragraph {"style":{"typography":{"textTransform":"uppercase"}},"fontSize":"small"} -->
-		<p class="has-small-font-size" style="text-transform:uppercase">' . esc_html__( 'Tags', 'remote' ) . '</p>
-		<!-- /wp:paragraph -->
-		<!-- wp:tag-cloud {"className":"is-style-outline"} /-->',
-);

remote/patterns/categories.php

@@ -0,0 +1,11 @@
+<?php
+/**
+ * Title: Categories
+ * Slug: remote/categories
+ * Categories: featured, text
+ */
+?>
+<!-- wp:paragraph {"style":{"typography":{"textTransform":"uppercase"}},"fontSize":"small"} -->
+<p class="has-small-font-size" style="text-transform:uppercase"><?php echo esc_html__( 'Categories', 'remote' ); ?></p>
+<!-- /wp:paragraph -->
+<!-- wp:tag-cloud {"className":"is-style-outline","taxonomy":"category"} /-->

remote/patterns/hero-text.php

@@ -0,0 +1,20 @@
+<?php
+/**
+ * Title: Hero text
+ * Slug: remote/hero-text
+ * Categories: featured, text
+ */
+?>
+<!-- wp:group {"align":"wide"} -->
+<div class="wp-block-group alignwide"><!-- wp:spacer {"height":"32px"} -->
+<div style="height:32px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+
+<!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.17"}},"fontSize":"huge"} -->
+<p class="has-huge-font-size" style="line-height:1.17"><?php echo esc_html__( 'Hi, I’m Tiffany! After years of long commutes and crowded offices, I’m now a happy advocate for remote work.', 'remote' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:spacer -->
+<div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer --></div>
+<!-- /wp:group -->

remote/patterns/hidden-404-content.php

@@ -0,0 +1,23 @@
+<?php
+/**
+ * Title: 404 content
+ * Slug: remote/hidden-404-content
+ * Inserter: no
+ */
+?>
+<!-- wp:heading {"style":{"typography":{"fontSize":"min(max(42px, 5vw), 72px)","fontWeight":"100","lineHeight":"1"}},"className":"has-text-align-center"} -->
+<h2 class="has-text-align-center" style="font-size:min(max(42px, 5vw), 72px);font-weight:100;line-height:1"><?php echo esc_html( _x( '404', 'Error code for a webpage that is not found.', 'remote' ) ); ?></h2>
+<!-- /wp:heading -->
+<!-- wp:paragraph {"align":"center"} -->
+<p class="has-text-align-center"><?php echo esc_html__( 'This page could not be found. Maybe try a search?', 'remote' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:spacer {"height":"1em"} -->
+<div style="height:1em" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+
+<!-- wp:search {"label":"<?php echo esc_html__( 'Search', 'remote' ); ?>","showLabel":false,"width":100,"widthUnit":"%","buttonText":"<?php echo esc_html__( 'Search', 'remote' ); ?>","buttonUseIcon":true,"align":"center"} /-->
+
+<!-- wp:spacer {"height":"2em"} -->
+<div style="height:2em" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->

remote/patterns/hidden-search-form.php

@@ -0,0 +1,16 @@
+<?php
+/**
+ * Title: Search form
+ * Slug: remote/hidden-search-form
+ * Inserter: no
+ */
+?>
+<!-- wp:group {"layout":{"inherit":true}} -->
+<div class="wp-block-group"><!-- wp:spacer {"height":"32px"} -->
+<div style="height:32px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+<!-- wp:search {"label":"<?php echo esc_attr__( 'Search', 'remote' ); ?>","width":100,"widthUnit":"%","buttonText":"<?php echo esc_attr__( 'Search', 'remote' ); ?>","style":{"border":{"radius":"0px"}}} /-->
+<!-- wp:spacer -->
+<div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer --></div>
+<!-- /wp:group -->

remote/patterns/image-with-text.php

@@ -0,0 +1,24 @@
+<?php
+/**
+ * Title: Image with text
+ * Slug: remote/image-with-text
+ * Categories: featured, text, columns
+ */
+?>
+<!-- wp:image {"align":"wide","sizeSlug":"large","linkDestination":"none"} -->
+<figure class="wp-block-image alignwide size-large"><img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/Laptop.jpg" alt="<?php echo esc_attr__( 'Picture of a laptop', 'remote' ); ?>"/></figure>
+<!-- /wp:image -->
+
+<!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":"50px","padding":{"top":"20px"}}}} -->
+<div class="wp-block-columns alignwide" style="padding-top:20px"><!-- wp:column -->
+<div class="wp-block-column"><!-- wp:paragraph -->
+<p><?php echo esc_html__( 'Now that I’m working from home, I find that I am spending more time with my family, exercising more, and getting more sleep. This has not been at the expense of my productivity at work — if anything, my productivity has improved as well. I’ve become a pro at collaborating effectively across time zones. Most of my colleagues are in Europe or Asia, but I’m in way over California. I’d been worried that the distance would become a problem for us, but we’ve embraced asynchronous communication styles.', 'remote' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column -->
+
+<!-- wp:column {"width":"27%"} -->
+<div class="wp-block-column" style="flex-basis:27%"><!-- wp:paragraph {"fontSize":"small"} -->
+<p class="has-small-font-size"><?php echo esc_html__( 'I setup my home office on day one, but it wasn’t ergonomically correct for me. So I’ve been revising it throughout the past few months.', 'remote' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns -->

remote/patterns/large-quote.php

@@ -0,0 +1,21 @@
+<?php
+/**
+ * Title: Large quote
+ * Slug: remote/large-quote
+ * Categories: featured, text
+ */
+?>
+
+<!-- wp:group {"style":{"spacing":{"blockGap":"40px","padding":{"top":"20px","bottom":"20px"}}}} -->
+<div class="wp-block-group" style="padding-top:20px;padding-bottom:20px">
+
+<!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.25"}},"fontSize":"medium"} -->
+<p class="has-medium-font-size" style="line-height:1.25"><?php echo esc_html__( 'I’m spending more time with my family, exercising more, and getting more sleep.', 'remote' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","lineHeight":"1.3"}},"fontSize":"small"} -->
+<p class="has-small-font-size" style="font-style:normal;font-weight:400;line-height:1.3"><?php echo esc_html__( '— Jane Adams', 'remote' ); ?></p>
+<!-- /wp:paragraph -->
+
+</div>
+<!-- /wp:group -->

remote/patterns/posts-grid.php

@@ -0,0 +1,38 @@
+<?php
+/**
+ * Title: Posts grid
+ * Slug: remote/posts-grid
+ * Categories: featured, query
+ * Block Types: query
+ */
+?>
+
+<!-- wp:group {"align":"full","layout":{"inherit":true}} -->
+<div class="wp-block-group alignfull"><!-- wp:query {"queryId":0,"query":{"perPage":6,"pages":0,"offset":0,"postType":"post","order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":true,"taxQuery":null},"tagName":"main","displayLayout":{"type":"flex","columns":2},"align":"wide"} -->
+<main class="wp-block-query alignwide"><!-- wp:post-template -->
+<!-- wp:separator {"className":"is-style-wide"} -->
+<hr class="wp-block-separator is-style-wide"/>
+<!-- /wp:separator -->
+
+<!-- wp:spacer {"height":"60px"} -->
+<div style="height:60px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+
+<!-- wp:post-featured-image {"isLink":true,"width":"100%","height":"220px","style":{"spacing":{"margin":{"top":"0px","bottom":"30px"}}}} /-->
+
+<!-- wp:post-date {"format":"M j","fontSize":"small"} /-->
+
+<!-- wp:post-title {"isLink":true,"style":{"spacing":{"margin":{"top":"0.3em","bottom":"20px"}},"typography":{"lineHeight":"1.17"}},"fontSize":"medium"} /-->
+<!-- /wp:post-template -->
+
+<!-- wp:spacer {"height":"32px"} -->
+<div style="height:32px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+
+<!-- wp:query-pagination {"layout":{"type":"flex","justifyContent":"space-between"}} -->
+<!-- wp:query-pagination-previous /-->
+
+<!-- wp:query-pagination-next /-->
+<!-- /wp:query-pagination --></main>
+<!-- /wp:query --></div>
+<!-- /wp:group -->

remote/patterns/posts-list.php

@@ -0,0 +1,38 @@
+<?php
+/**
+ * Title: Posts list
+ * Slug: remote/posts-list
+ * Categories: featured, query
+ * Block Types: query
+ */
+?>
+
+<!-- wp:group {"align":"full","layout":{"inherit":true}} -->
+<div class="wp-block-group alignfull"><!-- wp:query {"queryId":0,"query":{"perPage":10,"pages":0,"offset":0,"postType":"post","order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":true,"taxQuery":null},"tagName":"main","align":"wide"} -->
+<main class="wp-block-query alignwide"><!-- wp:post-template -->
+<!-- wp:separator {"className":"is-style-wide"} -->
+<hr class="wp-block-separator is-style-wide"/>
+<!-- /wp:separator -->
+
+<!-- wp:columns {"style":{"spacing":{"padding":{"top":"1em"}}}} -->
+<div class="wp-block-columns" style="padding-top:1em"><!-- wp:column {"verticalAlignment":"top","width":"10%","style":{"spacing":{"padding":{"top":"1em"}}}} -->
+<div class="wp-block-column is-vertically-aligned-top" style="padding-top:1em;flex-basis:10%"><!-- wp:post-date {"format":"M j","fontSize":"small"} /--></div>
+<!-- /wp:column -->
+
+<!-- wp:column {"verticalAlignment":"center","width":""} -->
+<div class="wp-block-column is-vertically-aligned-center"><!-- wp:post-title {"isLink":true,"style":{"spacing":{"margin":{"top":"0px","bottom":"0px"}},"typography":{"fontSize":"min(max(42px, 5vw), 72px)","lineHeight":"1.17"}}} /--></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns -->
+<!-- /wp:post-template -->
+
+<!-- wp:spacer {"height":"32px"} -->
+<div style="height:32px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+
+<!-- wp:query-pagination {"layout":{"type":"flex","justifyContent":"space-between","flexWrap":"nowrap","orientation":"horizontal"}} -->
+<!-- wp:query-pagination-previous /-->
+
+<!-- wp:query-pagination-next /-->
+<!-- /wp:query-pagination --></main>
+<!-- /wp:query --></div>
+<!-- /wp:group -->

remote/patterns/small-quote.php

@@ -0,0 +1,27 @@
+<?php
+/**
+ * Title: Small quote
+ * Slug: remote/small-quote
+ * Categories: featured, text
+ */
+?>
+
+<!-- wp:columns {"style":{"spacing":{"blockGap":"30px"}}} -->
+<div class="wp-block-columns"><!-- wp:column {"width":"50px","style":{"spacing":{"padding":{"top":"28px"}}}} -->
+<div class="wp-block-column" style="padding-top:28px;flex-basis:50px"><!-- wp:image {"width":48,"sizeSlug":"large","className":"is-style-rounded"} -->
+<figure class="wp-block-image size-large is-resized is-style-rounded"><img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/coworker.jpg" alt="<?php echo esc_attr__( 'Picture of a user', 'remote' ); ?>" width="48"/></figure>
+<!-- /wp:image --></div>
+<!-- /wp:column -->
+
+<!-- wp:column -->
+<div class="wp-block-column"><!-- wp:group {"style":{"spacing":{"blockGap":"30px","padding":{"top":"20px","bottom":"20px"}}}} -->
+<div class="wp-block-group" style="padding-top:20px;padding-bottom:20px"><!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.5"}},"fontSize":"normal"} -->
+<p class="has-normal-font-size" style="line-height:1.5"><?php echo esc_html__( 'Now that I’m working from home, I find that I am spending more time with my family, exercising more, and getting more sleep. This has not been at the expense of my productivity at work — if anything, my productivity has improved as well.', 'remote' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","lineHeight":"1.3"}},"fontSize":"small"} -->
+<p class="has-small-font-size" style="font-style:normal;font-weight:400;line-height:1.3"><?php echo esc_html__( '— Jane Adams', 'remote' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns -->

remote/patterns/subscribe.php

@@ -0,0 +1,19 @@
+<?php
+/**
+ * Title: Subscription form
+ * Slug: remote/subscribe
+ * Categories: featured, text
+ */
+?>
+
+<!-- wp:paragraph {"style":{"typography":{"textTransform":"uppercase"}},"fontSize":"small"} -->
+<p class="has-small-font-size" style="text-transform:uppercase"><?php echo esc_html__( 'Follow this blog', 'remote' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph -->
+<p><?php echo esc_html__( 'Sign up to have each new post delivered to your inbox.', 'remote' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:jetpack/subscriptions {"buttonBackgroundColor":"primary","textColor":"background","borderRadius":6,"borderColor":"primary","className":"is-style-split","style":{"spacing":{"margin":{"top":"1.45em"}}}} -->
+<div class="wp-block-jetpack-subscriptions wp-block-jetpack-subscriptions__supports-newline is-style-split" style="margin-top:1.45em">[jetpack_subscription_form show_subscribers_total="false" button_on_newline="false" custom_font_size="16px" custom_border_radius="6" custom_border_weight="1" custom_padding="15" custom_spacing="10" submit_button_classes="has-primary-border-color has-text-color has-background-color has-background has-primary-background-color" email_field_classes="has-primary-border-color" show_only_email_and_button="true" success_message="<?php echo esc_html__( 'Success! An email was just sent to confirm your subscription. Please find the email now and click \'Confirm Follow\' to start subscribing.', 'remote' ); ?>"]</div>
+<!-- /wp:jetpack/subscriptions -->

remote/patterns/tags.php

@@ -0,0 +1,12 @@
+<?php
+/**
+ * Title: Tags
+ * Slug: remote/tags
+ * Categories: featured, text
+ */
+?>
+
+<!-- wp:paragraph {"style":{"typography":{"textTransform":"uppercase"}},"fontSize":"small"} -->
+<p class="has-small-font-size" style="text-transform:uppercase"><?php echo esc_html__( 'Tags', 'remote' ); ?></p>
+<!-- /wp:paragraph -->
+<!-- wp:tag-cloud {"className":"is-style-outline"} /-->