From d4c0b2a0a6b755001deb36a41e13b9d8da13bff2 Mon Sep 17 00:00:00 2001
From: Damian Stasik <920747+damianstasik@users.noreply.github.com>
Date: Tue, 19 Sep 2023 15:28:37 +0200
Subject: [PATCH] Make longer admonitions a bit more readable

---
 src/theme/Admonition/index.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/theme/Admonition/index.tsx b/src/theme/Admonition/index.tsx
index 3155caa7..8f922be8 100644
--- a/src/theme/Admonition/index.tsx
+++ b/src/theme/Admonition/index.tsx
@@ -44,19 +44,19 @@ type AdmonitionConfig = {
 const AdmonitionConfigs: Record<string, AdmonitionConfig> = {
   note: {
     className:
-      "bg-sky-100 border-sky-300 text-sky-700 dark:bg-sky-950 dark:border-sky-700 dark:text-sky-200",
+      "bg-sky-100 border-sky-300 text-sky-700 dark:bg-sky-950 dark:border-sky-700 dark:text-sky-100",
     iconComponent: NoteIcon,
     label: "Note",
   },
   danger: {
     className:
-      "bg-red-100 border-red-300 text-red-700 dark:bg-red-950 dark:border-red-700 dark:text-red-200",
+      "bg-red-100 border-red-300 text-red-700 dark:bg-red-950 dark:border-red-700 dark:text-red-100",
     iconComponent: DangerIcon,
     label: "Danger",
   },
   warning: {
     className:
-      "bg-yellow-100 border-yellow-500 text-yellow-700 dark:bg-yellow-950 dark:border-yellow-700 dark:text-yellow-200",
+      "bg-yellow-100 border-yellow-500 text-yellow-700 dark:bg-yellow-950 dark:border-yellow-700 dark:text-yellow-100",
     iconComponent: CautionIcon,
     label: "Warning",
   },
@@ -120,7 +120,7 @@ export default function Admonition(props: Props) {
   return (
     <div
       className={clsx(
-        "flex flex-col py-2 px-3 not-prose border [&+&]:mt-3 [&_a:hover]:text-gray-900 dark:[&_a:hover]:text-gray-50",
+        "flex flex-col py-2 px-3 not-prose border gap-1 [&+&]:mt-3 [&_a:hover]:text-gray-900 dark:[&_a:hover]:text-gray-50",
         typeConfig.className
       )}
       role="alert"
@@ -131,7 +131,7 @@ export default function Admonition(props: Props) {
         </span>
         {titleLabel}
       </div>
-      <div>{children}</div>
+      <div className="leading-relaxed">{children}</div>
     </div>
   );
 }