From 17e37a3d796281d1d087e8514e066ded5e50ac77 Mon Sep 17 00:00:00 2001
From: Jing Hua <tohjinghua123@gmail.com>
Date: Sun, 5 Mar 2023 00:09:00 +0800
Subject: [PATCH] style: sticky input

---
 .../ChatContent/Message/MessageContent.tsx    | 30 +++++++++++--------
 1 file changed, 18 insertions(+), 12 deletions(-)

diff --git a/src/components/Chat/ChatContent/Message/MessageContent.tsx b/src/components/Chat/ChatContent/Message/MessageContent.tsx
index 5ad4487..36d5695 100644
--- a/src/components/Chat/ChatContent/Message/MessageContent.tsx
+++ b/src/components/Chat/ChatContent/Message/MessageContent.tsx
@@ -357,19 +357,25 @@ const EditView = ({
 
   return (
     <>
-      <textarea
-        ref={textareaRef}
-        className={`m-0 resize-none rounded-lg bg-transparent overflow-y-hidden focus:ring-0 focus-visible:ring-0 leading-7 ${
-          sticky ? 'border border-gray-400/30 px-2 py-1' : 'focus:outline-none'
+      <div
+        className={`w-full ${
+          sticky
+            ? 'py-2 md:py-3 px-2 md:px-4 border border-black/10 bg-white dark:border-gray-900/50 dark:text-white dark:bg-gray-700 rounded-md shadow-[0_0_10px_rgba(0,0,0,0.10)] dark:shadow-[0_0_15px_rgba(0,0,0,0.10)]'
+            : ''
         }`}
-        onChange={(e) => {
-          _setContent(e.target.value);
-        }}
-        value={_content}
-        onInput={handleInput}
-        onKeyDown={handleKeyDown}
-        rows={1}
-      ></textarea>
+      >
+        <textarea
+          ref={textareaRef}
+          className='m-0 resize-none rounded-lg bg-transparent overflow-y-hidden focus:ring-0 focus-visible:ring-0 leading-7 w-full'
+          onChange={(e) => {
+            _setContent(e.target.value);
+          }}
+          value={_content}
+          onInput={handleInput}
+          onKeyDown={handleKeyDown}
+          rows={1}
+        ></textarea>
+      </div>
       <div className='text-center mt-2 flex justify-center'>
         {sticky && (
           <button