Add background colour to quote and link prompt in editor

Author: pdelfan

src/components/inputs/editor/Editor.tsx

@@ -161,13 +161,13 @@ export default function Editor(props: Props) {
               linkEmbed ||
               (images && images.length > 0) ||
               embedSuggestions.size > 0
-                ? "mb-3"
+                ? "my-3"
                 : ""
             }`}
           >
             {quote && <QuoteToPreview post={quote} />}
             {embedSuggestions.size > 0 && (
-              <div className="mb-3 flex flex-col gap-y-3">
+              <div className="my-3 flex flex-col gap-y-3">
                 {Array.from(embedSuggestions).map((link) => (
                   <LinkCardPrompt
                     key={link}

src/components/inputs/editor/LinkCardPrompt.tsx

@@ -11,7 +11,7 @@ export default function LinkCardPrompt(props: Props) {
   return (
     <button
       onClick={() => onAddLinkCard(link)}
-      className="border-skin-base flex w-full items-center gap-3 rounded-2xl border p-3"
+      className="bg-skin-base border-skin-base flex w-full items-center gap-3 rounded-2xl border p-3"
     >
       <span className="text-skin-base w-fit shrink-0">Add link card:</span>
       <span className="text-skin-link-base line-clamp-1 shrink overflow-ellipsis break-all text-sm">

src/components/inputs/editor/QuotePreview.tsx

@@ -24,7 +24,7 @@ export default function QuoteToPreview(props: Props) {
   return (
     <article
       onClick={toggleShowMore}
-      className="border-skin-base flex cursor-pointer items-start gap-1 rounded-2xl border p-2"
+      className="bg-skin-base border-skin-base flex cursor-pointer items-start gap-1 rounded-2xl border p-2"
     >
       <Image
         src={