From 8e98ba94d2972a6debf54406b1caa59279782625 Mon Sep 17 00:00:00 2001
From: iCrawl <buechler.noel@outlook.com>
Date: Wed, 7 Sep 2022 22:57:35 +0200
Subject: [PATCH] fix: properly center badge text

---
 packages/website/src/components/CodeListing.tsx | 6 +++---
 packages/website/src/components/MethodItem.tsx  | 6 +++---
 packages/website/src/components/Sections.tsx    | 4 ++--
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/packages/website/src/components/CodeListing.tsx b/packages/website/src/components/CodeListing.tsx
index b913b6a852fa..f87f5f9d7523 100644
--- a/packages/website/src/components/CodeListing.tsx
+++ b/packages/website/src/components/CodeListing.tsx
@@ -41,17 +41,17 @@ export function CodeListing({
 				{deprecation || readonly || optional ? (
 					<div className="flex flex-row gap-1">
 						{deprecation ? (
-							<div className="h-5 place-content-center rounded-full bg-red-500 px-3 text-center text-xs font-semibold uppercase text-white">
+							<div className="flex h-5 place-content-center place-items-center rounded-full bg-red-500 px-3 text-center text-xs font-semibold uppercase text-white">
 								Deprecated
 							</div>
 						) : null}
 						{readonly ? (
-							<div className="bg-blurple h-5 place-content-center rounded-full px-3 text-center text-xs font-semibold uppercase text-white">
+							<div className="bg-blurple flex h-5 place-content-center place-items-center rounded-full px-3 text-center text-xs font-semibold uppercase text-white">
 								Readonly
 							</div>
 						) : null}
 						{optional ? (
-							<div className="bg-blurple h-5 place-content-center rounded-full px-3 text-center text-xs font-semibold uppercase text-white">
+							<div className="bg-blurple flex h-5 place-content-center place-items-center rounded-full px-3 text-center text-xs font-semibold uppercase text-white">
 								Optional
 							</div>
 						) : null}
diff --git a/packages/website/src/components/MethodItem.tsx b/packages/website/src/components/MethodItem.tsx
index 4ceea7b93976..6cdb6f1c04d8 100644
--- a/packages/website/src/components/MethodItem.tsx
+++ b/packages/website/src/components/MethodItem.tsx
@@ -37,17 +37,17 @@ export function MethodItem({ data }: { data: ApiMethodJSON | ApiMethodSignatureJ
 					(data.kind === 'Method' && method.static) ? (
 						<div className="flex flex-row gap-1">
 							{data.deprecated ? (
-								<div className="h-5 place-content-center rounded-full bg-red-500 px-3 text-center text-xs font-semibold uppercase text-white">
+								<div className="flex h-5 place-content-center place-items-center rounded-full bg-red-500 px-3 text-center text-xs font-semibold uppercase text-white">
 									Deprecated
 								</div>
 							) : null}
 							{data.kind === 'Method' && method.protected ? (
-								<div className="bg-blurple h-5 place-content-center rounded-full px-3 text-center text-xs font-semibold uppercase text-white">
+								<div className="bg-blurple flex h-5 place-content-center place-items-center rounded-full px-3 text-center text-xs font-semibold uppercase text-white">
 									Protected
 								</div>
 							) : null}
 							{data.kind === 'Method' && method.static ? (
-								<div className="bg-blurple h-5 place-content-center rounded-full px-3 text-center text-xs font-semibold uppercase text-white">
+								<div className="bg-blurple flex h-5 place-content-center place-items-center rounded-full px-3 text-center text-xs font-semibold uppercase text-white">
 									Static
 								</div>
 							) : null}
diff --git a/packages/website/src/components/Sections.tsx b/packages/website/src/components/Sections.tsx
index 06babab6cb6c..ee40aa1ea791 100644
--- a/packages/website/src/components/Sections.tsx
+++ b/packages/website/src/components/Sections.tsx
@@ -66,12 +66,12 @@ export function ConstructorSection({ data }: { data: ApiConstructorJSON }) {
 						{data.deprecated || data.protected ? (
 							<div className="flex flex-row gap-1">
 								{data.deprecated ? (
-									<div className="h-5 place-content-center rounded-full bg-red-500 px-3 text-center text-xs font-semibold uppercase text-white">
+									<div className="flex h-5 place-content-center place-items-center rounded-full bg-red-500 px-3 text-center text-xs font-semibold uppercase text-white">
 										Deprecated
 									</div>
 								) : null}
 								{data.protected ? (
-									<div className="bg-blurple h-5 place-content-center rounded-full px-3 text-center text-xs font-semibold uppercase text-white">
+									<div className="bg-blurple flex h-5 place-content-center place-items-center rounded-full px-3 text-center text-xs font-semibold uppercase text-white">
 										Protected
 									</div>
 								) : null}