From 6f882a3948d19dbc8d940dcecfaf75c6b11b9930 Mon Sep 17 00:00:00 2001
From: sulochan <sulochankhadka25@gmail.com>
Date: Fri, 29 Mar 2024 23:46:44 +0530
Subject: [PATCH] Icon overlapping with text in text-box of Doctor's Notes.
 #7495

---
 .../Facility/PatientNotesSlideover.tsx        | 56 ++++++++++---------
 1 file changed, 30 insertions(+), 26 deletions(-)

diff --git a/src/Components/Facility/PatientNotesSlideover.tsx b/src/Components/Facility/PatientNotesSlideover.tsx
index 2e04312d277..24f5151948f 100644
--- a/src/Components/Facility/PatientNotesSlideover.tsx
+++ b/src/Components/Facility/PatientNotesSlideover.tsx
@@ -199,32 +199,36 @@ export default function PatientNotesSlideover(props: PatientNotesProps) {
             disableEdit={!patientActive}
           />
           <div className="relative mx-4 flex items-center">
-            <AutoExpandingTextInputFormField
-              id="doctor_notes_textarea"
-              maxHeight={160}
-              rows={1}
-              name="note"
-              value={noteField}
-              onChange={(e) => setNoteField(e.value)}
-              className="grow"
-              errorClassName="hidden"
-              placeholder="Type your Note"
-              disabled={!patientActive}
-              onFocus={() => setFocused(true)}
-              onBlur={() => setFocused(false)}
-            />
-            <ButtonV2
-              id="add_doctor_note_button"
-              onClick={onAddNote}
-              border={false}
-              className="absolute right-2"
-              ghost
-              size="small"
-              disabled={!patientActive}
-              authorizeFor={NonReadOnlyUsers}
-            >
-              <CareIcon className="care-l-message text-lg" />
-            </ButtonV2>
+            <div className=" w-full px-12">
+              <AutoExpandingTextInputFormField
+                id="doctor_notes_textarea"
+                maxHeight={160}
+                rows={1}
+                name="note"
+                value={noteField}
+                onChange={(e) => setNoteField(e.value)}
+                className="grow"
+                errorClassName="hidden"
+                placeholder="Type your Note"
+                disabled={!patientActive}
+                onFocus={() => setFocused(true)}
+                onBlur={() => setFocused(false)}
+              />
+            </div>
+            <div className="flex items-center">
+              <ButtonV2
+                id="add_doctor_note_button"
+                onClick={onAddNote}
+                border={false}
+                className="absolute right-2"
+                ghost
+                size="small"
+                disabled={!patientActive}
+                authorizeFor={NonReadOnlyUsers}
+              >
+                <CareIcon className="care-l-message text-lg" />
+              </ButtonV2>
+            </div>
           </div>
         </div>
       )}