Merge pull request #83 from farabi-deriv/farabi/bot-2283/fix-react-to…

…astify Farabi/bot-2283/fix-react-toastify
deriv-com · Oct 14, 2024 · 22e5d7e · 22e5d7e
2 parents feb7a52 + 93b8066
commit 22e5d7e
Show file tree

Hide file tree

Showing 6 changed files with 29 additions and 23 deletions.
diff --git a/src/app/app-content.jsx b/src/app/app-content.jsx
@@ -17,6 +17,7 @@ import BotBuilder from '../pages/bot-builder';
 import Main from '../pages/main';
 import './app.scss';
 import 'react-toastify/dist/ReactToastify.css';
+import '../components/bot-notification/bot-notification.scss';
 
 const AppContent = () => {
     const { localize } = useTranslations();

diff --git a/src/components/layout/footer/index.tsx b/src/components/layout/footer/index.tsx
@@ -46,7 +46,11 @@ const Footer = () => {
                     isModalOpen
                     languages={LANGUAGES}
                     onClose={hideModal}
-                    onLanguageSwitch={code => switchLanguage(code)}
+                    onLanguageSwitch={code => {
+                        switchLanguage(code);
+                        hideModal();
+                        window.location.reload();
+                    }}
                     selectedLanguage={currentLang}
                 />
             )}

diff --git a/src/components/layout/header/custom-notifications/custom-notifications.scss b/src/components/layout/header/custom-notifications/custom-notifications.scss
@@ -1,8 +1,14 @@
+@use 'components/shared/styles/mixins' as *;
+
 .notifications__wrapper {
     padding-inline-start: 0.5rem;
     border-inline-start: 1px solid var(--general-section-1);
     border-width: 1px;
-    margin-inline-end: 1rem;
+    margin-inline-end: 2.4rem;
+
+    @include mobile-screen {
+        margin-inline-end: 0;
+    }
 
     &--desktop {
         z-index: 10;

diff --git a/src/components/layout/header/header.scss b/src/components/layout/header/header.scss
@@ -1,8 +1,7 @@
 @use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
 
 .app-header {
-    padding-inline-end: 20px;
-
     &__account-settings {
         padding-inline-end: 0.75rem;
         border-inline-end: 0.1rem solid var(--general-section-1);
@@ -42,8 +41,8 @@
 }
 
 .deriv-account-switcher {
-    &__button {
-        margin: 0 1.6rem 0 1.7rem;
+    &__balance {
+        padding: 0 1rem 0.1rem 0;
     }
 
     &__list {
@@ -113,9 +112,5 @@
     button {
         font-weight: 400;
         margin-right: 1.6rem;
-
-        &:last-child {
-            margin-right: 0;
-        }
     }
 }
diff --git a/src/components/layout/header/header.tsx b/src/components/layout/header/header.tsx
@@ -1,6 +1,5 @@
 import clsx from 'clsx';
 import Button from '@/components/shared_ui/button';
-import Text from '@/components/shared_ui/text';
 import useActiveAccount from '@/hooks/api/account/useActiveAccount';
 import { StandaloneCircleUserRegularIcon } from '@deriv/quill-icons/Standalone';
 import { useAuthData } from '@deriv-com/api-hooks';
@@ -45,30 +44,31 @@ const AppHeader = () => {
                         </Tooltip>
                     )}
                     <AccountSwitcher activeAccount={activeAccount} />
-                    <Button
-                        onClick={() => {
-                            window.location.assign('https://app.deriv.com/cashier/deposit');
-                        }}
-                        className='deposit-button'
-                    >
-                        <Text size='s' weight='bold'>
-                            {localize('Deposit')}
-                        </Text>
-                    </Button>
+                    {isDesktop && (
+                        <Button
+                            onClick={() => {
+                                window.location.assign('https://app.deriv.com/cashier/deposit');
+                            }}
+                            className='deposit-button'
+                        >
+                            <Button primary>{localize('Deposit')}</Button>
+                        </Button>
+                    )}
                 </>
             );
         } else {
             return (
                 <div className='auth-actions'>
                     <Button
-                        color='primary-light'
+                        tertiary
                         onClick={() => {
                             window.location.assign(getOauthURL());
                         }}
                     >
                         <Localize i18n_default_text='Log in' />
                     </Button>
                     <Button
+                        primary
                         onClick={() => {
                             window.location.assign(getOauthURL());
                         }}

diff --git a/src/components/layout/header/platform-switcher/platform-switcher.tsx b/src/components/layout/header/platform-switcher/platform-switcher.tsx
@@ -10,7 +10,7 @@ const PlatformSwitcher = () => {
         <UIPlatformSwitcher
             bottomLinkLabel={localize('Looking for CFDs? Go to Trader’s Hub')}
             buttonProps={{
-                icon: platformsConfig[0].buttonIcon,
+                icon: platformsConfig[1].buttonIcon,
             }}
         >
             {platformsConfig.map(({ active, description, href, icon }) => (