From eb7b32975846685121333086f632035ade508751 Mon Sep 17 00:00:00 2001
From: khcrysalis <97859147+khcrysalis@users.noreply.github.com>
Date: Mon, 23 Dec 2024 18:32:13 -0800
Subject: [PATCH] chore: fix some issues with code relating to the card

---
 .../VencordSettings/SpecialCard.tsx           | 27 +++++++------------
 .../VencordSettings/specialCard.css           |  1 +
 2 files changed, 10 insertions(+), 18 deletions(-)

diff --git a/src/components/VencordSettings/SpecialCard.tsx b/src/components/VencordSettings/SpecialCard.tsx
index e694023ac..5d71aafd5 100644
--- a/src/components/VencordSettings/SpecialCard.tsx
+++ b/src/components/VencordSettings/SpecialCard.tsx
@@ -50,29 +50,20 @@ export function SpecialCard({ title, subtitle, description, cardImage, backgroun
                 <div className={cl("card-flex-main")}>
                     <Forms.FormTitle className={cl("title")} tag="h5">{title}</Forms.FormTitle>
                     <Forms.FormText className={cl("subtitle")}>{subtitle}</Forms.FormText>
-                    <Forms.FormText className={cl("text")}>
-                        {description.split("\n").map((line, index) => (
-                            <React.Fragment key={index}>
-                                {line}
-                                <br />
-                            </React.Fragment>
-                        ))}
-                    </Forms.FormText>
+                    <Forms.FormText className={cl("text")}>{description}</Forms.FormText>
 
                     {children}
                 </div>
                 {
                     cardImage && (
-                        <>
-                            <div className={cl("image-container")}>
-                                <img
-                                    role="presentation"
-                                    src={cardImage}
-                                    alt=""
-                                    className={cl("image")}
-                                />
-                            </div>
-                        </>
+                        <div className={cl("image-container")}>
+                            <img
+                                role="presentation"
+                                src={cardImage}
+                                alt=""
+                                className={cl("image")}
+                            />
+                        </div>
                     )
                 }
             </div>
diff --git a/src/components/VencordSettings/specialCard.css b/src/components/VencordSettings/specialCard.css
index e2fcfb71c..5b1662641 100644
--- a/src/components/VencordSettings/specialCard.css
+++ b/src/components/VencordSettings/specialCard.css
@@ -34,6 +34,7 @@
     color: black;
     font-size: 1em;
     margin-top: 1em;
+    white-space: pre-line;
 }
 
 .vc-special-seperator {