diff --git a/.changeset/fast-islands-dress.md b/.changeset/fast-islands-dress.md new file mode 100644 index 000000000..5a2e665ae --- /dev/null +++ b/.changeset/fast-islands-dress.md @@ -0,0 +1,5 @@ +--- +"fuels-wallet": patch +--- + +Improve design of alerts in submitted transactions diff --git a/packages/app/src/systems/Transaction/components/TxStatusAlert/TxStatusAlert.tsx b/packages/app/src/systems/Transaction/components/TxStatusAlert/TxStatusAlert.tsx index 833bc8d1f..578c27df5 100644 --- a/packages/app/src/systems/Transaction/components/TxStatusAlert/TxStatusAlert.tsx +++ b/packages/app/src/systems/Transaction/components/TxStatusAlert/TxStatusAlert.tsx @@ -66,16 +66,22 @@ const styles = { root: (color: string) => { const cssColor = color ? `$${color}` : undefined; return cssObj({ + marginBottom: '$4', '.fuel_Alert-icon': { - alignSelf: 'flex-start', + alignItems: 'center', mt: '2px', color: cssColor, + marginBottom: '$0', '& .fuel_Icon': { mt: '1px', color: cssColor, }, }, + '& .fuel_Alert-content': { + alignItems: 'center', + marginBottom: '$0', + }, '& .fuel_Heading, & .fuel_Icon': { color: cssColor, },