From 477b16a945da4d2c93452117ac8a014b62769ba0 Mon Sep 17 00:00:00 2001 From: vinu-deriv Date: Mon, 24 Jun 2024 14:37:37 +0400 Subject: [PATCH] feat: updated the content and duration of deriv bot migration banner --- public/images/move-to-deriv.svg | 153 ------------------ public/images/upgrade-to-deriv-bot.svg | 31 ++++ src/components/Banner/move-to-dbot-banner.jsx | 41 ++--- .../Banner/move-to-dbot-banner.scss | 19 ++- .../deriv-app-modal/deriv-app-modal.scss | 19 ++- 5 files changed, 66 insertions(+), 197 deletions(-) delete mode 100644 public/images/move-to-deriv.svg create mode 100644 public/images/upgrade-to-deriv-bot.svg diff --git a/public/images/move-to-deriv.svg b/public/images/move-to-deriv.svg deleted file mode 100644 index f5832924a..000000000 --- a/public/images/move-to-deriv.svg +++ /dev/null @@ -1,153 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/public/images/upgrade-to-deriv-bot.svg b/public/images/upgrade-to-deriv-bot.svg new file mode 100644 index 000000000..d2ae4403f --- /dev/null +++ b/public/images/upgrade-to-deriv-bot.svg @@ -0,0 +1,31 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/Banner/move-to-dbot-banner.jsx b/src/components/Banner/move-to-dbot-banner.jsx index 86bb013d9..2534f767f 100644 --- a/src/components/Banner/move-to-dbot-banner.jsx +++ b/src/components/Banner/move-to-dbot-banner.jsx @@ -25,7 +25,7 @@ const shouldShowPopup = () => { return true; } - const allowed_delay = 7; // One week in days + const allowed_delay = 1; // One week in days const last_popup_date = new Date(last_deriv_redirect_popup_time); const current_date = new Date(); @@ -60,45 +60,26 @@ const MoveToDbotBanner = () => {
{open_modal && (
- move to deriv -
-
- {translate('Take your bot trading to the next level')} + move to deriv
+
{translate('Binary bot is retiring soon')}
-
{translate('On Deriv Bot, you\'ll enjoy:')}
-
    -
  • - {translate('New features and tools with faster execution and enhanced stability')} -
    • -
  • {translate('The ability to use your existing XML files from Binary Bot')}
    • -
  • - {translate( - 'A familiar drag-and-drop interface; create and customise your trading bot easily' - )} -
    • -
-
- {translate('What are you waiting for?')}{' '} - - {translate('Explore Deriv Bot')} - {' '} - {translate('today and unlock new trading possibilities!')} -
+

{translate('Binary bot will be discontinued soon.')}

+

+ {translate( + 'Import your existing strategies (XML files) to Deriv Bot today and enjoy a faster, more efficient trading experience with advanced features.' + )} +

diff --git a/src/components/Banner/move-to-dbot-banner.scss b/src/components/Banner/move-to-dbot-banner.scss index 6719df892..f4e030d76 100644 --- a/src/components/Banner/move-to-dbot-banner.scss +++ b/src/components/Banner/move-to-dbot-banner.scss @@ -12,15 +12,21 @@ .mv-dbot-banner { text-align: center; - padding: 32px 108px; + padding: 16px 24px; + width: 440px; @include mobile { - padding: 28px; + padding: 16px; + width: 100%; } &__title { - font-size: var(--font-size-l); + font-size: 20px; font-weight: bold; margin-bottom: 16px; + + @include mobile { + font-size: var(--font-size-n); + } } &__content { @@ -28,17 +34,14 @@ font-size: var(--font-size-s); line-height: 20px; text-align: left; - ol, - ul { - list-style: disc; + p { line-height: 20px; - padding: 0px 32px; } } &__icon-container { display: flex; align-items: center; justify-content: center; - margin-bottom: 24px; + margin-bottom: 16px; } } diff --git a/src/components/common/deriv-app-modal/deriv-app-modal.scss b/src/components/common/deriv-app-modal/deriv-app-modal.scss index 7500b7ed7..d29f8abd2 100644 --- a/src/components/common/deriv-app-modal/deriv-app-modal.scss +++ b/src/components/common/deriv-app-modal/deriv-app-modal.scss @@ -72,10 +72,14 @@ } &-title { - font-size: var(--font-size-l); + font-size: var(--font-size-n); font-weight: bold; margin: 0; - padding: 16px; + padding: 24px; + @include mobile { + padding: 16px; + font-size: var(--font-size-s); + } } } @@ -96,9 +100,12 @@ display: flex; justify-content: flex-end; align-items: center; - padding: 8px 16px; + padding: 16px 24px; border: none; border-top: 1px solid var(--border-normal); + @include mobile { + padding: 16px; + } &__btn-container { @include mobile { display: flex; @@ -108,10 +115,10 @@ } &__btn-container, * { - margin: 4px; - font-weight: 600; - font-size: medium; + font-weight: 700; + font-size: var(--font-size-s); text-transform: none; + line-height: 20px; } &-primary-btn { background: var(--button-primary-default);