From 33de0e3739bfc3cc89242abb9be42d4dea57ecbb Mon Sep 17 00:00:00 2001
From: Chandra Y <cyemparala@tacc.utexas.edu>
Date: Wed, 22 Jan 2025 07:33:20 -0600
Subject: [PATCH] WP-781: FIx UI formatting issues (#1038)

* WP-774: FIx UI formatting issues

* linting
---
 .../AllocationsTeamViewModal.jsx                    | 13 +++++++++++--
 .../_common/TextCopyField/TextCopyField.jsx         |  2 +-
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/client/src/components/Allocations/AllocationsModals/AllocationsTeamViewModal/AllocationsTeamViewModal.jsx b/client/src/components/Allocations/AllocationsModals/AllocationsTeamViewModal/AllocationsTeamViewModal.jsx
index 6de5ab55b..df5a2eca6 100644
--- a/client/src/components/Allocations/AllocationsModals/AllocationsTeamViewModal/AllocationsTeamViewModal.jsx
+++ b/client/src/components/Allocations/AllocationsModals/AllocationsTeamViewModal/AllocationsTeamViewModal.jsx
@@ -94,14 +94,23 @@ const AllocationsTeamViewModal = ({ isOpen, toggle }) => {
 
   return (
     <Modal isOpen={isOpen} toggle={toggle} size="lg" onClosed={resetCard}>
-      <ModalHeader className="has-MuiTabs" toggle={toggle} charCode="&#xe912;">
+      <ModalHeader
+        className="pe-3 has-MuiTabs"
+        toggle={toggle}
+        charCode="&#xe912;"
+      >
         <Tabs
           style={{ marginBottom: '-8px' }}
           value={selectedTab}
           onChange={handleTabChange}
         >
           <Tab style={{ width: '160px', color: '#222222' }} label="View Team" />
-          {isManager && <Tab label="Manage Team" />}
+          {isManager && (
+            <Tab
+              style={{ width: '160px', color: '#222222' }}
+              label="Manage Team"
+            />
+          )}
         </Tabs>
       </ModalHeader>
       <ModalBody className={selectedTab === 0 ? 'd-flex p-0' : 'pb-0'}>
diff --git a/client/src/components/_common/TextCopyField/TextCopyField.jsx b/client/src/components/_common/TextCopyField/TextCopyField.jsx
index f6e5424ad..0bb5cf5d9 100644
--- a/client/src/components/_common/TextCopyField/TextCopyField.jsx
+++ b/client/src/components/_common/TextCopyField/TextCopyField.jsx
@@ -53,7 +53,7 @@ const TextCopyField = ({ value, placeholder, displayField }) => {
             data-testid="textarea"
             readOnly
           />
-          <div className={styles['button-container']}>
+          <div className="input-group-text ms-auto p-0 my-2 bg-transparent border-0">
             <CopyToClipboard text={value}>
               <Button {...clipboardProps}>Copy</Button>
             </CopyToClipboard>