From a506dc5511e19bbf948ba96cab23489e2c55bbc3 Mon Sep 17 00:00:00 2001
From: Xiao Yijun <xiaoyijun@silverhand.io>
Date: Thu, 2 Jun 2022 13:20:15 +0800
Subject: [PATCH] fix(console): display dark mode color setting only when dark
 mode is enabled (#1027)

---
 .../components/BrandingForm.tsx               | 26 ++++++++++---------
 1 file changed, 14 insertions(+), 12 deletions(-)

diff --git a/packages/console/src/pages/SignInExperience/components/BrandingForm.tsx b/packages/console/src/pages/SignInExperience/components/BrandingForm.tsx
index 3b41eca88..c328ecc00 100644
--- a/packages/console/src/pages/SignInExperience/components/BrandingForm.tsx
+++ b/packages/console/src/pages/SignInExperience/components/BrandingForm.tsx
@@ -38,18 +38,20 @@ const BrandingForm = () => {
           {...register('branding.isDarkModeEnabled')}
         />
       </FormField>
-      <FormField
-        isRequired={isDarkModeEnabled}
-        title="admin_console.sign_in_exp.branding.dark_primary_color"
-      >
-        <Controller
-          name="branding.darkPrimaryColor"
-          control={control}
-          render={({ field: { onChange, value } }) => (
-            <ColorPicker value={value} onChange={onChange} />
-          )}
-        />
-      </FormField>
+      {isDarkModeEnabled && (
+        <FormField
+          isRequired={isDarkModeEnabled}
+          title="admin_console.sign_in_exp.branding.dark_primary_color"
+        >
+          <Controller
+            name="branding.darkPrimaryColor"
+            control={control}
+            render={({ field: { onChange, value } }) => (
+              <ColorPicker value={value} onChange={onChange} />
+            )}
+          />
+        </FormField>
+      )}
       <FormField isRequired title="admin_console.sign_in_exp.branding.ui_style">
         <Controller
           name="branding.style"