From 7b0af8ed7ec7df6d8f3a7dbb7dee8e9f02b8cb98 Mon Sep 17 00:00:00 2001
From: Bradley Shellnut <bradleyshellnut@pm.me>
Date: Mon, 31 Oct 2022 10:25:02 -0500
Subject: [PATCH] Padding to the hidden description content.

---
 src/routes/game/[id]/+page.svelte | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/routes/game/[id]/+page.svelte b/src/routes/game/[id]/+page.svelte
index 49017cc..5f21e04 100644
--- a/src/routes/game/[id]/+page.svelte
+++ b/src/routes/game/[id]/+page.svelte
@@ -92,13 +92,13 @@
 	</div>
 </section>
 {#if firstParagraphEnd > 0}
-	<section class="description first-paragraph" style="margin-top: 2rem;">
+	<section class="description" style="margin-top: 2rem;">
 		{@html game?.description?.substring(0, firstParagraphEnd)}
 	</section>
 	{#if game?.description?.substring(firstParagraphEnd + 1) !== ''}
 		<section class="description">
 			{#if seeMore}
-				<div in:fly={{ opacity: 0, x: 100 }} out:fade>
+				<div class="overflow-description" in:fly={{ opacity: 0, x: 100 }} out:fade>
 					{@html game?.description?.substring(firstParagraphEnd + 1)}
 				</div>
 			{/if}
@@ -181,9 +181,15 @@
 		margin: 1rem;
 	}
 
+	.overflow-description {
+		display: grid;
+		gap: 1.5rem;
+	}
+
 	.with-icon {
-		display: flex;
-		flex-wrap: wrap;
+		display: grid;
+		grid-template-columns: repeat(2, auto);
+		/* flex-wrap: wrap; */
 		place-items: center;
 		gap: 1rem;
 	}