From c7b1b3100aa95e7f7d7d11e225d41603b54fe6ab Mon Sep 17 00:00:00 2001
From: Niall Maher <niall@codu.ie>
Date: Sat, 16 Dec 2023 14:45:05 +0000
Subject: [PATCH] Fix comment styles by adding prose-sm (#676)

---
 components/Comments/CommentsArea.tsx | 8 ++++----
 styles/globals.css                   | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/components/Comments/CommentsArea.tsx b/components/Comments/CommentsArea.tsx
index ed380de6..6ecfed5f 100644
--- a/components/Comments/CommentsArea.tsx
+++ b/components/Comments/CommentsArea.tsx
@@ -295,7 +295,7 @@ const CommentsArea = ({ postId, postOwnerId }: Props) => {
                 </div>
 
                 <div className="-mt-2 ml-4 border-l-2 border-neutral-400 pl-2 dark:border-neutral-700">
-                  <div className="prose overflow-x-hidden text-sm dark:prose-invert">
+                  <div className="prose-sm overflow-x-hidden text-sm dark:prose-invert">
                     {Markdoc.renderers.react(content, React, {
                       components: markdocComponents,
                     })}
@@ -413,7 +413,7 @@ const CommentsArea = ({ postId, postOwnerId }: Props) => {
         )}
         {viewPreviewId === id ? (
           <article
-            className="prose prose-invert overflow-x-hidden text-sm"
+            className="prose-sm prose-invert overflow-x-hidden text-sm"
             style={{ whiteSpace: "pre-wrap" }}
           >
             {Markdoc.renderers.react(
@@ -439,11 +439,11 @@ const CommentsArea = ({ postId, postOwnerId }: Props) => {
             />
           </>
         )}
-        <div className="flex items-center">
+        <div className="flex">
           <button
             disabled={createCommentStatus === "loading"}
             type="submit"
-            className=" primary-button border-2 text-sm text-neutral-300 hover:text-white"
+            className="primary-button border-2 text-sm text-neutral-300 hover:text-white"
           >
             {editMode ? "Update" : "Submit"}
           </button>
diff --git a/styles/globals.css b/styles/globals.css
index 6a3a3a7e..5046e9f5 100644
--- a/styles/globals.css
+++ b/styles/globals.css
@@ -59,7 +59,7 @@ body {
 }
 
 .primary-button {
-  @apply ml-4 inline-flex justify-center rounded-md bg-gradient-to-r from-orange-400 to-pink-600 px-4 py-2 font-medium text-white shadow-sm hover:from-orange-300 hover:to-pink-500 focus:outline-none focus:ring-2 focus:ring-pink-600 focus:ring-offset-2 focus-visible:ring-2 focus-visible:ring-pink-600 focus-visible:ring-offset-white disabled:border-neutral-300 disabled:from-neutral-500 disabled:to-neutral-700 disabled:text-neutral-300  disabled:hover:text-neutral-300;
+  @apply inline-flex justify-center rounded-md bg-gradient-to-r from-orange-400 to-pink-600 px-4 py-2 font-medium text-white shadow-sm hover:from-orange-300 hover:to-pink-500 focus:outline-none focus:ring-2 focus:ring-pink-600 focus:ring-offset-2 focus-visible:ring-2 focus-visible:ring-pink-600 focus-visible:ring-offset-white disabled:border-neutral-300 disabled:from-neutral-500 disabled:to-neutral-700 disabled:text-neutral-300  disabled:hover:text-neutral-300;
 }
 
 .secondary-button {