Browse Source

Tenaz: Use one query block per section in front page template

Grant Kinney 1 year ago
parent
commit
024cb7735a
2 changed files with 27 additions and 45 deletions
  1. 13 44
      tenaz/patterns/latest-posts.php
  2. 14 1
      tenaz/style.css

+ 13 - 44
tenaz/patterns/latest-posts.php

@@ -10,59 +10,28 @@
 	<!-- wp:group {"align":"wide","style":{"border":{"bottom":{"color":"var:preset|color|contrast","style":"solid","width":"3px"}},"spacing":{"margin":{"bottom":"var:preset|spacing|50"}}},"layout":{"type":"default"}} -->
 	<div class="wp-block-group alignwide" style="border-bottom-color:var(--wp--preset--color--contrast);border-bottom-style:solid;border-bottom-width:3px;margin-bottom:var(--wp--preset--spacing--50)">
 		<!-- wp:heading {"style":{"typography":{"textTransform":"uppercase"}},"fontSize":"medium"} -->
-		<h2 class="wp-block-heading has-medium-font-size" style="text-transform:uppercase"><?php echo  esc_html__( 'Latest', 'tenaz' ); ?></h2>
+		<h2 class="wp-block-heading has-medium-font-size" style="text-transform:uppercase"><?php echo esc_html__( 'Latest', 'tenaz' ); ?></h2>
 		<!-- /wp:heading -->
 	</div>
 	<!-- /wp:group -->
 
-	<!-- wp:columns {"align":"wide"} -->
-	<div class="wp-block-columns alignwide">
-		<!-- wp:column -->
-		<div class="wp-block-column">
-			<!-- wp:query {"query":{"perPage":"1","pages":0,"offset":0,"postType":"post","order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":false},"displayLayout":{"type":"list"}} -->
-			<div class="wp-block-query">
-				<!-- wp:post-template -->
-					<!-- wp:post-featured-image {"isLink":true,"aspectRatio":"3/2","style":{"spacing":{"margin":{"bottom":"var:preset|spacing|40"}}}} /-->
+	<!-- wp:query {"queryId":9,"query":{"perPage":"5","pages":0,"offset":0,"postType":"post","order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":false},"align":"wide","className":"query-latest-posts"} -->
+	<div class="wp-block-query alignwide query-latest-posts">
+		<!-- wp:post-template {"layout":{"type":"grid","columnCount":"4"}} -->
+			<!-- wp:post-featured-image {"isLink":true,"aspectRatio":"3/2","style":{"spacing":{"margin":{"bottom":"var:preset|spacing|40"}}}} /-->
 
-					<!-- wp:group {"style":{"spacing":{"blockGap":"0.5rem"}},"layout":{"type":"constrained"}} -->
-					<div class="wp-block-group">
-						<!-- wp:post-terms {"term":"category","style":{"elements":{"link":{"color":[],":hover":{"color":{"text":"var:preset|color|primary"}}}},"color":[]},"textColor":"contrast"} /-->
+			<!-- wp:group {"style":{"spacing":{"blockGap":"0.5rem"}},"layout":{"type":"constrained"}} -->
+			<div class="wp-block-group"><!-- wp:post-terms {"term":"category","style":{"elements":{"link":{"color":[],":hover":{"color":{"text":"var:preset|color|primary"}}}},"color":[]},"textColor":"contrast"} /-->
 
-						<!-- wp:post-title {"isLink":true,"style":{"spacing":[],"elements":{"link":{"color":[],":hover":{"color":{"text":"var:preset|color|primary"}}}},"color":[],"typography":{"fontStyle":"normal","fontWeight":"400"}},"textColor":"contrast","fontSize":"x-large"} /-->
+				<!-- wp:post-title {"isLink":true,"style":{"spacing":[],"elements":{"link":{"color":[],":hover":{"color":{"text":"var:preset|color|primary"}}}},"color":[],"typography":{"fontStyle":"normal","fontWeight":"400"}},"textColor":"contrast"} /-->
 
-						<!-- wp:post-excerpt {"style":{"typography":{"lineHeight":"1.5"}},"fontSize":"small"} /-->
+				<!-- wp:post-excerpt {"style":{"typography":{"lineHeight":"1.5"}},"fontSize":"small"} /-->
 
-						<!-- wp:post-author-name {"isLink":true} /-->
-					</div>
-					<!-- /wp:group -->
-				<!-- /wp:post-template -->
+				<!-- wp:post-author-name {"isLink":true} /-->
 			</div>
-			<!-- /wp:query -->
-		</div>
-		<!-- /wp:column -->
-
-		<!-- wp:column -->
-		<div class="wp-block-column">
-			<!-- wp:query {"query":{"perPage":"4","pages":0,"offset":"1","postType":"post","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,"aspectRatio":"3/2","style":{"spacing":{"margin":{"bottom":"var:preset|spacing|40"}}}} /-->
-
-					<!-- wp:group {"style":{"spacing":{"blockGap":"0.25rem"}},"layout":{"type":"constrained"}} -->
-					<div class="wp-block-group">
-						<!-- wp:post-terms {"term":"category","fontSize":"x-small"} /-->
-
-						<!-- wp:post-title {"isLink":true,"style":{"typography":{"fontStyle":"normal","fontWeight":"400"}},"fontSize":"medium"} /-->
-
-						<!-- wp:post-author-name {"isLink":true,"fontSize":"x-small"} /-->
-					</div>
-					<!-- /wp:group -->
-				<!-- /wp:post-template -->
-			</div>
-			<!-- /wp:query -->
-		</div>
-		<!-- /wp:column -->
+			<!-- /wp:group -->
+		<!-- /wp:post-template -->
 	</div>
-	<!-- /wp:columns -->
+	<!-- /wp:query -->
 </div>
 <!-- /wp:group -->

+ 14 - 1
tenaz/style.css

@@ -10,7 +10,7 @@ Requires PHP: 5.7
 Version: 1.0.5
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
-Template: 
+Template:
 Text Domain: tenaz
 Tags: blog, two-columns, wide-blocks, block-patterns, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, full-site-editing, template-editing, rtl-language-support, threaded-comments, translation-ready
 Status: inactive
@@ -47,3 +47,16 @@ Status: inactive
 .wp-block-pullquote p {
 	margin: 0;
 }
+
+.wp-block-query.query-latest-posts .wp-block-post:first-child {
+	grid-row: span 2;
+	grid-column: span 2;
+}
+
+.wp-block-query.query-latest-posts .wp-block-post:not(:first-child) .wp-block-post-title {
+	font-size: var(--wp--preset--font-size--medium);
+}
+
+.wp-block-query.query-latest-posts .wp-block-post:not(:first-child) .wp-block-post-excerpt {
+	display: none;
+}