浏览代码

Skatepark: new Home template (#5491)

* create skatepark homepage

* Change the site's wide width for better wrapping.

Co-authored-by: Kjell Reigstad <kjell@kjellr.com>
Maggie 3 年之前
父节点
当前提交
1ae2e1bbaa

+ 27 - 0
skatepark/block-templates/home.html

@@ -0,0 +1,27 @@
+<!-- wp:template-part {"slug":"header","tagName":"header"} /-->
+
+<!-- wp:group {"tagName":"main","style":{"spacing":{"padding":{"top":"4em","bottom":"2.5em"}}}} -->
+<main class="wp-block-group" style="padding-top:4em;padding-bottom:2.5em">
+	
+	<!-- wp:group {"layout":{"inherit":true}} -->
+	<div class="wp-block-group">
+		<!-- wp:pattern {"slug":"skatepark/home-patterns"} /-->
+
+		<!-- wp:spacer {"height":"80px"} -->
+		<div style="height:80px" aria-hidden="true" class="wp-block-spacer"></div>
+		<!-- /wp:spacer -->
+
+		<!-- wp:pattern {"slug":"skatepark/columns-in-container"} /-->
+
+		<!-- wp:spacer {"height":"80px"} -->
+		<div style="height:80px" aria-hidden="true" class="wp-block-spacer"></div>
+		<!-- /wp:spacer -->
+
+		<!-- wp:pattern {"slug":"skatepark/text-list-with-button"} /-->
+	</div>
+	<!-- /wp:group -->
+
+</main>
+<!-- /wp:group -->
+
+<!-- wp:template-part {"slug":"footer","tagName":"footer","className":"site-footer-container"} /-->

+ 1 - 0
skatepark/inc/block-patterns.php

@@ -22,6 +22,7 @@ if ( ! function_exists( 'skatepark_register_block_patterns' ) ) :
 				'mixed-media-in-container',
 				'text-list-with-button',
 				'full-width-image-with-aside-caption',
+				'home-patterns',
 				'testimonial',
 				'two-columns-of-text',
 				'paragraph-with-quote',

+ 48 - 0
skatepark/inc/patterns/home-patterns.php

@@ -0,0 +1,48 @@
+<?php
+/**
+ * Block patterns for home page.
+ *
+ * @package Skatepark
+ * @since 1.0.0
+ * 
+ */
+
+return array(
+	'title'      => __( 'Block patterns for home page', 'skatepark' ),
+	'categories' => array( 'skatepark' ),
+	'inserter'   => false,
+	'content'    => '<!-- wp:heading {"level":1,"align":"wide","style":{"spacing":{"margin":{"bottom":"calc(var(--wp--custom--gap--vertical) * 3)"}}}} -->
+	<h1 class="alignwide" style="margin-bottom:calc(var(--wp--custom--gap--vertical) * 3)">' . esc_html__( 'Empowering at-risk youth through skateboarding', 'skatepark' ) . '</h1>
+	<!-- /wp:heading -->
+
+	<!-- wp:image {"align":"full","className":"alignfull size-large"} -->
+	<figure class="wp-block-image alignfull size-large"><img src="' . get_stylesheet_directory_uri() . '/assets/images/skatepark.jpg" alt="' . esc_attr__( "A skateboarder does a grab trick in a bowl-shaped skate park. In the background is a watching crowd, palm trees, and the ocean.", 'skatepark' ) . '"/></figure>
+	<!-- /wp:image -->
+	
+	<!-- wp:heading {"level":5,"align":"wide","style":{"spacing":{"margin":{"top":"calc(var(--wp--custom--gap--vertical) * 3)","bottom":"var(--wp--custom--gap--vertical)"}}}} -->
+	<h5 class="alignwide" style="margin-top:calc(var(--wp--custom--gap--vertical) * 3);margin-bottom:var(--wp--custom--gap--vertical)">' . esc_html__( 'Latest posts', 'skatepark' ) . '</h5>
+	<!-- /wp:heading -->
+	
+	<!-- wp:query {"query":{"perPage":3,"pages":0,"offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"exclude","inherit":false},"displayLayout":{"type":"flex","columns":3},"align":"wide"} -->
+	<div class="wp-block-query alignwide"><!-- wp:post-template -->
+	<!-- wp:group {"style":{"spacing":{"padding":{"top":"30px"}}},"layout":{"inherit":false}} -->
+	<div class="wp-block-group" style="padding-top:30px"><!-- wp:separator {"className":"is-style-wide"} -->
+	<hr class="wp-block-separator is-style-wide"/>
+	<!-- /wp:separator -->
+
+	<!-- wp:post-featured-image {"isLink":true} /-->
+
+	<!-- wp:post-title {"isLink":true,"style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--normal)"}}} /-->
+
+	<!-- wp:post-excerpt {"moreText":"' . esc_html__( 'Continue reading', 'skatepark' ) . '"} /-->
+
+	<!-- wp:post-date {"style":{"typography":{"fontSize":"16px","fontWeight":"500"}},"isLink":true} /--></div>
+	<!-- /wp:group -->
+	<!-- /wp:post-template -->
+
+	<!-- wp:query-pagination -->
+	<!-- wp:query-pagination-previous /-->
+	<!-- wp:query-pagination-next /-->
+	<!-- /wp:query-pagination --></div>
+	<!-- /wp:query -->'
+);

+ 2 - 2
skatepark/theme.json

@@ -197,7 +197,7 @@
 			},
 			"layout": {
 				"contentSize": "684px",
-				"wideSize": "1194px"
+				"wideSize": "1160px"
 			},
 			"line-height": {
 				"body": 1.6
@@ -205,7 +205,7 @@
 		},
 		"layout": {
 			"contentSize": "684px",
-			"wideSize": "1194px"
+			"wideSize": "1160px"
 		},
 		"typography": {
 			"customFontSize": true,