diff --git a/packages/account/src/Configs/get-mt5-status-badge-config.tsx b/packages/account/src/Configs/get-mt5-status-badge-config.tsx index 78f4a90fac79..4bbf91813611 100644 --- a/packages/account/src/Configs/get-mt5-status-badge-config.tsx +++ b/packages/account/src/Configs/get-mt5-status-badge-config.tsx @@ -43,7 +43,7 @@ const getMT5StatusBadgeConfig = (mt5_account_status: TMT5AccountStatus) => { }; case TRADING_PLATFORM_STATUS.UNAVAILABLE: return { - text: , + text: , icon: 'IcAlertWarning', }; default: diff --git a/packages/account/src/Configs/get-status-badge-config.tsx b/packages/account/src/Configs/get-status-badge-config.tsx index cce0f1fcb352..5c833b1c6b9d 100644 --- a/packages/account/src/Configs/get-status-badge-config.tsx +++ b/packages/account/src/Configs/get-status-badge-config.tsx @@ -1,8 +1,11 @@ import React from 'react'; -import { ACCOUNT_BADGE_STATUS, TAccountBadgeStatus } from '@deriv/shared'; +import { Text } from '@deriv/components'; +import { ACCOUNT_BADGE_STATUS, MT5_ACCOUNT_STATUS, TAccountBadgeStatus, TRADING_PLATFORM_STATUS } from '@deriv/shared'; import { Localize } from '@deriv-com/translations'; const getStatusBadgeConfig = (account_status: TAccountBadgeStatus) => { + const BadgeTextComponent = ; + switch (account_status) { case ACCOUNT_BADGE_STATUS.PENDING: return { @@ -15,13 +18,22 @@ const getStatusBadgeConfig = (account_status: TAccountBadgeStatus) => { icon: 'IcMt5Failed', icon_size: '18', }; - case ACCOUNT_BADGE_STATUS.NEEDS_VERIFICATION: { + case ACCOUNT_BADGE_STATUS.NEEDS_VERIFICATION: return { text: , icon: 'IcMt5Verification', icon_size: '18', }; - } + case MT5_ACCOUNT_STATUS.UNDER_MAINTENANCE: + return { + text: , + icon: 'IcAlertWarning', + }; + case TRADING_PLATFORM_STATUS.UNAVAILABLE: + return { + text: , + icon: 'IcAlertWarning', + }; default: return { text: '', diff --git a/packages/appstore/src/components/cfds-listing/cfds-listing.scss b/packages/appstore/src/components/cfds-listing/cfds-listing.scss index 1db53c07acbb..af915a186304 100644 --- a/packages/appstore/src/components/cfds-listing/cfds-listing.scss +++ b/packages/appstore/src/components/cfds-listing/cfds-listing.scss @@ -1773,6 +1773,9 @@ flex-direction: column; justify-content: flex-start; align-items: flex-start; + @include mobile-or-tablet-screen { + padding: 0.8rem 1.6rem; + } } .dc-input { &__label { diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx index cd11bfbd12be..826396b2646d 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx @@ -80,7 +80,7 @@ const AccountOption = ({ ); } @@ -410,9 +410,7 @@ const AccountTransferForm = observer( if (is_migration_status_present) { hint_text = ; } else if (is_unavailable_status_present) { - hint_text = ( - - ); + hint_text = ; } else if (is_maintenance_status_present) { hint_text = ( { has_close_icon width={isDesktop() ? '440px' : '328px'} > - + ]} /> - diff --git a/packages/cfd/src/Containers/mt5-account-unavailable-modal.tsx b/packages/cfd/src/Containers/mt5-account-unavailable-modal.tsx index 44e66d64dcd9..bd6260a0ebed 100644 --- a/packages/cfd/src/Containers/mt5-account-unavailable-modal.tsx +++ b/packages/cfd/src/Containers/mt5-account-unavailable-modal.tsx @@ -15,13 +15,13 @@ const MT5AccountUnavailableModal = observer(() => { setAccountUnavailableModal(false)} has_close_icon width={isDesktop ? '440px' : '328px'} > - - + +