Update swaps network fee tooltip #9614
Conversation
|
CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes. |
danjm
force-pushed
the
update-swaps-network-fee-tooltip
branch
from
8dcf433 to
663c222
Compare
Builds ready [663c222]
Page Load Metrics (357 ± 39 ms)
|
| position="top" | ||
| contentText={( | ||
| <div className="fee-card__info-tooltip-content-container"> | ||
| <div>{ t('swapGasFeeSummary') }</div> |
There was a problem hiding this comment.
Should these divs be paragraphs instead of divs to maintain semantic HTML?
| @@ -22,6 +22,30 @@ export default function FeeCard ({ | |||
| <div className="fee-card__row-header-text--bold"> | |||
| {t('swapEstimatedNetworkFee')} | |||
| </div> | |||
| <div className="fee-card__row-label fee-card__info-tooltip-container"> | |||
There was a problem hiding this comment.
Tooltip exposes two props that would make two of these divs obsolete if we add them to InfoTooltip. containerClassName could be set to fee-card__info-tooltip-content-container and wrapperClassName could be set to fee-card__row-label fee-card__info-tooltip-container and then two extra divs are no longer necessary.
| width: 10px; | ||
| justify-content: center; | ||
|
|
||
| > div { |
There was a problem hiding this comment.
rather than relying on tag names I think I would prefer a classname be added to those p tags (if suggestion is taken, div if not)
danjm
force-pushed
the
update-swaps-network-fee-tooltip
branch
from
51ad4cc to
69c8b88
Compare
|
@brad-decker your comments have been addressed in the latest commit |
Builds ready [69c8b88]
Page Load Metrics (408 ± 46 ms)
|
This PR updates the network fee tooltip in the fee card to match the latest designs https://www.figma.com/file/fDtda1cs3MmPXw1MgKswZc/Development---MetaSwaps?node-id=1315%3A1308
The tooltip has been moved from the max fee row to the estimated fee row and its content has been changed.
Demo gif: