From 029ba25361c593621713b3656d992f66e9183b61 Mon Sep 17 00:00:00 2001 From: brendanlaschke Date: Mon, 7 Aug 2023 19:08:02 +0200 Subject: [PATCH] Fix Dark Mode Colors (#1099) - fix dark mode colors --- .../modules/activities/components/TaskRow.tsx | 1 + .../components/TimelineActivityCardFooter.tsx | 1 + .../ui/input/date/components/DateInputEdit.tsx | 1 + .../ui/input/date/components/DatePicker.tsx | 1 + .../ui/modal/components/ConfirmationModal.tsx | 13 +++++++++++-- .../modules/ui/section/components/Section.tsx | 16 +++++++++++++++- 6 files changed, 30 insertions(+), 3 deletions(-) diff --git a/front/src/modules/activities/components/TaskRow.tsx b/front/src/modules/activities/components/TaskRow.tsx index 41b1cd665f..b26facd1c9 100644 --- a/front/src/modules/activities/components/TaskRow.tsx +++ b/front/src/modules/activities/components/TaskRow.tsx @@ -35,6 +35,7 @@ const StyledTaskBody = styled.div` `; const StyledTaskTitle = styled.div` + color: ${({ theme }) => theme.font.color.primary}; font-weight: ${({ theme }) => theme.font.weight.medium}; padding: 0 ${({ theme }) => theme.spacing(2)}; `; diff --git a/front/src/modules/activities/timeline/components/TimelineActivityCardFooter.tsx b/front/src/modules/activities/timeline/components/TimelineActivityCardFooter.tsx index 0677d7248c..eec207ec95 100644 --- a/front/src/modules/activities/timeline/components/TimelineActivityCardFooter.tsx +++ b/front/src/modules/activities/timeline/components/TimelineActivityCardFooter.tsx @@ -13,6 +13,7 @@ type OwnProps = { const StyledContainer = styled.div` align-items: center; border-top: 1px solid ${({ theme }) => theme.border.color.medium}; + color: ${({ theme }) => theme.font.color.primary}; display: flex; flex-direction: row; gap: ${({ theme }) => theme.spacing(2)}; diff --git a/front/src/modules/ui/input/date/components/DateInputEdit.tsx b/front/src/modules/ui/input/date/components/DateInputEdit.tsx index 373b882d9b..a292e9b4a6 100644 --- a/front/src/modules/ui/input/date/components/DateInputEdit.tsx +++ b/front/src/modules/ui/input/date/components/DateInputEdit.tsx @@ -10,6 +10,7 @@ export type StyledCalendarContainerProps = { }; const StyledInputContainer = styled.div` + color: ${({ theme }) => theme.font.color.primary}; display: flex; padding: ${({ theme }) => theme.spacing(2)}; diff --git a/front/src/modules/ui/input/date/components/DatePicker.tsx b/front/src/modules/ui/input/date/components/DatePicker.tsx index f828c0478d..14e826e404 100644 --- a/front/src/modules/ui/input/date/components/DatePicker.tsx +++ b/front/src/modules/ui/input/date/components/DatePicker.tsx @@ -48,6 +48,7 @@ const StyledContainer = styled.div` & .react-datepicker__header__dropdown { display: flex; + color: ${({ theme }) => theme.font.color.primary}; margin-left: ${({ theme }) => theme.spacing(1)}; margin-bottom: ${({ theme }) => theme.spacing(1)}; } diff --git a/front/src/modules/ui/modal/components/ConfirmationModal.tsx b/front/src/modules/ui/modal/components/ConfirmationModal.tsx index 81c378c083..866b447069 100644 --- a/front/src/modules/ui/modal/components/ConfirmationModal.tsx +++ b/front/src/modules/ui/modal/components/ConfirmationModal.tsx @@ -6,7 +6,11 @@ import debounce from 'lodash.debounce'; import { Button, ButtonVariant } from '@/ui/button/components/Button'; import { TextInput } from '@/ui/input/text/components/TextInput'; import { Modal } from '@/ui/modal/components/Modal'; -import { Section, SectionAlignment } from '@/ui/section/components/Section'; +import { + Section, + SectionAlignment, + SectionFontColor, +} from '@/ui/section/components/Section'; import { H1Title, H1TitleFontColor } from '@/ui/typography/components/H1Title'; interface ConfirmationModalProps { @@ -73,7 +77,12 @@ export function ConfirmationModal({ }} > -
{subtitle}
+
+ {subtitle} +
{confirmationValue && (
` + color: ${({ theme, fontColor }) => theme.font.color[fontColor]}; margin-bottom: ${({ theme }) => theme.spacing(4)}; margin-top: ${({ theme }) => theme.spacing(4)}; text-align: ${({ alignment }) => alignment}; @@ -26,9 +35,14 @@ export function Section({ children, alignment = SectionAlignment.Left, fullWidth = true, + fontColor = SectionFontColor.Primary, }: OwnProps) { return ( - + {children} );