From b097b2511656eb02396a00b44ba95d8d77947e15 Mon Sep 17 00:00:00 2001
From: iCrawl <buechler.noel@outlook.com>
Date: Sat, 25 Mar 2023 14:55:15 +0100
Subject: [PATCH] fix(website): package / version select spacing

---
 .../src/app/docs/packages/[package]/page.tsx   | 18 +++++++++---------
 apps/website/src/app/docs/packages/page.tsx    | 18 +++++++++---------
 2 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/apps/website/src/app/docs/packages/[package]/page.tsx b/apps/website/src/app/docs/packages/[package]/page.tsx
index a3d582ca2..df692f098 100644
--- a/apps/website/src/app/docs/packages/[package]/page.tsx
+++ b/apps/website/src/app/docs/packages/[package]/page.tsx
@@ -27,9 +27,9 @@ export default async function Page({ params }: { params: { package: string } })
 	const data = await getData(params.package);
 
 	return (
-		<div className="min-w-xs sm:w-md mx-auto flex min-h-screen flex-row place-content-center place-items-center gap-8 py-0 px-4 lg:py-8 lg:px-6">
-			<div className="flex grow flex-col place-content-center gap-4">
-				<h1 className="text-2xl font-semibold">Select a version:</h1>
+		<div className="min-w-xs sm:w-md mx-auto flex min-h-screen flex-col gap-8 py-6 px-4 lg:py-6 lg:px-6">
+			<h1 className="text-2xl font-semibold">Select a version:</h1>
+			<div className="flex flex-col gap-4">
 				{data.map((version, idx) => (
 					<Link
 						className="dark:bg-dark-400 dark:border-dark-100 dark:hover:bg-dark-300 dark:active:bg-dark-200 focus:ring-width-2 focus:ring-blurple flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-col place-content-center rounded border border-neutral-300 bg-white p-4 text-base font-semibold leading-none text-black outline-0 hover:bg-neutral-100 focus:ring active:translate-y-px active:bg-neutral-200 dark:text-white"
@@ -45,13 +45,13 @@ export default async function Page({ params }: { params: { package: string } })
 						</div>
 					</Link>
 				)) ?? null}
-				<Link
-					className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center gap-2 place-self-center rounded border-0 px-4 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px"
-					href="/docs/packages"
-				>
-					<VscArrowLeft size={20} /> Go back
-				</Link>
 			</div>
+			<Link
+				className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center gap-2 place-self-center rounded border-0 px-4 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px"
+				href="/docs/packages"
+			>
+				<VscArrowLeft size={20} /> Go back
+			</Link>
 		</div>
 	);
 }
diff --git a/apps/website/src/app/docs/packages/page.tsx b/apps/website/src/app/docs/packages/page.tsx
index b06675766..fdec40631 100644
--- a/apps/website/src/app/docs/packages/page.tsx
+++ b/apps/website/src/app/docs/packages/page.tsx
@@ -10,9 +10,9 @@ export const runtime: ServerRuntime = 'edge';
 
 export default function Page() {
 	return (
-		<div className="min-w-xs sm:w-md mx-auto flex min-h-screen flex-row place-content-center place-items-center gap-8 py-6 px-4 lg:py-6 lg:px-6">
-			<div className="flex grow flex-col place-content-center gap-4">
-				<h1 className="text-2xl font-semibold">Select a package:</h1>
+		<div className="min-w-xs sm:w-md mx-auto flex min-h-screen flex-col gap-8 py-6 px-4 lg:py-6 lg:px-6">
+			<h1 className="text-2xl font-semibold">Select a package:</h1>
+			<div className="flex flex-col gap-4">
 				<a
 					className="dark:bg-dark-400 dark:border-dark-100 dark:hover:bg-dark-300 dark:active:bg-dark-200 focus:ring-width-2 focus:ring-blurple flex h-11 transform-gpu cursor-pointer select-none appearance-none place-content-between rounded border border-neutral-300 bg-white p-4 text-base font-semibold leading-none text-black outline-0 hover:bg-neutral-100 focus:ring active:translate-y-px active:bg-neutral-200 dark:text-white"
 					href="https://discord.js.org/#/docs/discord.js"
@@ -66,13 +66,13 @@ export default function Page() {
 						<FiExternalLink size={20} />
 					</div>
 				</a>
-				<Link
-					className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center gap-2 place-self-center rounded border-0 px-4 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px"
-					href="/"
-				>
-					<VscArrowLeft size={20} /> Go back
-				</Link>
 			</div>
+			<Link
+				className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center gap-2 place-self-center rounded border-0 px-4 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px"
+				href="/"
+			>
+				<VscArrowLeft size={20} /> Go back
+			</Link>
 		</div>
 	);
 }