Merge branch 'main' into feat/markdown-format-bar-above

[lemmy-ui.git] / src / shared / components / common / markdown-textarea.tsx

diff --git a/src/shared/components/common/markdown-textarea.tsx b/src/shared/components/common/markdown-textarea.tsx
index 5d9322040f8e79ef4534954a9cbfce1ac93d8cbc..ef7ba0187df3d4a7e9c0916eb0c5fd5df22672c6 100644 (file)
--- a/src/shared/components/common/markdown-textarea.tsx
+++ b/src/shared/components/common/markdown-textarea.tsx
@@ -64,8 +64,9 @@ export class MarkdownTextArea extends Component<
   MarkdownTextAreaProps,
   MarkdownTextAreaState
 > {
-  private id = `comment-textarea-${randomStr()}`;
-  private formId = `comment-form-${randomStr()}`;
+  private id = `markdown-textarea-${randomStr()}`;
+  private formId = `markdown-form-${randomStr()}`;
+
   private tribute: any;
 
   state: MarkdownTextAreaState = {
@@ -146,15 +147,15 @@ export class MarkdownTextArea extends Component<
         <div className="form-group row">
           <div className="col-12">
             <div
-              className="rounded bg-white"
+              className="rounded bg-light overflow-hidden"
               style={{
-                border: "1px solid var(--bs-border-color)",
+                border: "1px solid var(--medium-light)",
               }}
             >
               <div
                 className="d-flex flex-wrap"
                 style={{
-                  "border-bottom": "1px solid var(--bs-border-color)",
+                  "border-bottom": "1px solid var(--medium-light)",
                 }}
               >
                 {this.getFormatButton("bold", this.handleInsertBold)}
@@ -218,7 +219,7 @@ export class MarkdownTextArea extends Component<
               <div>
                 <textarea
                   id={this.id}
-                  className={classNames("form-control border-0", {
+                  className={classNames("form-control border-0 rounded-0", {
                     "d-none": this.state.previewMode,
                   })}
                   value={this.state.content}