switched to grid

quadrat/assets/theme.css

@@ -263,6 +263,14 @@ ul ul {
 	border-top: 1px solid var(--wp--custom--color--primary);
 	padding-top: 1.5em;
 	justify-content: space-between;
+	display: grid;
+	grid-template-areas: "prev numbers next";
+	grid-template-columns: 1fr 2fr 1fr;
+}
+
+.wp-block-query-pagination .wp-block-query-pagination-previous {
+	grid-area: prev;
+	justify-self: start;
 }
 
 .wp-block-query-pagination .wp-block-query-pagination-previous::before {
@@ -270,6 +278,11 @@ ul ul {
 	margin-right: 0.5em;
 }
 
+.wp-block-query-pagination .wp-block-query-pagination-next {
+	grid-area: next;
+	justify-self: end;
+}
+
 .wp-block-query-pagination .wp-block-query-pagination-next::after {
 	content: "→";
 	margin-left: 0.5em;
@@ -284,6 +297,11 @@ ul ul {
 	padding: 0 0.1em;
 }
 
+.wp-block-query-pagination .wp-block-query-pagination-numbers {
+	grid-area: numbers;
+	justify-self: center;
+}
+
 @media (max-width: 479px) {
 	.wp-block-query-pagination .wp-block-query-pagination-numbers {
 		display: none;

quadrat/sass/blocks/_query-navigation.scss

@@ -2,14 +2,25 @@
 	border-top: 1px solid var(--wp--custom--color--primary);
 	padding-top: 1.5em;
 	justify-content: space-between;
+	display: grid;
+	grid-template-areas: "prev numbers next";
+	grid-template-columns: 1fr 2fr 1fr;
 
-	.wp-block-query-pagination-previous::before{
-		content:"←";
-		margin-right: 0.5em;
+	.wp-block-query-pagination-previous {
+		grid-area: prev;
+		justify-self: start;
+		&::before{
+			content:"←";
+			margin-right: 0.5em;
+		}
 	}
-	.wp-block-query-pagination-next::after{
-		content:"→";
-		margin-left: 0.5em;
+	.wp-block-query-pagination-next {
+		grid-area: next;
+		justify-self: end;
+		&::after{
+			content:"→";
+			margin-left: 0.5em;
+		}
 	}
 
 	.wp-block-query-pagination-previous::before,
@@ -22,6 +33,8 @@
 	}
 
 	.wp-block-query-pagination-numbers{
+		grid-area: numbers;
+		justify-self: center;
 		@include break-mobile-only(){
 			display: none;
 		}