update tool tip

G7DAO · Jan 7, 2025 · ac6149e · ac6149e
1 parent a8aa7d7
commit ac6149e
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 11 deletions.
diff --git a/webapps/world-builder-dashboard/src/components/bridge/bridge/BridgeView.module.css b/webapps/world-builder-dashboard/src/components/bridge/bridge/BridgeView.module.css
@@ -260,10 +260,6 @@
   /* 150% */
 }
 
-.manualGasMessageTooltip {
-  background: #B54708;
-}
-
 @media (max-width: 1199px) {
   .container {
     width: 100%;
@@ -285,4 +281,13 @@
   .arrowIcon {
     display: none;
   }
+}
+
+.customTooltip {
+  max-width: 200px;
+  padding: 10px;
+  border-radius: 8px;
+  white-space: normal;
+  overflow: hidden;
+  text-align: center;
 }
diff --git a/webapps/world-builder-dashboard/src/components/bridge/bridge/BridgeView.tsx b/webapps/world-builder-dashboard/src/components/bridge/bridge/BridgeView.tsx
@@ -282,14 +282,15 @@ const BridgeView = ({
           Claim transaction may be required on {selectedHighNetwork.displayName}
         </div>
         <Tooltip
-          content={`
-            Gas requirements may change on the destination chain, requiring manual completion. Check the Activity tab for updates.
-          `}
-          label=' Gas requirements may change on the destination chain, requiring manual completion. Check the Activity tab for updates.'
-          position='top'
-          className={styles.manualGasMessageTooltip}
+          multiline
+          radius={'8px'}
+          arrowSize={8}
+          withArrow
+          arrowOffset={14}
+          events={{ hover: true, focus: true, touch: true }}
+          label='Gas requirements may change on the destination chain, requiring manual completion. Check the Activity tab for updates.'
         >
-          <IconAlertCircle stroke='#FFFAEB' height={12} width={12} />
+          <IconAlertCircle stroke='#FFFAEB' height={16} width={16} />
         </Tooltip>
       </div>}
       <ActionButton