From 0ba4655778f40d91cc3ad4534bb5c7828d45c9dd Mon Sep 17 00:00:00 2001 From: sunilsabatp <101264823+sunilsabatp@users.noreply.github.com> Date: Tue, 19 Apr 2022 20:44:49 +0530 Subject: [PATCH 1/2] Change background of Planet Logo in Header in dark mode --- public/assets/images/planetDarkLogo.svg | 1 + src/features/common/Layout/Navbar/index.tsx | 52 +++++++++++++-------- 2 files changed, 34 insertions(+), 19 deletions(-) create mode 100644 public/assets/images/planetDarkLogo.svg diff --git a/public/assets/images/planetDarkLogo.svg b/public/assets/images/planetDarkLogo.svg new file mode 100644 index 0000000000..35175a6f7e --- /dev/null +++ b/public/assets/images/planetDarkLogo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/features/common/Layout/Navbar/index.tsx b/src/features/common/Layout/Navbar/index.tsx index 6efebe2cd1..c6f8e3f9a9 100644 --- a/src/features/common/Layout/Navbar/index.tsx +++ b/src/features/common/Layout/Navbar/index.tsx @@ -11,7 +11,8 @@ import getImageUrl from '../../../../utils/getImageURL'; import { UserPropsContext } from '../UserPropsContext'; import GetNavBarIcon from './getNavBarIcon'; import GetSubMenu from './getSubMenu'; -import { lang_path } from '../../../../utils/constants/wpLanguages' +import { lang_path } from '../../../../utils/constants/wpLanguages'; + // used to detect window resize and return the current width of the window const useWidth = () => { const [width, setWidth] = React.useState(0); // default width, detect on server. @@ -35,8 +36,8 @@ export default function NavbarComponent(props: any) { yucatan: 'yucatan', partners: 'partners', changeChocolate: 'change-chocolate', - stopTalkingStartPlanting: 'stop-talking-start-planting' - } + stopTalkingStartPlanting: 'stop-talking-start-planting', + }; const [menu, setMenu] = React.useState(false); const [isMobile, setIsMobile] = React.useState(false); const [mobileWidth, setMobileWidth] = React.useState(false); @@ -75,7 +76,7 @@ export default function NavbarComponent(props: any) { } } - const { toggleTheme } = React.useContext(ThemeContext); + const { toggleTheme, theme } = React.useContext(ThemeContext); // if (isLoading) { // return
; @@ -162,12 +163,13 @@ export default function NavbarComponent(props: any) { ); } if (link === 'about' && SingleLink.visible) { - let aboutOnclick = `${SingleLink.onclick}${(process.env.TENANT === 'planet' || + let aboutOnclick = `${SingleLink.onclick}${ + (process.env.TENANT === 'planet' || process.env.TENANT === 'ttc') && - lang_path[i18n.language] + lang_path[i18n.language] ? lang_path[i18n.language] : '' - }`; + }`; aboutOnclick = isMobile ? '' : aboutOnclick; SingleLink = { @@ -179,7 +181,7 @@ export default function NavbarComponent(props: any) { } } if (link === 'shop' && mobileWidth) { - SingleLink.visible = false + SingleLink.visible = false; } return SingleLink.visible ? (
- +
)} - - {t('common:about_pftp')} - + {theme === 'theme-light' ? ( + + {t('common:about_pftp')} + + ) : ( + + {t('common:about_pftp')} + + )}
{ready && }
From fced9ad60de7459299bfcd582a4b7e98208bd3d5 Mon Sep 17 00:00:00 2001 From: sunilsabatp <101264823+sunilsabatp@users.noreply.github.com> Date: Thu, 21 Apr 2022 12:22:06 +0530 Subject: [PATCH 2/2] change the contrast of the switcher of Explore Model toggle --- src/features/common/InputTypes/ToggleSwitch.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/features/common/InputTypes/ToggleSwitch.tsx b/src/features/common/InputTypes/ToggleSwitch.tsx index 61c27daf89..3634399ca6 100644 --- a/src/features/common/InputTypes/ToggleSwitch.tsx +++ b/src/features/common/InputTypes/ToggleSwitch.tsx @@ -13,7 +13,9 @@ export default function ToggleSwitch(props: any) { }, }, checked: {}, - track: {}, + track: { + backgroundColor: '#787878', + }, })(Switch); return (