From b6c041ea9e06cf5faff1c4248dc1252a588a4031 Mon Sep 17 00:00:00 2001
From: plebbitor <mottoes_recap0u@icloud.com>
Date: Tue, 18 Apr 2023 12:44:55 +0200
Subject: [PATCH] added ReplyModal placeholder

---
 src/components/ReplyModal.jsx               |  5 +++--
 src/components/styled/ReplyModal.styled.jsx | 17 +++++++++++++++++
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/src/components/ReplyModal.jsx b/src/components/ReplyModal.jsx
index 60669cd5..5c17b00e 100644
--- a/src/components/ReplyModal.jsx
+++ b/src/components/ReplyModal.jsx
@@ -185,8 +185,9 @@ const ReplyModal = ({ isOpen, closeModal }) => {
             <div>
               <input id="name" type="text" placeholder="Embed link" ref={linkRef} />
             </div>
-            <div>
-              <textarea rows="4" placeholder="Comment" wrap="soft" ref={commentRef} />
+            <div className="textarea-wrapper">
+              <span className="fixed-text">{`c/${selectedShortCid}`}</span>
+              <textarea className="textarea" rows="4" placeholder="Comment" wrap="soft" ref={commentRef} />
             </div>
             <div>
               <button id="next" onClick={handleSubmit}>Post</button>
diff --git a/src/components/styled/ReplyModal.styled.jsx b/src/components/styled/ReplyModal.styled.jsx
index a716f716..8594f392 100644
--- a/src/components/styled/ReplyModal.styled.jsx
+++ b/src/components/styled/ReplyModal.styled.jsx
@@ -56,6 +56,23 @@ export const StyledModal = styled(Modal)`
     margin-top: 0.5px;
   }
 
+  .textarea-wrapper {
+    position: relative;
+  }
+
+  .textarea {
+    padding-top: 2em;
+  }
+
+  .fixed-text {
+    position: absolute;
+    top: 4px;
+    left: 5px;
+    color: #999;
+    text-decoration: underline;
+    pointer-events: none;
+  }
+
   #captcha-container {
     position: relative;
     clear: both;