From 83b95f27b94dc0a97dfbcafb4010174833f7c07b Mon Sep 17 00:00:00 2001
From: Joseph Izang <josephizang@gmail.com>
Date: Thu, 17 Nov 2022 13:07:34 +0100
Subject: [PATCH] breakup tooltip text in recorderCardUI

---
 libs/remix-ui/run-tab/src/lib/components/contractGUI.tsx    | 4 +++-
 libs/remix-ui/run-tab/src/lib/components/recorderCardUI.tsx | 2 +-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/libs/remix-ui/run-tab/src/lib/components/contractGUI.tsx b/libs/remix-ui/run-tab/src/lib/components/contractGUI.tsx
index bd693bdb51..f0617adf6a 100644
--- a/libs/remix-ui/run-tab/src/lib/components/contractGUI.tsx
+++ b/libs/remix-ui/run-tab/src/lib/components/contractGUI.tsx
@@ -556,7 +556,9 @@ export function ContractGUI (props: ContractGUIProps) {
                   <label className="mt-2 text-left d-block">
                     Proxy Address :
                   </label>
-                  <input style={{ height: 32 }} className="form-control udapp_input" data-id="ERC1967AddressInput" placeholder='proxy address' title='Enter previously deployed proxy address on the selected network' onChange={handleSetProxyAddress} onBlur={() => validateProxyAddress(proxyAddress) } />
+                  <CustomTooltip placement="right" tooltipText={'Enter previously deployed proxy address on the selected network'}>
+                    <input style={{ height: 32 }} className="form-control udapp_input" data-id="ERC1967AddressInput" placeholder='proxy address' onChange={handleSetProxyAddress} onBlur={() => validateProxyAddress(proxyAddress) } />
+                  </CustomTooltip>
                   { proxyAddressError && <span className='text-lowercase' data-id="errorMsgProxyAddress" style={{ fontSize: '.8em' }}>{ proxyAddressError }</span> }
                 </div> :
                 <span className='text-capitalize' data-id="lastDeployedERC1967Address" style={{ fontSize: '.8em' }}>{ proxyAddress || proxyAddressError }</span>
diff --git a/libs/remix-ui/run-tab/src/lib/components/recorderCardUI.tsx b/libs/remix-ui/run-tab/src/lib/components/recorderCardUI.tsx
index a33e577c9d..551dc5c022 100644
--- a/libs/remix-ui/run-tab/src/lib/components/recorderCardUI.tsx
+++ b/libs/remix-ui/run-tab/src/lib/components/recorderCardUI.tsx
@@ -64,7 +64,7 @@ export function RecorderUI (props: RecorderProps) {
             placement={'right'}
             tooltipClasses="text-wrap"
             tooltipId="tooltip-livemode-recorder"
-            tooltipText="If contracts are updated after recording transactions, checking this box will run recorded transactions with the latest copy of the compiled contracts"
+            tooltipText={<span>If contracts are updated after recording transactions,<br/> checking this box will run recorded transactions <br/>with the latest copy of the compiled contracts</span>}
           >
             <label className="form-check-label custom-control-label" data-id="runtabLivemodeInput" htmlFor="livemode-recorder">Run transactions using the latest compilation result</label>
           </CustomTooltip>