Bundled Themes: Introduce block patterns for Twenty Seventeen.

Props melchoyce, kjellr, onemaggie, ryelle, beafialho, bridgetwillard, poena.
Fixes #51100.
Built from https://develop.svn.wordpress.org/trunk@49584


git-svn-id: http://core.svn.wordpress.org/trunk@49322 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-content/themes/twentyseventeen/functions.php

@@ -44,6 +44,11 @@ function twentyseventeen_setup() {
 	 */
 	add_theme_support( 'title-tag' );
 
+	/*
+	 * Enables custom line height for blocks
+	 */
+	add_theme_support( 'custom-line-height' );
+
 	/*
 	 * Enable support for Post Thumbnails on posts and pages.
 	 *
@@ -664,3 +669,8 @@ require get_parent_theme_file_path( '/inc/customizer.php' );
  * SVG icons functions and filters.
  */
 require get_parent_theme_file_path( '/inc/icon-functions.php' );
+
+/**
+ * Block Patterns.
+ */
+require get_template_directory() . '/inc/block-patterns.php';

wp-content/themes/twentyseventeen/inc/block-patterns.php

@@ -0,0 +1,199 @@
+<?php
+/**
+ * Twenty Twenty Theme: Block Patterns
+ *
+ * @package WordPress
+ * @subpackage Twenty_Seventeen
+ * @since Twenty Seventeen 2.4
+ */
+
+/**
+ * Register Block Pattern Category.
+ */
+if ( function_exists( 'register_block_pattern_category' ) ) {
+
+	register_block_pattern_category(
+		'twentyseventeen',
+		array( 'label' => __( 'Twenty Seventeen', 'twentyseventeen' ) )
+	);
+}
+
+/**
+ * Register Block Patterns.
+ */
+if ( function_exists( 'register_block_pattern' ) ) {
+	register_block_pattern(
+		'twentyseventeen/large-heading-with-button',
+		array(
+			'title'      => __( 'Large Heading with Button', 'twentyseventeen' ),
+			'categories' => array( 'twentyseventeen' ),
+			'content'    => '<!-- wp:heading {"level":1,"textColor":"black","style":{"typography":{"fontSize":50}}} -->
+            <h1 class="has-black-color has-text-color" style="font-size:50px">' . __( 'Attract Leads with Marketing Campaigns that Work', 'twentyseventeen' ) . '</h1>
+            <!-- /wp:heading -->
+
+            <!-- wp:buttons -->
+            <div class="wp-block-buttons"><!-- wp:button {"borderRadius":0,"className":"is-style-fill"} -->
+            <div class="wp-block-button is-style-fill"><a class="wp-block-button__link no-border-radius">' . __( 'Our Services', 'twentyseventeen' ) . '</a></div>
+            <!-- /wp:button --></div>
+            <!-- /wp:buttons -->',
+		)
+	);
+
+	register_block_pattern(
+		'twentyseventeen/images-with-text-and-link',
+		array(
+			'title'      => __( 'Images with Text and Link', 'twentyseventeen' ),
+			'categories' => array( 'twentyseventeen' ),
+			'content'    => '<!-- wp:spacer -->
+            <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
+            <!-- /wp:spacer -->
+            <!-- wp:columns -->
+            <div class="wp-block-columns"><!-- wp:column -->
+            <div class="wp-block-column">
+			<!-- wp:image {"className":"size-large"} -->
+			<figure class="wp-block-image size-large"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/stripes.jpg" alt="' . __( 'Black Stripes', 'twentyseventeen' ) . '"/></figure>
+			<!-- /wp:image -->
+            <!-- wp:heading {"textColor":"black","style":{"typography":{"fontSize":45}}} -->
+            <h2 class="has-black-color has-text-color" style="font-size:45px">' . __( 'Branding', 'twentyseventeen' ) . '</h2>
+            <!-- /wp:heading -->
+            <!-- wp:paragraph {"textColor":"black","style":{"typography":{"lineHeight":"1.8"}}} -->
+            <p class="has-black-color has-text-color" style="line-height:1.8">' . __( 'Communicate your purpose and goals with a beautiful logo that encapsulates your business.', 'twentyseventeen' ) . '</p>
+            <!-- /wp:paragraph -->
+            <!-- wp:paragraph {"style":{"typography":{"lineHeight":"3"}}} -->
+            <p style="line-height:3"><a href="#"><strong>' . __( 'See Case Study', 'twentyseventeen' ) . ' →</strong></a></p>
+            <!-- /wp:paragraph --></div>
+            <!-- /wp:column -->
+            <!-- wp:column -->
+            <div class="wp-block-column"><!-- wp:spacer {"height":254} -->
+            <div style="height:254px" aria-hidden="true" class="wp-block-spacer"></div>
+            <!-- /wp:spacer -->
+			<!-- wp:image {"className":"size-large"} -->
+			<figure class="wp-block-image size-large"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/white-border.jpg" alt="' . __( 'White border', 'twentyseventeen' ) . '"/></figure>
+			<!-- /wp:image -->
+            <!-- wp:heading {"textColor":"black","style":{"typography":{"fontSize":45}}} -->
+            <h2 class="has-black-color has-text-color" style="font-size:45px">' . __( 'Web Design', 'twentyseventeen' ) . '</h2>
+            <!-- /wp:heading -->
+            <!-- wp:paragraph {"textColor":"black","style":{"typography":{"lineHeight":"1.8"}}} -->
+            <p class="has-black-color has-text-color" style="line-height:1.8">' . __( 'Need a website? We&#39;ve got you covered. Our design team will create a stunning design to transform your brand.', 'twentyseventeen' ) . '</p>
+            <!-- /wp:paragraph -->
+            <!-- wp:paragraph {"style":{"typography":{"lineHeight":"3.0"}}} -->
+            <p style="line-height:3.0"><a href="#"><strong>' . __( 'See Case Study', 'twentyseventeen' ) . ' →</strong></a></p>
+            <!-- /wp:paragraph --></div>
+            <!-- /wp:column --></div>
+            <!-- /wp:columns -->',
+		)
+	);
+
+	register_block_pattern(
+		'twentyseventeen/images-with-link',
+		array(
+			'title'      => __( 'Images with Link', 'twentyseventeen' ),
+			'categories' => array( 'twentyseventeen' ),
+			'content'    => '<!-- wp:spacer -->
+            <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
+            <!-- /wp:spacer -->
+            <!-- wp:columns {"verticalAlignment":"top"} -->
+            <div class="wp-block-columns are-vertically-aligned-top"><!-- wp:column -->
+            <div class="wp-block-column"><!-- wp:group -->
+            <div class="wp-block-group"><div class="wp-block-group__inner-container">
+			<!-- wp:image {"align":"center","sizeSlug":"large","className":"is-style-default"} -->
+			<div class="wp-block-image is-style-default"><figure class="aligncenter size-large"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/stripes.jpg" alt="' . __( 'Black Stripes', 'twentyseventeen' ) . '"/></figure></div>
+			<!-- /wp:image -->
+            <!-- wp:heading {"align":"left","textColor":"black","style":{"typography":{"fontSize":30}}} -->
+            <h2 class="has-text-align-left has-black-color has-text-color" style="font-size:30px">' . __( 'Branding', 'twentyseventeen' ) . '</h2>
+            <!-- /wp:heading -->
+            <!-- wp:paragraph {"align":"left"} -->
+            <p class="has-text-align-left"><a href="#">' . __( 'See Case Study', 'twentyseventeen' ) . ' →</a></p>
+            <!-- /wp:paragraph --></div></div>
+            <!-- /wp:group --></div>
+            <!-- /wp:column -->
+            <!-- wp:column -->
+            <div class="wp-block-column"><!-- wp:group -->
+            <div class="wp-block-group"><div class="wp-block-group__inner-container">
+			<!-- wp:image {"align":"center","sizeSlug":"large","className":"is-style-default"} -->
+			<div class="wp-block-image is-style-default"><figure class="aligncenter size-large"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/white-border.jpg" alt="' . __( 'White border', 'twentyseventeen' ) . '"/></figure></div>
+			<!-- /wp:image -->
+            <!-- wp:heading {"align":"left","textColor":"black","style":{"typography":{"fontSize":30}}} -->
+            <h2 class="has-text-align-left has-black-color has-text-color" style="font-size:30px">' . __( 'Design', 'twentyseventeen' ) . '</h2>
+            <!-- /wp:heading -->
+            <!-- wp:paragraph {"align":"left"} -->
+            <p class="has-text-align-left"><a href="#">' . __( 'See Case Study', 'twentyseventeen' ) . ' →</a></p>
+            <!-- /wp:paragraph --></div></div>
+            <!-- /wp:group --></div>
+            <!-- /wp:column -->
+            <!-- wp:column -->
+            <div class="wp-block-column"><!-- wp:group -->
+            <div class="wp-block-group"><div class="wp-block-group__inner-container">
+			<!-- wp:image {"align":"center","sizeSlug":"large","className":"is-style-default"} -->
+			<div class="wp-block-image is-style-default"><figure class="aligncenter size-large"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/direct-light.jpg" alt="' . __( 'Direct Light', 'twentyseventeen' ) . '"/></figure></div>
+			<!-- /wp:image -->
+            <!-- wp:heading {"align":"left","textColor":"black","style":{"typography":{"fontSize":30}}} -->
+            <h2 class="has-text-align-left has-black-color has-text-color" style="font-size:30px">' . __( 'Strategy', 'twentyseventeen' ) . '</h2>
+            <!-- /wp:heading -->
+            <!-- wp:paragraph {"align":"left"} -->
+            <p class="has-text-align-left"><a href="#">' . __( 'See Case Study' ) . ' →</a></p>
+            <!-- /wp:paragraph --></div></div>
+            <!-- /wp:group --></div>
+            <!-- /wp:column --></div>
+            <!-- /wp:columns -->
+            <!-- wp:spacer -->
+            <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
+            <!-- /wp:spacer -->',
+		)
+	);
+
+	register_block_pattern(
+		'twentyseventeen/services',
+		array(
+			'title'      => __( 'Services', 'twentyseventeen' ),
+			'categories' => array( 'twentyseventeen' ),
+			'content'    => '<!-- wp:spacer -->
+            <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
+            <!-- /wp:spacer -->
+            
+            <!-- wp:heading {"level":1,"style":{"typography":{"fontSize":50}}} -->
+            <h1 style="font-size:50px">' . __( 'Our Services', 'twentyseventeen' ) . '</h1>
+            <!-- /wp:heading -->
+            
+            <!-- wp:columns -->
+            <div class="wp-block-columns"><!-- wp:column -->
+            <div class="wp-block-column">
+            <!-- wp:paragraph {"style":{"typography":{"fontSize":21, "lineHeight":"2.5"}}} -->
+            <p style="font-size:21px"><a href="#">' . __( 'Branding', 'twentyseventeen' ) . ' →</a><br><a href="#">' . __( 'Web Design', 'twentyseventeen' ) . ' →</a><br><a href="#">' . __( 'Web Development', 'twentyseventeen' ) . ' →</a></p>
+            <!-- /wp:paragraph -->
+            </div>
+            <!-- /wp:column -->
+            
+            <!-- wp:column -->
+            <div class="wp-block-column">
+            <!-- wp:paragraph {"style":{"typography":{"fontSize":21, "lineHeight":"2.5"}}} -->
+            <p style="font-size:21px"><a href="#">' . __( 'Content Strategy', 'twentyseventeen' ) . ' →</a><br><a href="#">' . __( 'Marketing &amp; SEO', 'twentyseventeen' ) . ' →</a><br><a href="#">' . __( 'Video Production', 'twentyseventeen' ) . ' →</a></p>
+            <!-- /wp:paragraph --></div>
+            <!-- /wp:column --></div>
+            <!-- /wp:columns -->
+            
+            <!-- wp:spacer -->
+            <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
+            <!-- /wp:spacer -->',
+		)
+	);
+
+	register_block_pattern(
+		'twentyseventeen/contact-us',
+		array(
+			'title'      => __( 'Contact Us', 'twentyseventeen' ),
+			'categories' => array( 'twentyseventeen' ),
+			'content'    => '<!-- wp:cover {"customOverlayColor":"#93aab8","minHeight":700,"align":"center"} -->
+            <div class="wp-block-cover aligncenter has-background-dim" style="background-color:#93aab8;min-height:700px"><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"left","textColor":"white","style":{"typography":{"fontSize":50}}} -->
+            <p class="has-text-align-left has-white-color has-text-color" style="font-size:50px">' . __( 'We are proud to serve outstanding clients.', 'twentyseventeen' ) . '</p>
+            <!-- /wp:paragraph -->
+            
+            <!-- wp:buttons -->
+            <div class="wp-block-buttons"><!-- wp:button {"borderRadius":0,"backgroundColor":"black","textColor":"white","className":"is-style-fill"} -->
+            <div class="wp-block-button is-style-fill"><a class="wp-block-button__link has-white-color has-black-background-color has-text-color has-background no-border-radius">' . __( 'Contact us', 'twentyseventeen' ) . '</a></div>
+            <!-- /wp:button --></div>
+            <!-- /wp:buttons --></div></div>
+            <!-- /wp:cover -->',
+		)
+	);
+}

wp-content/themes/twentyseventeen/readme.txt

@@ -4,7 +4,7 @@ Tested up to: 5.6
 Version: 2.4
 License: GPLv2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
-Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
+Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-patterns
 
 == Description ==
 
@@ -57,6 +57,15 @@ Bundled header image, Copyright Alvin Engler
 License: CC0 1.0 Universal (CC0 1.0)
 Source: https://unsplash.com/@englr?photo=bIhpiQA009k
 
+Bundled block pattern images, Copyright Solo Shutter
+License: CC0 1.0 Universal (CC0 1.0)
+Source: https://stocksnap.io/photo/striped-lines-BTNYMDDCBW
+        https://stocksnap.io/photo/striped-lines-5XWOPSWPWX
+
+Bundled block pattern image, Copyright Seacoast Sage
+License: CC0 1.0 Universal (CC0 1.0)
+Source: https://stocksnap.io/photo/striped-fabric-9CBVWF2CDU
+
 == Changelog ==
 
 = 2.4 =

wp-content/themes/twentyseventeen/style.css

@@ -10,7 +10,7 @@ Requires PHP: 5.2.4
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: twentyseventeen
-Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
+Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-patterns
 
 This theme, like WordPress, is licensed under the GPL.
 Use it to make something cool, have fun, and share what you've learned with others.

wp-includes/version.php

@@ -13,7 +13,7 @@
  *
  * @global string $wp_version
  */
-$wp_version = '5.6-beta3-49583';
+$wp_version = '5.6-beta3-49584';
 
 /**
  * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.