fix: add dark mode version of Settings Object cover image (#3079)

Fixes #3078
twentyhq · Dec 19, 2023 · 235b97f · 235b97f
1 parent 4637a92
commit 235b97f
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 2 deletions.
diff --git a/packages/twenty-front/src/modules/settings/data-model/assets/cover-dark.png b/packages/twenty-front/src/modules/settings/data-model/assets/cover-dark.png
diff --git a/packages/twenty-front/src/modules/settings/data-model/assets/cover-light.png b/packages/twenty-front/src/modules/settings/data-model/assets/cover-light.png
diff --git a/packages/twenty-front/src/modules/settings/data-model/assets/cover.png b/packages/twenty-front/src/modules/settings/data-model/assets/cover.png
diff --git a/packages/twenty-front/src/modules/settings/data-model/objects/SettingsObjectCoverImage.tsx b/packages/twenty-front/src/modules/settings/data-model/objects/SettingsObjectCoverImage.tsx
@@ -8,11 +8,15 @@ import { Card } from '@/ui/layout/card/components/Card';
 import { AnimatedFadeOut } from '@/ui/utilities/animation/components/AnimatedFadeOut';
 import { cookieStorage } from '~/utils/cookie-storage';
 
-import CoverImage from '../assets/cover.png';
+import DarkCoverImage from '../assets/cover-dark.png';
+import LightCoverImage from '../assets/cover-light.png';
 
 const StyledCoverImageContainer = styled(Card)`
   align-items: center;
-  background-image: url(${CoverImage.toString()});
+  background-image: ${({ theme }) =>
+    theme.name === 'light'
+      ? `url('${LightCoverImage.toString()}')`
+      : `url('${DarkCoverImage.toString()}')`};
   background-size: cover;
   border-radius: ${({ theme }) => theme.border.radius.md};
   box-sizing: border-box;