From bd6353b0184e7e124d7f1ef9e4279691c4e65ee5 Mon Sep 17 00:00:00 2001 From: Henry Hein Date: Fri, 31 May 2024 11:18:10 +0800 Subject: [PATCH 1/8] fix: make header for wallets and reguler headers --- src/sass/_common/header.scss | 15 ++++++++++--- src/templates/_common/_layout/header.jsx | 10 ++++++++- .../_common/_layout/wallet-header.jsx | 22 ++++++++++++++----- 3 files changed, 38 insertions(+), 9 deletions(-) diff --git a/src/sass/_common/header.scss b/src/sass/_common/header.scss index 29c9cf6ca2d..d93218c84b7 100644 --- a/src/sass/_common/header.scss +++ b/src/sass/_common/header.scss @@ -178,6 +178,12 @@ body .header, .wallet__header { border: none; z-index: 1; + &-divider { + background: var(--general-section-2); + height: 30px; + width: 1px; + margin-left: 8px; + } .is-login, .is-logout { display: none; } @@ -256,6 +262,12 @@ body .header, .wallet__header { } } &__hamburger { + &--container { + border-right: 1px solid var(--general-section-1); + height: 100%; + align-items: center; + display: flex; + } padding: 0 12px; width: 20px; height: 20px; @@ -1058,9 +1070,6 @@ body .mobile { height: 40px !important; &__menu { - &-left { - border-right: 1px solid var(--general-section-1); - } &-acc { position: unset; } diff --git a/src/templates/_common/_layout/header.jsx b/src/templates/_common/_layout/header.jsx index f9fdcff4927..e0b94eaca79 100644 --- a/src/templates/_common/_layout/header.jsx +++ b/src/templates/_common/_layout/header.jsx @@ -9,7 +9,15 @@ const Header = () => (
- + + + +
+ + + +
+
diff --git a/src/templates/_common/_layout/wallet-header.jsx b/src/templates/_common/_layout/wallet-header.jsx index 49a653cf1ae..cd1b3778f8f 100644 --- a/src/templates/_common/_layout/wallet-header.jsx +++ b/src/templates/_common/_layout/wallet-header.jsx @@ -9,15 +9,21 @@ const WalletHeader = () => (
- -
+ + + + -
- - +
+
@@ -80,6 +86,12 @@ const WalletHeader = () => (
{it.L('Manage funds')}
+
+
+ + {it.L('Sign up')} +
+
From f6171128d1ed20821f1a640b81d20eada421f26b Mon Sep 17 00:00:00 2001 From: Henry Hein Date: Fri, 31 May 2024 15:57:19 +0800 Subject: [PATCH 2/8] fix: mimic regular and wallet header with dtrader production --- build/webpack/plugins.js | 17 +++++++++++++---- src/javascript/app/base/header.js | 2 ++ src/javascript/config.js | 2 +- src/sass/_common/header.scss | 3 +++ src/templates/_common/_layout/header.jsx | 7 ++++++- src/templates/_common/_layout/wallet-header.jsx | 5 +++-- 6 files changed, 28 insertions(+), 8 deletions(-) diff --git a/build/webpack/plugins.js b/build/webpack/plugins.js index d0046678c29..fac7b563f8e 100644 --- a/build/webpack/plugins.js +++ b/build/webpack/plugins.js @@ -15,13 +15,17 @@ class WatchRunPlugin { // eslint-disable-next-line no-console console.log('\n'); this.grunt.log.ok('Build started at:', new Date().toString().grey); - + if (comp.modifiedFiles) { - const changed_files = Array.from(comp.modifiedFiles, (file) => `\n ${file}`).join(''); + const changed_files = Array.from(comp.modifiedFiles); + this.grunt.log.ok(`Changed file${changed_files.length > 1 ? 's' : ''}:`); - changed_files.forEach((file) =>{ + + changed_files.forEach((file) => { const file_path = file.replace(process.cwd(), '.').match(/(.*\/)(.*(?!\/))$/); - this.grunt.log.write(' -'.green, file_path[1].grey, `\b${file_path[2]}\n`); + if (file_path) { + this.grunt.log.write(' -'.green, file_path[1].grey, `\b${file_path[2]}\n`); + } }); } }); @@ -62,6 +66,11 @@ const getPlugins = (app, grunt) => ([ openAnalyzer : false, }), ]), + new webpack.DefinePlugin({ + 'process.env': { + BUILD_HASH: JSON.stringify(CryptoJS.MD5(Date.now().toString()).toString()), + }, + }), ] ), ]); diff --git a/src/javascript/app/base/header.js b/src/javascript/app/base/header.js index 2150cca6bc5..b9db88ebb6f 100644 --- a/src/javascript/app/base/header.js +++ b/src/javascript/app/base/header.js @@ -50,6 +50,8 @@ const Header = (() => { bindClick(); }); if (Client.isLoggedIn()) { + const wallet_divider = getElementById('wallet-divider'); + if (wallet_divider) wallet_divider.style.display = 'none'; displayAccountStatus(); } fullscreen_map.event.forEach(event => { diff --git a/src/javascript/config.js b/src/javascript/config.js index a8b2c8c32d9..2d4554d9b8f 100644 --- a/src/javascript/config.js +++ b/src/javascript/config.js @@ -106,7 +106,7 @@ const getSocketURL = () => { const loginid = window.localStorage.getItem('active_loginid'); const is_real = loginid && !/^VRT/.test(loginid); - const server = isProduction() && is_real ? 'green' : 'blue'; + const server = isProduction() && is_real ? 'green' : 'red'; server_url = `${server}.derivws.com`; } diff --git a/src/sass/_common/header.scss b/src/sass/_common/header.scss index d93218c84b7..76a974dee4f 100644 --- a/src/sass/_common/header.scss +++ b/src/sass/_common/header.scss @@ -1060,6 +1060,9 @@ body .mobile { } @media only screen and (max-width: 879px) { + .mobile-hide-wallet { + display: none; + } .mobile-hide { display: none !important; } diff --git a/src/templates/_common/_layout/header.jsx b/src/templates/_common/_layout/header.jsx index e0b94eaca79..9ca055529a8 100644 --- a/src/templates/_common/_layout/header.jsx +++ b/src/templates/_common/_layout/header.jsx @@ -12,7 +12,12 @@ const Header = () => ( -
+
+ + + +
+
diff --git a/src/templates/_common/_layout/wallet-header.jsx b/src/templates/_common/_layout/wallet-header.jsx index cd1b3778f8f..4507d373443 100644 --- a/src/templates/_common/_layout/wallet-header.jsx +++ b/src/templates/_common/_layout/wallet-header.jsx @@ -12,12 +12,12 @@ const WalletHeader = () => ( -
+ -
+
+
From cba94a01def7fd6c5d2dfa814bdaf8ac01f959dc Mon Sep 17 00:00:00 2001 From: Henry Hein Date: Tue, 4 Jun 2024 09:47:58 +0800 Subject: [PATCH 3/8] fix: remove extra space --- build/webpack/plugins.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/build/webpack/plugins.js b/build/webpack/plugins.js index fac7b563f8e..8131a8c4973 100644 --- a/build/webpack/plugins.js +++ b/build/webpack/plugins.js @@ -15,7 +15,7 @@ class WatchRunPlugin { // eslint-disable-next-line no-console console.log('\n'); this.grunt.log.ok('Build started at:', new Date().toString().grey); - + if (comp.modifiedFiles) { const changed_files = Array.from(comp.modifiedFiles); From 016a980bb0fcfed04a2ea61308217c6ce99325e4 Mon Sep 17 00:00:00 2001 From: Henry Hein Date: Tue, 4 Jun 2024 15:20:14 +0800 Subject: [PATCH 4/8] fix: move traders hub to left side of platform switcher and show traders hub when logged out --- src/templates/_common/_layout/header.jsx | 12 ++++++++++-- src/templates/_common/_layout/wallet-header.jsx | 2 +- src/templates/_common/components/mobile_menu.jsx | 2 +- 3 files changed, 12 insertions(+), 4 deletions(-) diff --git a/src/templates/_common/_layout/header.jsx b/src/templates/_common/_layout/header.jsx index 9ca055529a8..e0ec7c26a2e 100644 --- a/src/templates/_common/_layout/header.jsx +++ b/src/templates/_common/_layout/header.jsx @@ -23,17 +23,25 @@ const Header = () => (
+
-
+
diff --git a/src/templates/_common/components/mobile_menu.jsx b/src/templates/_common/components/mobile_menu.jsx index 5d72128d47b..1dee620d8ea 100644 --- a/src/templates/_common/components/mobile_menu.jsx +++ b/src/templates/_common/components/mobile_menu.jsx @@ -20,7 +20,7 @@ const MobileMenu = () => (
-
+
{it.L('Trader\'s hub')}
From e47a86482680fd067ea0296cefba3afa6c9f3b45 Mon Sep 17 00:00:00 2001 From: Henry Hein Date: Wed, 5 Jun 2024 10:01:21 +0800 Subject: [PATCH 5/8] fix: remove unused code --- src/templates/_common/_layout/header.jsx | 6 ------ 1 file changed, 6 deletions(-) diff --git a/src/templates/_common/_layout/header.jsx b/src/templates/_common/_layout/header.jsx index e0ec7c26a2e..8336dda00d7 100644 --- a/src/templates/_common/_layout/header.jsx +++ b/src/templates/_common/_layout/header.jsx @@ -36,12 +36,6 @@ const Header = () => (
- {/* - - - {it.L('Trader\'s hub')} - - */} From b4c24c463fc28edb2da1a07a13c1cfb46e9a2a4e Mon Sep 17 00:00:00 2001 From: Henry Hein Date: Wed, 5 Jun 2024 17:09:34 +0800 Subject: [PATCH 6/8] fix: swap logo --- src/images/pages/header/ic-appstore-home.svg | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/images/pages/header/ic-appstore-home.svg b/src/images/pages/header/ic-appstore-home.svg index a2a6018b867..7261edff828 100644 --- a/src/images/pages/header/ic-appstore-home.svg +++ b/src/images/pages/header/ic-appstore-home.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file From e5efc5e439a1a92e5713203fd53f9c353917dfa6 Mon Sep 17 00:00:00 2001 From: Henry Hein Date: Wed, 5 Jun 2024 17:22:22 +0800 Subject: [PATCH 7/8] fix: add deriv.com to mobile menu --- src/images/pages/header/deriv-com-logo.svg | 1 + src/javascript/app/base/header.js | 4 ++++ src/sass/_common/header.scss | 2 +- src/templates/_common/components/mobile_menu.jsx | 6 ++++++ 4 files changed, 12 insertions(+), 1 deletion(-) create mode 100644 src/images/pages/header/deriv-com-logo.svg diff --git a/src/images/pages/header/deriv-com-logo.svg b/src/images/pages/header/deriv-com-logo.svg new file mode 100644 index 00000000000..80dd2dd5ee8 --- /dev/null +++ b/src/images/pages/header/deriv-com-logo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/javascript/app/base/header.js b/src/javascript/app/base/header.js index b9db88ebb6f..34aa943408c 100644 --- a/src/javascript/app/base/header.js +++ b/src/javascript/app/base/header.js @@ -192,6 +192,10 @@ const Header = (() => { el.src = Url.urlForStatic(`${wallet_header_icon_base_path}wallet-deriv-logo.svg?${process.env.BUILD_HASH}`); }); + applyToAllElements('.deriv-com-logo-mobile', (el) => { + el.src = Url.urlForStatic(`${header_icon_base_path}deriv-com-logo.svg?${process.env.BUILD_HASH}`); + }); + applyToAllElements('#mobile__platform-switcher-icon-trade', (el) => { el.src = Url.urlForStatic(`${header_icon_base_path}ic-trade.svg?${process.env.BUILD_HASH}`); }); diff --git a/src/sass/_common/header.scss b/src/sass/_common/header.scss index 76a974dee4f..919335a38f4 100644 --- a/src/sass/_common/header.scss +++ b/src/sass/_common/header.scss @@ -1165,7 +1165,7 @@ body #topbar { } } -.url-appstore { +.url-appstore, .url-deriv-com-mobile { display: flex; font-weight: normal; text-transform: none !important; diff --git a/src/templates/_common/components/mobile_menu.jsx b/src/templates/_common/components/mobile_menu.jsx index 1dee620d8ea..6dcaa0a8955 100644 --- a/src/templates/_common/components/mobile_menu.jsx +++ b/src/templates/_common/components/mobile_menu.jsx @@ -20,6 +20,12 @@ const MobileMenu = () => (
+
From cf9a2b92393198f6378b25a1d83794b35c937289 Mon Sep 17 00:00:00 2001 From: Henry Hein Date: Wed, 5 Jun 2024 18:43:56 +0800 Subject: [PATCH 8/8] fix: label and icon alignment --- src/sass/_common/header.scss | 5 +++++ src/templates/_common/_layout/header.jsx | 6 +++--- src/templates/_common/_layout/wallet-header.jsx | 4 ++-- 3 files changed, 10 insertions(+), 5 deletions(-) diff --git a/src/sass/_common/header.scss b/src/sass/_common/header.scss index 919335a38f4..fb2c39b3ed0 100644 --- a/src/sass/_common/header.scss +++ b/src/sass/_common/header.scss @@ -215,6 +215,11 @@ body .header, .wallet__header { &-item { height: 100%; align-self: center; + + &--label { + display: flex; + align-items: center; + } } &-links { display: flex; diff --git a/src/templates/_common/_layout/header.jsx b/src/templates/_common/_layout/header.jsx index 8336dda00d7..648c99077b0 100644 --- a/src/templates/_common/_layout/header.jsx +++ b/src/templates/_common/_layout/header.jsx @@ -25,7 +25,7 @@ const Header = () => (