Merge pull request #434 from QuantuM410/quantum410/frontend-placeholder

Added css attribute placeholder for search div
arc53 · Oct 5, 2023 · 30299a9 · 30299a9 · vercel · Oct 5, 2023
2 parents 23d7fe9 + 70aa3b1
commit 30299a9
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 0 deletions.
diff --git a/frontend/src/conversation/Conversation.tsx b/frontend/src/conversation/Conversation.tsx
@@ -151,6 +151,7 @@ export default function Conversation() {
         <div className="flex w-full">
           <div
             ref={inputRef}
+            placeholder="Type your message here..."
             contentEditable
             onPaste={handlePaste}
             className={`border-000000 overflow-x-hidden; max-h-24 min-h-[2.6rem] w-full overflow-y-auto whitespace-pre-wrap rounded-xl border bg-white py-2 pl-4 pr-9 leading-7 opacity-100 focus:outline-none`}

diff --git a/frontend/src/index.css b/frontend/src/index.css
@@ -358,3 +358,9 @@ template {
 [hidden] {
   display: none;
 }
+
+[contentEditable]:empty:before {
+  content: attr(placeholder);
+  color: #9ca3af;
+  opacity: 1;
+}