Geologist: Add block patterns (#4623)

* Geologist: Add block patterns

* Add pattern files

* Update styles for block patterns

* Update content for block patterns

* fix quote markup

* adding textdomain

* add paragraph block comments

* add image to repo

geologist/assets/theme.css

@@ -295,8 +295,12 @@ ul ul {
 	background-color: var(--wp--preset--color--tertiary);
 }
 
-.wp-block-pullquote.is-style-solid-color {
-	padding: var(--wp--custom--gap--horizontal);
+.wp-block-pullquote {
+	text-indent: -0.5ch;
+}
+
+.wp-block-pullquote cite {
+	text-indent: 0.5ch;
 }
 
 .has-primary-background-color {

geologist/child-theme.json

@@ -297,14 +297,16 @@
 			"core/pullquote": {
 				"typography": {
 					"fontStyle": "normal",
-					"fontSize": "var(--wp--preset--font-size--huge)",
-					"fontWeight": "400",
+					"fontSize": "var(--wp--preset--font-size--extra-large)",
+					"fontWeight": "500",
 					"lineHeight": "1.4"
 				},
 				"spacing": {
 					"padding": {
-						"left": "0px",
-						"right": "0px"
+						"bottom": "calc( var(--wp--custom--gap--horizontal) * 3 )",
+						"left": "calc( var(--wp--custom--gap--horizontal) * 3 )",
+						"right": "calc( var(--wp--custom--gap--horizontal) * 3 )",
+						"top": "calc( var(--wp--custom--gap--horizontal) * 3 )"
 					}
 				},
 				"border": {

geologist/functions.php

@@ -22,3 +22,7 @@ function newtheme_scripts() {
 }
 add_action( 'wp_enqueue_scripts', 'newtheme_scripts' );
 
+/**
+ * Block Patterns.
+ */
+require get_stylesheet_directory() . '/inc/block-patterns.php';

geologist/inc/block-patterns.php

@@ -0,0 +1,43 @@
+<?php
+/**
+ * Geologist Theme: Block Patterns
+ *
+ * @package Geologist
+ * @since   1.0.0
+ */
+if ( ! function_exists( 'geologist_register_block_patterns' ) ) :
+
+	function geologist_register_block_patterns() {
+
+		if ( function_exists( 'register_block_pattern_category' ) ) {
+			register_block_pattern_category(
+				'geologist',
+				array( 'label' => __( 'Geologist', 'geologist' ) )
+			);
+		}
+
+		if ( function_exists( 'register_block_pattern' ) ) {
+			$block_patterns = array(
+				'authors',
+				'image-feature',
+				'introduction',
+				'quote',
+				'two-featured-posts',
+			);
+
+			if ( class_exists( 'WP_Block_Type_Registry' ) && \WP_Block_Type_Registry::get_instance()->is_registered( 'jetpack/subscriptions' ) ) {
+				$block_patterns[] = 'email-updates-large';
+				$block_patterns[] = 'email-updates-small';
+			}
+
+			foreach ( $block_patterns as $block_pattern ) {
+				register_block_pattern(
+					'geologist/' . $block_pattern,
+					require __DIR__ . '/patterns/' . $block_pattern . '.php'
+				);
+			}
+		}
+	}
+endif;
+
+add_action( 'init', 'geologist_register_block_patterns', 9 );

geologist/inc/patterns/authors.php

@@ -0,0 +1,49 @@
+<?php
+/**
+ * Authors
+ *
+ * @package Geologist
+ */
+
+return array(
+	'title'      => __( 'Authors', 'geologist' ),
+	'categories' => array( 'geologist' ),
+	'blockTypes' => array( 'core/post-author' ),
+	'content'    => '<!-- wp:paragraph -->
+	<p>' . esc_html__( 'About the Authors:', 'geologist' ) . '</p>
+	<!-- /wp:paragraph -->
+
+	<!-- wp:columns -->
+<div class="wp-block-columns"><!-- wp:column -->
+<div class="wp-block-column"><!-- wp:heading -->
+<h2>' . esc_html__( 'Sarah Edwards', 'geologist' ) . '</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph -->
+<p>' . esc_html__( 'Sarah is a geologist at Anthem State University. Her love for all things underground was sparked in Kindergarten when she unearthed a toy that someone left buried in the sandbox.', 'geologist' ) . '</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:social-links {"iconColor":"primary","iconColorValue":"#F5F0E5","className":"is-style-logos-only"} -->
+<ul class="wp-block-social-links has-icon-color is-style-logos-only"><!-- wp:social-link {"url":"wordpress.com","service":"wordpress"} /-->
+
+<!-- wp:social-link {"url":"instagram.com","service":"instagram"} /--></ul>
+<!-- /wp:social-links --></div>
+<!-- /wp:column -->
+
+<!-- wp:column -->
+<div class="wp-block-column"><!-- wp:heading -->
+<h2>' . esc_html__( 'Angelo Ortiz', 'geologist' ) . '</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph -->
+<p>' . esc_html__( 'Angelo is an independent researcher and hobbyist. His collection of gemstones rivals that of some museums. Angelo is always on the lookout for a new discovery, and carries his toolkit everywhere.', 'geologist' ) . '</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:social-links {"iconColor":"primary","iconColorValue":"#F5F0E5","className":"is-style-logos-only"} -->
+<ul class="wp-block-social-links has-icon-color is-style-logos-only"><!-- wp:social-link {"url":"instagram.com","service":"instagram"} /-->
+
+<!-- wp:social-link {"url":"twitter.com","service":"twitter"} /--></ul>
+<!-- /wp:social-links --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns -->',
+);

geologist/inc/patterns/email-updates-large.php

@@ -0,0 +1,19 @@
+<?php
+/**
+ * Email Updates (Large)
+ *
+ * @package Geologist
+ */
+
+return array(
+	'title'      => __( 'Email Updates (Large)', 'geologist' ),
+	'categories' => array( 'geologist' ),
+	'blockTypes' => array( 'core/query' ),
+	'content'    => '<!-- wp:heading {"level":3} -->
+	<h3>' . esc_html__( 'Our newsletter rocks! Sign up here to receive every post in your inbox.', 'geologist' ) . '</h3>
+	<!-- /wp:heading -->
+
+	<!-- wp:jetpack/subscriptions -->
+	<div class="wp-block-jetpack-subscriptions wp-block-jetpack-subscriptions__supports-newline">[jetpack_subscription_form show_subscribers_total="false" button_on_newline="false" custom_font_size="16px" custom_border_radius="0" custom_border_weight="1" custom_padding="15" custom_spacing="10" submit_button_classes="" email_field_classes="" show_only_email_and_button="true"]</div>
+	<!-- /wp:jetpack/subscriptions -->',
+);

geologist/inc/patterns/email-updates-small.php

@@ -0,0 +1,16 @@
+<?php
+/**
+ * Email Updates (Small)
+ *
+ * @package Geologist
+ */
+
+return array(
+	'title'      => __( 'Email Updates (small)', 'geologist' ),
+	'categories' => array( 'geologist' ),
+	'blockTypes' => array( 'jetpack/subscriptions' ),
+	'content'    => '<!-- wp:paragraph --><p>' . esc_html__( 'Receive every post in your inbox.', 'geologist' ) . '</p><!-- /wp:paragraph -->
+	<!-- wp:jetpack/subscriptions -->
+	<div class="wp-block-jetpack-subscriptions wp-block-jetpack-subscriptions__supports-newline">[jetpack_subscription_form show_subscribers_total="false" button_on_newline="false" custom_font_size="16px" custom_border_radius="0" custom_border_weight="1" custom_padding="15" custom_spacing="10" submit_button_classes="" email_field_classes="" show_only_email_and_button="true"]</div>
+	<!-- /wp:jetpack/subscriptions -->',
+);

geologist/inc/patterns/image-feature.php

@@ -0,0 +1,29 @@
+<?php
+/**
+ * Two posts with features images in a query block.
+ *
+ * @package Geologist
+ */
+
+return array(
+	'title'      => __( 'Image feature', 'geologist' ),
+	'categories' => array( 'geologist' ),
+	'blockTypes' => array( 'core/image', 'core/columns' ),
+	'content'    => '<!-- wp:image {"align":"wide","sizeSlug":"large"} -->
+	<figure class="wp-block-image alignwide size-large"><img src="/assets/images/gem.jpeg" alt=""/></figure>
+	<!-- /wp:image -->
+
+	<!-- wp:columns {"align":"wide"} -->
+	<div class="wp-block-columns alignwide"><!-- wp:column -->
+	<div class="wp-block-column"><!-- wp:heading {"level":3} -->
+	<h3>' . esc_html__( 'Geologist', 'geologist' ) . '</h3>
+	<!-- /wp:heading --></div>
+	<!-- /wp:column -->
+
+	<!-- wp:column -->
+	<div class="wp-block-column"><!-- wp:paragraph -->
+	<p>' . esc_html__( "Geologist is a blog dedicated to everything buried under the earth's surface.", 'geologist' ) . '</p>
+	<!-- /wp:paragraph --></div>
+	<!-- /wp:column --></div>
+	<!-- /wp:columns -->',
+);

geologist/inc/patterns/introduction.php

@@ -0,0 +1,15 @@
+<?php
+/**
+ * Two posts with features images in a query block.
+ *
+ * @package Geologist
+ */
+
+return array(
+	'title'      => __( 'Introduction', 'geologist' ),
+	'categories' => array( 'geologist' ),
+	'blockTypes' => array( 'core/cover', 'core/header' ),
+	'content'    => '<!-- wp:heading {"level":3} -->
+	<h3>' . esc_html__( "Geologist is a blog dedicated to everything buried under the earth's surface.", 'geologist' ) . '</h3>
+	<!-- /wp:heading -->',
+);

geologist/inc/patterns/quote.php

@@ -0,0 +1,15 @@
+<?php
+/**
+ * Two posts with features images in a query block.
+ *
+ * @package Geologist
+ */
+
+return array(
+	'title'      => __( 'Quote', 'geologist' ),
+	'categories' => array( 'geologist' ),
+	'blockTypes' => array( 'core/pullquote' ),
+	'content'    => '<!-- wp:pullquote {"textColor":"background","className":"has-background-color has-primary-background-color has-text-color has-background"} -->
+	<figure class="wp-block-pullquote has-background-color has-primary-background-color has-text-color has-background"><blockquote class="has-text-color has-background-color"><p>“' . esc_html__( 'Amazonite, Ametrine, Beryl, Dioptase, Howlite, Jade, and Ruby.', 'geologist' ) . '”</p><cite>' . esc_html__( 'Sarah Edwards', 'geologist' ) . '</cite></blockquote></figure>
+	<!-- /wp:pullquote -->'
+);

geologist/inc/patterns/two-featured-posts.php

@@ -0,0 +1,23 @@
+<?php
+/**
+ * Two posts with features images in a query block.
+ *
+ * @package Geologist
+ */
+
+return array(
+	'title'      => __( 'Two featured posts', 'geologist' ),
+	'categories' => array( 'geologist' ),
+	'blockTypes' => array( 'core/query' ),
+	'content'    => '<!-- wp:query {"queryId":14,"query":{"perPage":2,"pages":0,"offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"exclude","inherit":false},"displayLayout":{"type":"flex","columns":2}} -->
+	<div class="wp-block-query"><!-- wp:post-template -->
+	<!-- wp:post-featured-image {"isLink":true} /-->
+
+	<!-- wp:post-title {"isLink":true} /-->
+
+	<!-- wp:post-excerpt /-->
+
+	<!-- wp:post-date /-->
+	<!-- /wp:post-template --></div>
+	<!-- /wp:query -->',
+);

geologist/sass/blocks/_pullquote.scss

@@ -1,3 +1,7 @@
-.wp-block-pullquote.is-style-solid-color {
-	padding: var(--wp--custom--gap--horizontal);
-}
+.wp-block-pullquote {
+	text-indent: -0.5ch;
+
+	cite {
+		text-indent: 0.5ch;
+	}
+}

geologist/theme.json

@@ -462,16 +462,16 @@
 				},
 				"typography": {
 					"fontStyle": "normal",
-					"fontSize": "var(--wp--preset--font-size--huge)",
-					"fontWeight": "400",
+					"fontSize": "var(--wp--preset--font-size--extra-large)",
+					"fontWeight": "500",
 					"lineHeight": "1.4"
 				},
 				"spacing": {
 					"padding": {
-						"left": "0px",
-						"right": "0px",
-						"top": "var(--wp--custom--gap--horizontal)",
-						"bottom": "var(--wp--custom--gap--horizontal)"
+						"left": "calc( var(--wp--custom--gap--horizontal) * 3 )",
+						"right": "calc( var(--wp--custom--gap--horizontal) * 3 )",
+						"top": "calc( var(--wp--custom--gap--horizontal) * 3 )",
+						"bottom": "calc( var(--wp--custom--gap--horizontal) * 3 )"
 					}
 				}
 			},