From edb8708dde91054098f3f0be3b10de09810aec1f Mon Sep 17 00:00:00 2001
From: Pragadesh-45 <54320162+Pragadesh-45@users.noreply.github.com>
Date: Thu, 8 Aug 2024 15:48:54 +0530
Subject: [PATCH] UX - improvements Input Placeholders (#2780)

* add placeholders

* placeholders for clone collection

* placeholders for inputs, placeholder-global-opacity, change cursor type for clickables

* revert placeholders for collection creation and collection cloning

* revert c-placeholder

* revert: cliert cert placeholder
---
 .../src/components/CollectionSettings/Presets/index.js       | 1 +
 .../Collection/CollectionItem/CloneCollectionItem/index.js   | 1 +
 .../bruno-app/src/components/Sidebar/Collections/index.js    | 2 +-
 .../src/components/Sidebar/ImportCollectionLocation/index.js | 2 +-
 .../bruno-app/src/components/Sidebar/NewRequest/index.js     | 2 ++
 packages/bruno-app/src/styles/globals.css                    | 5 +++++
 6 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/packages/bruno-app/src/components/CollectionSettings/Presets/index.js b/packages/bruno-app/src/components/CollectionSettings/Presets/index.js
index 734bd90ef..1569a5174 100644
--- a/packages/bruno-app/src/components/CollectionSettings/Presets/index.js
+++ b/packages/bruno-app/src/components/CollectionSettings/Presets/index.js
@@ -74,6 +74,7 @@ const PresetsSettings = ({ collection }) => {
                 id="request-url"
                 type="text"
                 name="requestUrl"
+                placeholder='Enter Request URL'
                 className="block textbox"
                 autoComplete="off"
                 autoCorrect="off"
diff --git a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/CloneCollectionItem/index.js b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/CloneCollectionItem/index.js
index 55c2b86dd..0dd96e197 100644
--- a/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/CloneCollectionItem/index.js
+++ b/packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/CloneCollectionItem/index.js
@@ -58,6 +58,7 @@ const CloneCollectionItem = ({ collection, item, onClose }) => {
             id="collection-item-name"
             type="text"
             name="name"
+            placeholder='Enter Item name'
             ref={inputRef}
             className="block textbox mt-2 w-full"
             autoComplete="off"
diff --git a/packages/bruno-app/src/components/Sidebar/Collections/index.js b/packages/bruno-app/src/components/Sidebar/Collections/index.js
index e5a657ef9..6553be58f 100644
--- a/packages/bruno-app/src/components/Sidebar/Collections/index.js
+++ b/packages/bruno-app/src/components/Sidebar/Collections/index.js
@@ -91,13 +91,13 @@ const Collections = () => {
         <input
           type="text"
           name="search"
+          placeholder="search"
           id="search"
           autoComplete="off"
           autoCorrect="off"
           autoCapitalize="off"
           spellCheck="false"
           className="block w-full pl-7 py-1 sm:text-sm"
-          placeholder="search"
           value={searchText}
           onChange={(e) => setSearchText(e.target.value.toLowerCase())}
         />
diff --git a/packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js b/packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js
index 4211e8ff1..ff8db4eaa 100644
--- a/packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js
+++ b/packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js
@@ -160,7 +160,7 @@ const ImportCollectionLocation = ({ onClose, handleSubmit, collectionName, trans
               type="text"
               name="collectionLocation"
               readOnly={true}
-              className="block textbox mt-2 w-full"
+              className="block textbox mt-2 w-full cursor-pointer"
               autoComplete="off"
               autoCorrect="off"
               autoCapitalize="off"
diff --git a/packages/bruno-app/src/components/Sidebar/NewRequest/index.js b/packages/bruno-app/src/components/Sidebar/NewRequest/index.js
index 36d1f2193..5fc1074c7 100644
--- a/packages/bruno-app/src/components/Sidebar/NewRequest/index.js
+++ b/packages/bruno-app/src/components/Sidebar/NewRequest/index.js
@@ -229,6 +229,7 @@ const NewRequest = ({ collection, item, isEphemeral, onClose }) => {
               id="request-name"
               type="text"
               name="requestName"
+              placeholder="Enter Request Name"
               ref={inputRef}
               className="block textbox mt-2 w-full"
               autoComplete="off"
@@ -261,6 +262,7 @@ const NewRequest = ({ collection, item, isEphemeral, onClose }) => {
                       id="request-url"
                       type="text"
                       name="requestUrl"
+                      placeholder="Enter Request URL"
                       className="px-3 w-full "
                       autoComplete="off"
                       autoCorrect="off"
diff --git a/packages/bruno-app/src/styles/globals.css b/packages/bruno-app/src/styles/globals.css
index 8396c48b5..5ad8e8ef9 100644
--- a/packages/bruno-app/src/styles/globals.css
+++ b/packages/bruno-app/src/styles/globals.css
@@ -38,6 +38,11 @@ body {
   overflow-x: hidden;
 }
 
+input::placeholder {
+  color: #a2a2a2;
+  opacity: 50%;
+}
+
 body {
   font-size: 0.875rem;
 }