m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

EIP-1559 - Ensure transaction detail font-size and icon colors are consistent with Figma design (#11735)

Browse Source
This commit is contained in:
David Walsh 2021-08-02 21:08:20 -05:00 committed by Dan Miller
parent 3b2b5c018f
commit ce61eaacdf
4 changed files with 41 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/components/app/advanced-gas-controls/index.scss
View File

@ -30,6 +30,6 @@
} }
path { path {
fill: #dadada; fill: $ui-3;
} }
} }

4
ui/components/app/transaction-detail-item/index.scss
View File

@ -14,6 +14,10 @@
.info-tooltip { .info-tooltip {
display: inline-block; display: inline-block;
margin-inline-start: 4px; margin-inline-start: 4px;
path {
fill: $ui-3;
}
} }
&__total { &__total {

6
ui/components/app/transaction-detail-item/transaction-detail-item.component.js
View File

@ -22,14 +22,14 @@ export default function TransactionDetailItem({
<Typography <Typography
color={detailTitleColor} color={detailTitleColor}
fontWeight={FONT_WEIGHT.BOLD} fontWeight={FONT_WEIGHT.BOLD}
variant={TYPOGRAPHY.H7} variant={TYPOGRAPHY.H6}
className="transaction-detail-item__title" className="transaction-detail-item__title"
> >
{detailTitle} {detailTitle}
</Typography> </Typography>
{detailText && ( {detailText && (
<Typography <Typography
variant={TYPOGRAPHY.H7} variant={TYPOGRAPHY.H6}
className="transaction-detail-item__detail-text" className="transaction-detail-item__detail-text"
color={COLORS.UI4} color={COLORS.UI4}
> >
@ -39,7 +39,7 @@ export default function TransactionDetailItem({
<Typography <Typography
color={COLORS.BLACK} color={COLORS.BLACK}
fontWeight={FONT_WEIGHT.BOLD} fontWeight={FONT_WEIGHT.BOLD}
variant={TYPOGRAPHY.H7} variant={TYPOGRAPHY.H6}
className="transaction-detail-item__total" className="transaction-detail-item__total"
> >
{detailTotal} {detailTotal}

59
ui/pages/confirm-transaction-base/confirm-transaction-base.component.js
View File

@ -331,7 +331,6 @@ export default class ConfirmTransactionBase extends Component {
<InfoTooltip <InfoTooltip
contentText={t('transactionDetailDappGasTooltip')} contentText={t('transactionDetailDappGasTooltip')}
position="top" position="top"
iconFillColor="#f66a0a"
> >
<i className="fa fa-info-circle" /> <i className="fa fa-info-circle" />
</InfoTooltip> </InfoTooltip>
@ -379,17 +378,21 @@ export default class ConfirmTransactionBase extends Component {
hideLabel hideLabel
/> />
} }
subText={t('editGasSubTextFee', [ subText={
<UserPreferencedCurrencyDisplay <strong>
key="gas-subtext" {t('editGasSubTextFee', [
type={SECONDARY} <UserPreferencedCurrencyDisplay
value={getHexGasTotal({ key="gas-subtext"
gasPrice: txData.txParams.maxFeePerGas, type={SECONDARY}
gasLimit: txData.txParams.gas, value={getHexGasTotal({
})} gasPrice: txData.txParams.maxFeePerGas,
hideLabel gasLimit: txData.txParams.gas,
/>, })}
])} hideLabel
/>,
])}
</strong>
}
subTitle={ subTitle={
<GasTiming <GasTiming
maxPriorityFeePerGas={txData.txParams.maxPriorityFeePerGas} maxPriorityFeePerGas={txData.txParams.maxPriorityFeePerGas}
@ -418,20 +421,24 @@ export default class ConfirmTransactionBase extends Component {
secondaryTotalTextOverride || secondaryTotalTextOverride ||
t('transactionDetailGasTotalSubtitle') t('transactionDetailGasTotalSubtitle')
} }
subText={t('editGasSubTextAmount', [ subText={
<UserPreferencedCurrencyDisplay <strong>
key="gas-total-subtext" {t('editGasSubTextAmount', [
type={SECONDARY} <UserPreferencedCurrencyDisplay
value={addHexes( key="gas-total-subtext"
txData.txParams.value, type={SECONDARY}
getHexGasTotal({ value={addHexes(
gasPrice: txData.txParams.maxFeePerGas, txData.txParams.value,
gasLimit: txData.txParams.gas, getHexGasTotal({
}), gasPrice: txData.txParams.maxFeePerGas,
)} gasLimit: txData.txParams.gas,
hideLabel }),
/>, )}
])} hideLabel
/>,
])}
</strong>
}
/>, />,
]} ]}
/> />