From 9223ee37284c58e99490d0d478a6f1bcf9d1974d Mon Sep 17 00:00:00 2001
From: Adam Wood <1017872+adamwoodnz@users.noreply.github.com>
Date: Mon, 8 Jan 2024 13:44:56 +1300
Subject: [PATCH] Adjust cell padding to improve ipad landscape layout

---
 .../src/site-meta-list/style.scss                 | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/source/wp-content/themes/wporg-showcase-2022/src/site-meta-list/style.scss b/source/wp-content/themes/wporg-showcase-2022/src/site-meta-list/style.scss
index 5b4a1d69..515a198d 100644
--- a/source/wp-content/themes/wporg-showcase-2022/src/site-meta-list/style.scss
+++ b/source/wp-content/themes/wporg-showcase-2022/src/site-meta-list/style.scss
@@ -16,6 +16,8 @@
 	}
 
 	tr {
+		vertical-align: baseline;
+
 		&:not(:last-of-type) {
 			border-bottom: 1px solid;
 			border-color: inherit;
@@ -23,16 +25,23 @@
 
 		th:not(.screen-reader-text),
 		td {
-			padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
+			padding-top: var(--wp--preset--spacing--10);
+			padding-bottom: var(--wp--preset--spacing--10);
 		}
 
-		th {
+		th:not(.screen-reader-text) {
 			font-weight: 400;
 			text-align: start;
+			min-width: 100px;
+			padding-inline-start: var(--wp--preset--spacing--20);
+			// Keep a letter space between the label and the value.
+			// Required on smaller screens where they're more likely to collide.
+			padding-inline-end: 0.5em;
 		}
 
 		td {
 			text-align: end;
+			padding-inline-end: var(--wp--preset--spacing--20);
 		}
 
 		@media (max-width: 380px) {
@@ -45,11 +54,13 @@
 
 			th:not(.screen-reader-text) {
 				padding-bottom: 0;
+				padding-inline-end: var(--wp--preset--spacing--20);
 			}
 
 			td {
 				text-align: start;
 				padding-top: 0;
+				padding-inline-start: var(--wp--preset--spacing--20);
 			}
 		}
 	}