Kansei: Fix query pagination (#7656)

Automattic · Feb 22, 2024 · 1182a0d · 1182a0d
1 parent af95866
commit 1182a0d
Show file tree

Hide file tree

Showing 6 changed files with 33 additions and 28 deletions.
diff --git a/kansei/patterns/query-pagination.php b/kansei/patterns/query-pagination.php
diff --git a/kansei/templates/404.html b/kansei/templates/404.html
@@ -16,13 +16,17 @@
 
 			<!-- wp:column {"verticalAlignment":"top","width":"60%"} -->
 			<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:60%">
-				<!-- wp:pattern {"slug":"kansei/404"} /-->
+				<!-- wp:group {"style":{"spacing":{"padding":{"right":"var:preset|spacing|80"}}},"layout":{"type":"constrained"}} -->
+				<div class="wp-block-group" style="padding-right:var(--wp--preset--spacing--80)">
+					<!-- wp:pattern {"slug":"kansei/404"} /-->
 
-				<!-- wp:spacer {"height":"50px"} -->
-				<div style="height:50px" aria-hidden="true" class="wp-block-spacer"></div>
-				<!-- /wp:spacer -->
+					<!-- wp:spacer {"height":"50px"} -->
+					<div style="height:50px" aria-hidden="true" class="wp-block-spacer"></div>
+					<!-- /wp:spacer -->
 
-				<!-- wp:pattern {"slug":"kansei/search-field"} /-->
+					<!-- wp:pattern {"slug":"kansei/search-field"} /-->
+				</div>
+				<!-- /wp:group -->
 			</div>
 			<!-- /wp:column --></div>
 <!-- /wp:columns --></div>

diff --git a/kansei/templates/archive.html b/kansei/templates/archive.html
@@ -16,7 +16,11 @@
 				<div class="wp-block-column" style="flex-basis:40%">
 					<!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap","verticalAlignment":"top"}} -->
 					<div class="wp-block-group">
-						<!-- wp:pattern {"slug":"kansei/query-pagination"} /-->
+						<!-- wp:query-pagination {"paginationArrow":"arrow"} -->
+							<!-- wp:query-pagination-previous {"label":"Prev"} /-->
+
+							<!-- wp:query-pagination-next {"label":"Next"} /-->
+						<!-- /wp:query-pagination -->
 					</div>
 					<!-- /wp:group -->
 				</div>

diff --git a/kansei/templates/index.html b/kansei/templates/index.html
@@ -16,7 +16,11 @@
 				<div class="wp-block-column" style="flex-basis:40%">
 					<!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap","verticalAlignment":"top"}} -->
 					<div class="wp-block-group">
-						<!-- wp:pattern {"slug":"kansei/query-pagination"} /-->
+						<!-- wp:query-pagination {"paginationArrow":"arrow"} -->
+							<!-- wp:query-pagination-previous {"label":"Prev"} /-->
+
+							<!-- wp:query-pagination-next {"label":"Next"} /-->
+						<!-- /wp:query-pagination -->
 					</div>
 					<!-- /wp:group -->
 				</div>

diff --git a/kansei/templates/page.html b/kansei/templates/page.html
@@ -18,13 +18,17 @@
 
 			<!-- wp:column {"width":"60%"} -->
 			<div class="wp-block-column" style="flex-basis:60%">
-				<!-- wp:post-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"700"}}} /-->
+				<!-- wp:group {"style":{"spacing":{"padding":{"right":"var:preset|spacing|80"}}},"layout":{"type":"constrained"}} -->
+				<div class="wp-block-group" style="padding-right:var(--wp--preset--spacing--80)">
+					<!-- wp:post-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"700"}}} /-->
 
-				<!-- wp:spacer {"height":"50px"} -->
-				<div style="height:50px" aria-hidden="true" class="wp-block-spacer"></div>
-				<!-- /wp:spacer -->
+					<!-- wp:spacer {"height":"50px"} -->
+					<div style="height:50px" aria-hidden="true" class="wp-block-spacer"></div>
+					<!-- /wp:spacer -->
 
-				<!-- wp:post-content /-->
+					<!-- wp:post-content {"layout":{"type":"default"}} /-->
+				</div>
+				<!-- /wp:group -->
 			</div>
 			<!-- /wp:column -->
 		</div>

diff --git a/kansei/templates/search.html b/kansei/templates/search.html
@@ -16,7 +16,11 @@
 				<div class="wp-block-column" style="flex-basis:40%">
 					<!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap","verticalAlignment":"top"}} -->
 					<div class="wp-block-group">
-						<!-- wp:pattern {"slug":"kansei/query-pagination"} /-->
+						<!-- wp:query-pagination {"paginationArrow":"arrow"} -->
+							<!-- wp:query-pagination-previous {"label":"Prev"} /-->
+
+							<!-- wp:query-pagination-next {"label":"Next"} /-->
+						<!-- /wp:query-pagination -->
 					</div>
 					<!-- /wp:group -->
 				</div>