address review comments

libs/remix-ui/run-tab/src/lib/components/contractDropdownUI.tsx

@@ -275,13 +275,25 @@ export function ContractDropdownUI(props: ContractDropdownProps) {
           : null}
       </div>
       <div className="udapp_subcontainer">
-        <select ref={contractsRef} value={currentContract} onChange={handleContractChange} className="udapp_contractNames custom-select" disabled={contractOptions.disabled} title={contractOptions.title} style={{ display: loadType === 'abi' && !isContractFile(currentFile) ? 'none' : 'block' }}>
+        <OverlayTrigger
+              placement={"right"}
+              overlay={
+                <Tooltip
+                  className="text-nowrap"
+                  id="remixUdappContractNamesTooltip"
+                >
+                  <span>{contractOptions.title}</span>
+                </Tooltip>
+              }
+            >
+        <select ref={contractsRef} value={currentContract} onChange={handleContractChange} className="udapp_contractNames custom-select" disabled={contractOptions.disabled} style={{ display: loadType === 'abi' && !isContractFile(currentFile) ? 'none' : 'block' }}>
           {(contractList[currentFile] || []).map((contract, index) => {
             return <option key={index} value={contract.alias}>
               {contract.alias} - {contract.file}
             </option>
           })}
         </select>
+        </OverlayTrigger>
         <span className="py-1" style={{ display: abiLabel.display }}>{abiLabel.content}</span>
       </div>
       <div>
@@ -329,20 +341,28 @@ export function ContractDropdownUI(props: ContractDropdownProps) {
         </div>
         <div className="udapp_orLabel mt-2" style={{ display: loadType === 'abi' && !isContractFile(currentFile) ? 'none' : 'block' }}>or</div>
         <div className="udapp_button udapp_atAddressSect ">
-          <OverlayTrigger placement={'bottom-end'} overlay={
+          <OverlayTrigger placement={'top-end'} overlay={
             <Tooltip className="text-wrap" id="runAndDeployAddresstooltip">
               <span>{atAddressOptions.title}</span>
             </Tooltip>
           }>
-              <button className="udapp_atAddress btn btn-sm btn-info" id="runAndDeployAtAdressButton" disabled={atAddressOptions.disabled} onClick={loadFromAddress} data-title={atAddressOptions.title}>At Address</button>
+              <div onClick={loadFromAddress}>
+                <button className="udapp_atAddress btn btn-sm btn-info" id="runAndDeployAtAdressButton" disabled={atAddressOptions.disabled} style={{ pointerEvents: 'none' }} onClick={loadFromAddress} data-title={atAddressOptions.title}
+                >At Address</button>
+              </div>
+          </OverlayTrigger>
+          <OverlayTrigger placement={'top-end'} overlay={
+            <Tooltip className="text-wrap" id="runAndDeployAddressInputtooltip">
+              <span>{"address of contract"}</span>
+            </Tooltip>
+          }>
+            <input
+              ref={atAddressValue}
+              className="udapp_input udapp_ataddressinput ataddressinput form-control"
+              placeholder="Load contract from Address"
+              onChange={atAddressChanged}
+            />
           </OverlayTrigger>
-          <input
-            ref={atAddressValue}
-            className="udapp_input udapp_ataddressinput ataddressinput form-control"
-            placeholder="Load contract from Address"
-            title="address of contract"
-            onChange={atAddressChanged}
-          />
         </div>
       </div>
     </div>

libs/remix-ui/run-tab/src/lib/components/universalDappUI.tsx

@@ -347,21 +347,37 @@ export function UniversalDappUI (props: UdappProps) {
           <div className="d-flex flex-column align-items-start">
             <label className="">CALLDATA</label>
             <div className="d-flex justify-content-end w-100 align-items-center">
-              <input
+              <OverlayTrigger
-                id="deployAndRunLLTxCalldata"
+                placement="bottom"
-                onChange={handleCalldataChange}
+                overlay={
-                className="udapp_calldataInput form-control"
+                  <Tooltip className="text-nowrap" id="deployAndRunLLTxCalldataInputTooltip">
-                title="The Calldata to send to fallback function of the contract."
+                    <span>{"The Calldata to send to fallback function of the contract."}</span>
-              />
+                  </Tooltip>
-              <button
+                }
-                id="deployAndRunLLTxSendTransaction"
-                data-id="pluginManagerSettingsDeployAndRunLLTxSendTransaction"
-                className="btn udapp_instanceButton p-0 w-50 border-warning text-warning"
-                title="Send data to contract."
-                onClick={sendData}
               >
-                Transact
+                <input
-              </button>
+                  id="deployAndRunLLTxCalldata"
+                  onChange={handleCalldataChange}
+                  className="udapp_calldataInput form-control"
+                />
+              </OverlayTrigger>
+              <OverlayTrigger
+                placement="right"
+                overlay={
+                  <Tooltip className="text-nowrap" id="deployAndRunLLTxCalldataTooltip">
+                    <span>Send data to contract.</span>
+                  </Tooltip>
+                }
+              >
+                <button
+                  id="deployAndRunLLTxSendTransaction"
+                  data-id="pluginManagerSettingsDeployAndRunLLTxSendTransaction"
+                  className="btn udapp_instanceButton p-0 w-50 border-warning text-warning"
+                  onClick={sendData}
+                >
+                  Transact
+                </button>
+              </OverlayTrigger>
             </div>
           </div>
           <div>