From cfd83d6b8e3d2ffde3e44edfca1e7c8911255ede Mon Sep 17 00:00:00 2001 From: Abdullah <125115953+mabdullahabaid@users.noreply.github.com> Date: Sat, 25 May 2024 19:09:25 +0500 Subject: [PATCH] [UI] Remove theme constants from twenty-front and use the ones exported from twenty-ui. (#5558) Some parts of the Frontend used theme constants exported from `modules/ui` while other parts used theme constants exported from `twenty-ui`. This PR centralizes theme constants by removing them from `modules/ui` completely. --- .../CustomResolverFetchMoreLoader.tsx | 3 +- .../emails/components/EmailThreadPreview.tsx | 3 +- .../types/FieldMetadataItem.ts | 3 +- .../fieldMetadataItemSchema.ts | 2 +- .../validation-schemas/selectOptionsSchema.ts | 2 +- .../RecordBoardColumnFetchMoreLoader.tsx | 2 +- .../types/RecordBoardColumnDefinition.ts | 3 +- .../record-field/types/FieldMetadata.ts | 3 +- .../record-table/components/ColumnHead.tsx | 3 +- .../record-table/components/RecordTable.tsx | 3 +- .../RecordTableBodyFetchMoreLoader.tsx | 2 +- ...tingsDataModelFieldSelectFormOptionRow.tsx | 2 +- .../components/ModalWrapper.tsx | 2 +- .../spreadsheet-import/components/Table.tsx | 2 +- .../steps/components/Steps.tsx | 2 +- .../ui/display/status/components/Status.tsx | 3 +- .../components/__stories__/Status.stories.tsx | 7 +- .../ui/feedback/loader/components/Loader.tsx | 3 +- .../field/input/components/CurrencyInput.tsx | 3 +- .../input/components/FieldInputOverlay.tsx | 3 +- .../field/input/components/TextAreaInput.tsx | 2 +- .../ui/field/input/components/TextInput.tsx | 2 +- .../src/modules/ui/input/components/Radio.tsx | 3 +- .../date/components/InternalDatePicker.tsx | 8 +- .../dropdown/components/DropdownMenuInput.tsx | 3 +- .../components/DropdownMenuSearchInput.tsx | 3 +- .../__stories__/ExpandableList.stories.tsx | 3 +- .../src/modules/ui/layout/page/PageHeader.tsx | 2 +- .../ui/layout/page/RightDrawerContainer.tsx | 2 +- .../components/MenuItemMultiSelect.tsx | 3 +- .../components/MenuItemMultiSelectTag.tsx | 3 +- .../components/MenuItemSelectColor.tsx | 9 +- .../components/MenuItemSelectTag.tsx | 4 +- .../components/MenuItemSuggestion.tsx | 4 +- .../MenuItemSelectColor.stories.tsx | 5 +- .../components/StyledMenuItemBase.tsx | 3 +- .../components/NavigationDrawer.tsx | 2 +- .../components/NavigationDrawerItem.tsx | 3 +- .../states/isNavigationDrawerOpenState.ts | 3 +- .../navigation/step-bar/components/Step.tsx | 3 +- .../step-bar/components/StepBar.tsx | 2 +- .../modules/ui/theme/assets/dark-noise.jpg | Bin 26053 -> 0 bytes .../modules/ui/theme/assets/light-noise.png | Bin 9657 -> 0 bytes .../modules/ui/theme/constants/AccentDark.ts | 10 -- .../modules/ui/theme/constants/AccentLight.ts | 10 -- .../modules/ui/theme/constants/Animation.ts | 9 -- .../ui/theme/constants/BackgroundDark.ts | 29 ----- .../ui/theme/constants/BackgroundLight.ts | 29 ----- .../src/modules/ui/theme/constants/Blur.ts | 4 - .../ui/theme/constants/BorderCommon.ts | 10 -- .../modules/ui/theme/constants/BorderDark.ts | 15 --- .../modules/ui/theme/constants/BorderLight.ts | 15 --- .../ui/theme/constants/BoxShadowDark.ts | 18 --- .../ui/theme/constants/BoxShadowLight.ts | 21 ---- .../src/modules/ui/theme/constants/Colors.ts | 8 -- .../modules/ui/theme/constants/FontCommon.ts | 17 --- .../modules/ui/theme/constants/FontDark.ts | 16 --- .../modules/ui/theme/constants/FontLight.ts | 16 --- .../modules/ui/theme/constants/GrayScale.ts | 22 ---- .../ui/theme/constants/HoverBackground.ts | 8 -- .../src/modules/ui/theme/constants/Icon.ts | 13 --- .../ui/theme/constants/MainColorNames.ts | 5 - .../ui/theme/constants/MobileViewport.ts | 1 - .../src/modules/ui/theme/constants/Modal.ts | 7 -- .../ui/theme/constants/OverlayBackground.ts | 8 -- .../src/modules/ui/theme/constants/Rgba.ts | 8 -- .../ui/theme/constants/SecondaryColors.ts | 106 ------------------ .../src/modules/ui/theme/constants/TagDark.ts | 28 ----- .../modules/ui/theme/constants/TagLight.ts | 28 ----- .../src/modules/ui/theme/constants/Text.ts | 13 --- .../ui/theme/constants/TextInputStyle.ts | 20 ---- .../modules/ui/theme/constants/ThemeCommon.ts | 44 -------- .../ui/theme/utils/themeColorSchema.ts | 10 -- .../animation/components/AnimatedEaseIn.tsx | 3 +- .../components/AnimatedEaseInOut.tsx | 3 +- .../animation/components/AnimatedFadeOut.tsx | 3 +- .../drag-select/components/DragSelect.tsx | 3 +- .../utilities/responsive/hooks/useIsMobile.ts | 3 +- .../components/ViewPickerDropdown.tsx | 8 +- .../src/pages/auth/PaymentSuccess.tsx | 3 +- .../src/theme/constants/ThemeCommon.ts | 15 +++ 81 files changed, 84 insertions(+), 633 deletions(-) delete mode 100644 packages/twenty-front/src/modules/ui/theme/assets/dark-noise.jpg delete mode 100644 packages/twenty-front/src/modules/ui/theme/assets/light-noise.png delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/AccentDark.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/AccentLight.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/Animation.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/BackgroundDark.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/BackgroundLight.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/Blur.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/BorderCommon.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/BorderDark.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/BorderLight.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/BoxShadowDark.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/BoxShadowLight.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/Colors.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/FontCommon.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/FontDark.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/FontLight.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/GrayScale.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/HoverBackground.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/Icon.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/MainColorNames.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/MobileViewport.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/Modal.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/OverlayBackground.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/Rgba.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/SecondaryColors.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/TagDark.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/TagLight.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/Text.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/TextInputStyle.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/constants/ThemeCommon.ts delete mode 100644 packages/twenty-front/src/modules/ui/theme/utils/themeColorSchema.ts diff --git a/packages/twenty-front/src/modules/activities/components/CustomResolverFetchMoreLoader.tsx b/packages/twenty-front/src/modules/activities/components/CustomResolverFetchMoreLoader.tsx index 5bc3c1eb1252..7bd31dc70b52 100644 --- a/packages/twenty-front/src/modules/activities/components/CustomResolverFetchMoreLoader.tsx +++ b/packages/twenty-front/src/modules/activities/components/CustomResolverFetchMoreLoader.tsx @@ -1,7 +1,6 @@ import { useInView } from 'react-intersection-observer'; import styled from '@emotion/styled'; - -import { GRAY_SCALE } from '@/ui/theme/constants/GrayScale'; +import { GRAY_SCALE } from 'twenty-ui'; type FetchMoreLoaderProps = { loading: boolean; diff --git a/packages/twenty-front/src/modules/activities/emails/components/EmailThreadPreview.tsx b/packages/twenty-front/src/modules/activities/emails/components/EmailThreadPreview.tsx index a40b840c70d7..845648006b01 100644 --- a/packages/twenty-front/src/modules/activities/emails/components/EmailThreadPreview.tsx +++ b/packages/twenty-front/src/modules/activities/emails/components/EmailThreadPreview.tsx @@ -1,14 +1,13 @@ import { useRef } from 'react'; import styled from '@emotion/styled'; import { useRecoilCallback } from 'recoil'; -import { Avatar } from 'twenty-ui'; +import { Avatar, GRAY_SCALE } from 'twenty-ui'; import { EmailThreadNotShared } from '@/activities/emails/components/EmailThreadNotShared'; import { useEmailThread } from '@/activities/emails/hooks/useEmailThread'; import { emailThreadIdWhenEmailThreadWasClosedState } from '@/activities/emails/states/lastViewableEmailThreadIdState'; import { CardContent } from '@/ui/layout/card/components/CardContent'; import { useRightDrawer } from '@/ui/layout/right-drawer/hooks/useRightDrawer'; -import { GRAY_SCALE } from '@/ui/theme/constants/GrayScale'; import { TimelineThread } from '~/generated/graphql'; import { formatToHumanReadableDate } from '~/utils'; import { getImageAbsoluteURIOrBase64 } from '~/utils/image/getImageAbsoluteURIOrBase64'; diff --git a/packages/twenty-front/src/modules/object-metadata/types/FieldMetadataItem.ts b/packages/twenty-front/src/modules/object-metadata/types/FieldMetadataItem.ts index aa62f6ae7731..91b1fdd7d164 100644 --- a/packages/twenty-front/src/modules/object-metadata/types/FieldMetadataItem.ts +++ b/packages/twenty-front/src/modules/object-metadata/types/FieldMetadataItem.ts @@ -1,4 +1,5 @@ -import { ThemeColor } from '@/ui/theme/constants/MainColorNames'; +import { ThemeColor } from 'twenty-ui'; + import { Field, Object as MetadataObject, diff --git a/packages/twenty-front/src/modules/object-metadata/validation-schemas/fieldMetadataItemSchema.ts b/packages/twenty-front/src/modules/object-metadata/validation-schemas/fieldMetadataItemSchema.ts index 0e82578ac6a3..635d00146937 100644 --- a/packages/twenty-front/src/modules/object-metadata/validation-schemas/fieldMetadataItemSchema.ts +++ b/packages/twenty-front/src/modules/object-metadata/validation-schemas/fieldMetadataItemSchema.ts @@ -1,8 +1,8 @@ +import { themeColorSchema } from 'twenty-ui'; import { z } from 'zod'; import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem'; import { metadataLabelSchema } from '@/object-metadata/validation-schemas/metadataLabelSchema'; -import { themeColorSchema } from '@/ui/theme/utils/themeColorSchema'; import { FieldMetadataType, RelationDefinitionType, diff --git a/packages/twenty-front/src/modules/object-metadata/validation-schemas/selectOptionsSchema.ts b/packages/twenty-front/src/modules/object-metadata/validation-schemas/selectOptionsSchema.ts index 814892da9bd3..ff767cdd5493 100644 --- a/packages/twenty-front/src/modules/object-metadata/validation-schemas/selectOptionsSchema.ts +++ b/packages/twenty-front/src/modules/object-metadata/validation-schemas/selectOptionsSchema.ts @@ -1,8 +1,8 @@ +import { themeColorSchema } from 'twenty-ui'; import { z } from 'zod'; import { FieldMetadataItemOption } from '@/object-metadata/types/FieldMetadataItem'; import { getOptionValueFromLabel } from '@/settings/data-model/fields/forms/select/utils/getOptionValueFromLabel'; -import { themeColorSchema } from '@/ui/theme/utils/themeColorSchema'; import { computeOptionValueFromLabelOrThrow } from '~/pages/settings/data-model/utils/compute-option-value-from-label.utils'; const selectOptionSchema = z diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnFetchMoreLoader.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnFetchMoreLoader.tsx index 98dc26d7a937..7dd71ba0802e 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnFetchMoreLoader.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnFetchMoreLoader.tsx @@ -2,10 +2,10 @@ import { useContext, useEffect } from 'react'; import { useInView } from 'react-intersection-observer'; import styled from '@emotion/styled'; import { useRecoilValue, useSetRecoilState } from 'recoil'; +import { GRAY_SCALE } from 'twenty-ui'; import { useRecordBoardStates } from '@/object-record/record-board/hooks/internal/useRecordBoardStates'; import { RecordBoardColumnContext } from '@/object-record/record-board/record-board-column/contexts/RecordBoardColumnContext'; -import { GRAY_SCALE } from '@/ui/theme/constants/GrayScale'; const StyledText = styled.div` align-items: center; diff --git a/packages/twenty-front/src/modules/object-record/record-board/types/RecordBoardColumnDefinition.ts b/packages/twenty-front/src/modules/object-record/record-board/types/RecordBoardColumnDefinition.ts index 288090c389d9..5a9197dff42a 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/types/RecordBoardColumnDefinition.ts +++ b/packages/twenty-front/src/modules/object-record/record-board/types/RecordBoardColumnDefinition.ts @@ -1,5 +1,6 @@ +import { ThemeColor } from 'twenty-ui'; + import { RecordBoardColumnAction } from '@/object-record/record-board/types/RecordBoardColumnAction'; -import { ThemeColor } from '@/ui/theme/constants/MainColorNames'; export type RecordBoardColumnDefinition = { id: string; diff --git a/packages/twenty-front/src/modules/object-record/record-field/types/FieldMetadata.ts b/packages/twenty-front/src/modules/object-record/record-field/types/FieldMetadata.ts index 03ef2f2a9d21..8a287bd6af1a 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/types/FieldMetadata.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/types/FieldMetadata.ts @@ -1,6 +1,7 @@ +import { ThemeColor } from 'twenty-ui'; + import { RATING_VALUES } from '@/object-record/record-field/meta-types/constants/RatingValues'; import { EntityForSelect } from '@/object-record/relation-picker/types/EntityForSelect'; -import { ThemeColor } from '@/ui/theme/constants/MainColorNames'; import { CurrencyCode } from './CurrencyCode'; diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/ColumnHead.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/ColumnHead.tsx index f9150703d0bc..89caf5a48fc3 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/ColumnHead.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/ColumnHead.tsx @@ -1,10 +1,9 @@ import { css, useTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { useRecoilValue } from 'recoil'; -import { useIcons } from 'twenty-ui'; +import { MOBILE_VIEWPORT, useIcons } from 'twenty-ui'; import { FieldMetadata } from '@/object-record/record-field/types/FieldMetadata'; -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; import { scrollLeftState } from '@/ui/utilities/scroll/states/scrollLeftState'; import { ColumnDefinition } from '../types/ColumnDefinition'; diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTable.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTable.tsx index dca70d638723..92280dfd1f6b 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTable.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTable.tsx @@ -1,6 +1,7 @@ import { css } from '@emotion/react'; import styled from '@emotion/styled'; import { useRecoilValue } from 'recoil'; +import { MOBILE_VIEWPORT, RGBA } from 'twenty-ui'; import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem'; import { RecordTableBody } from '@/object-record/record-table/components/RecordTableBody'; @@ -21,8 +22,6 @@ import { useUpsertRecordV2 } from '@/object-record/record-table/record-table-cel import { RecordTableScope } from '@/object-record/record-table/scopes/RecordTableScope'; import { MoveFocusDirection } from '@/object-record/record-table/types/MoveFocusDirection'; import { TableCellPosition } from '@/object-record/record-table/types/TableCellPosition'; -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; -import { RGBA } from '@/ui/theme/constants/Rgba'; const StyledTable = styled.table<{ freezeFirstColumns?: boolean; diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableBodyFetchMoreLoader.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableBodyFetchMoreLoader.tsx index 33173a925007..17b06e8bdf28 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableBodyFetchMoreLoader.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableBodyFetchMoreLoader.tsx @@ -2,11 +2,11 @@ import { useContext } from 'react'; import { useInView } from 'react-intersection-observer'; import styled from '@emotion/styled'; import { useRecoilCallback, useRecoilValue } from 'recoil'; +import { GRAY_SCALE } from 'twenty-ui'; import { useLoadRecordIndexTable } from '@/object-record/record-index/hooks/useLoadRecordIndexTable'; import { useRecordTable } from '@/object-record/record-table/hooks/useRecordTable'; import { isFetchingMoreRecordsFamilyState } from '@/object-record/states/isFetchingMoreRecordsFamilyState'; -import { GRAY_SCALE } from '@/ui/theme/constants/GrayScale'; import { ScrollWrapperContext } from '@/ui/utilities/scroll/components/ScrollWrapper'; type RecordTableBodyFetchMoreLoaderProps = { diff --git a/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx b/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx index bc438a6815c8..fdc99c137005 100644 --- a/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx @@ -8,6 +8,7 @@ import { IconGripVertical, IconTrash, IconX, + MAIN_COLOR_NAMES, } from 'twenty-ui'; import { v4 } from 'uuid'; @@ -21,7 +22,6 @@ import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/Drop import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem'; import { MenuItemSelectColor } from '@/ui/navigation/menu-item/components/MenuItemSelectColor'; -import { MAIN_COLOR_NAMES } from '@/ui/theme/constants/MainColorNames'; type SettingsDataModelFieldSelectFormOptionRowProps = { className?: string; diff --git a/packages/twenty-front/src/modules/spreadsheet-import/components/ModalWrapper.tsx b/packages/twenty-front/src/modules/spreadsheet-import/components/ModalWrapper.tsx index 66dc08423cea..d9de117e2412 100644 --- a/packages/twenty-front/src/modules/spreadsheet-import/components/ModalWrapper.tsx +++ b/packages/twenty-front/src/modules/spreadsheet-import/components/ModalWrapper.tsx @@ -1,8 +1,8 @@ import styled from '@emotion/styled'; +import { MOBILE_VIEWPORT } from 'twenty-ui'; import { useSpreadsheetImportInternal } from '@/spreadsheet-import/hooks/useSpreadsheetImportInternal'; import { Modal } from '@/ui/layout/modal/components/Modal'; -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; import { ModalCloseButton } from './ModalCloseButton'; diff --git a/packages/twenty-front/src/modules/spreadsheet-import/components/Table.tsx b/packages/twenty-front/src/modules/spreadsheet-import/components/Table.tsx index 3ee211eb1a90..ea953e057591 100644 --- a/packages/twenty-front/src/modules/spreadsheet-import/components/Table.tsx +++ b/packages/twenty-front/src/modules/spreadsheet-import/components/Table.tsx @@ -1,9 +1,9 @@ // @ts-expect-error // Todo: remove usage of react-data-grid import DataGrid, { DataGridProps } from 'react-data-grid'; import styled from '@emotion/styled'; +import { RGBA } from 'twenty-ui'; import { useSpreadsheetImportInternal } from '@/spreadsheet-import/hooks/useSpreadsheetImportInternal'; -import { RGBA } from '@/ui/theme/constants/Rgba'; const StyledDataGrid = styled(DataGrid)` --rdg-background-color: ${({ theme }) => theme.background.primary}; diff --git a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/Steps.tsx b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/Steps.tsx index cd87cc572896..612c82d0d442 100644 --- a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/Steps.tsx +++ b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/Steps.tsx @@ -1,11 +1,11 @@ import styled from '@emotion/styled'; +import { MOBILE_VIEWPORT } from 'twenty-ui'; import { useSpreadsheetImportInitialStep } from '@/spreadsheet-import/hooks/useSpreadsheetImportInitialStep'; import { useSpreadsheetImportInternal } from '@/spreadsheet-import/hooks/useSpreadsheetImportInternal'; import { Modal } from '@/ui/layout/modal/components/Modal'; import { StepBar } from '@/ui/navigation/step-bar/components/StepBar'; import { useStepBar } from '@/ui/navigation/step-bar/hooks/useStepBar'; -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; import { UploadFlow } from './UploadFlow'; diff --git a/packages/twenty-front/src/modules/ui/display/status/components/Status.tsx b/packages/twenty-front/src/modules/ui/display/status/components/Status.tsx index 36fe7d6db28d..7c52e0eaaa20 100644 --- a/packages/twenty-front/src/modules/ui/display/status/components/Status.tsx +++ b/packages/twenty-front/src/modules/ui/display/status/components/Status.tsx @@ -1,8 +1,7 @@ import styled from '@emotion/styled'; +import { ThemeColor, themeColorSchema } from 'twenty-ui'; import { Loader } from '@/ui/feedback/loader/components/Loader'; -import { ThemeColor } from '@/ui/theme/constants/MainColorNames'; -import { themeColorSchema } from '@/ui/theme/utils/themeColorSchema'; const StyledStatus = styled.h3<{ color: ThemeColor; diff --git a/packages/twenty-front/src/modules/ui/display/status/components/__stories__/Status.stories.tsx b/packages/twenty-front/src/modules/ui/display/status/components/__stories__/Status.stories.tsx index 1afa5aa1202f..7db5637d0497 100644 --- a/packages/twenty-front/src/modules/ui/display/status/components/__stories__/Status.stories.tsx +++ b/packages/twenty-front/src/modules/ui/display/status/components/__stories__/Status.stories.tsx @@ -1,11 +1,12 @@ import { Meta, StoryObj } from '@storybook/react'; import { expect, fn, userEvent, within } from '@storybook/test'; -import { CatalogDecorator, CatalogStory, ComponentDecorator } from 'twenty-ui'; - import { + CatalogDecorator, + CatalogStory, + ComponentDecorator, MAIN_COLOR_NAMES, ThemeColor, -} from '@/ui/theme/constants/MainColorNames'; +} from 'twenty-ui'; import { Status } from '../Status'; diff --git a/packages/twenty-front/src/modules/ui/feedback/loader/components/Loader.tsx b/packages/twenty-front/src/modules/ui/feedback/loader/components/Loader.tsx index f76c2d155398..1df850e0c55b 100644 --- a/packages/twenty-front/src/modules/ui/feedback/loader/components/Loader.tsx +++ b/packages/twenty-front/src/modules/ui/feedback/loader/components/Loader.tsx @@ -1,7 +1,6 @@ import styled from '@emotion/styled'; import { motion } from 'framer-motion'; - -import { ThemeColor } from '@/ui/theme/constants/MainColorNames'; +import { ThemeColor } from 'twenty-ui'; const StyledLoaderContainer = styled.div<{ color?: ThemeColor; diff --git a/packages/twenty-front/src/modules/ui/field/input/components/CurrencyInput.tsx b/packages/twenty-front/src/modules/ui/field/input/components/CurrencyInput.tsx index b0e60d8a9aa6..ced18f9c5d81 100644 --- a/packages/twenty-front/src/modules/ui/field/input/components/CurrencyInput.tsx +++ b/packages/twenty-front/src/modules/ui/field/input/components/CurrencyInput.tsx @@ -2,12 +2,11 @@ import { useEffect, useMemo, useRef, useState } from 'react'; import { IMaskInput, IMaskInputProps } from 'react-imask'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconComponent } from 'twenty-ui'; +import { IconComponent, TEXT_INPUT_STYLE } from 'twenty-ui'; import { useRegisterInputEvents } from '@/object-record/record-field/meta-types/input/hooks/useRegisterInputEvents'; import { SETTINGS_FIELD_CURRENCY_CODES } from '@/settings/data-model/constants/SettingsFieldCurrencyCodes'; import { CurrencyPickerDropdownButton } from '@/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton'; -import { TEXT_INPUT_STYLE } from '@/ui/theme/constants/TextInputStyle'; type StyledInputProps = React.ComponentProps<'input'> & IMaskInputProps; diff --git a/packages/twenty-front/src/modules/ui/field/input/components/FieldInputOverlay.tsx b/packages/twenty-front/src/modules/ui/field/input/components/FieldInputOverlay.tsx index e6fa09f17eca..40c4b3e687eb 100644 --- a/packages/twenty-front/src/modules/ui/field/input/components/FieldInputOverlay.tsx +++ b/packages/twenty-front/src/modules/ui/field/input/components/FieldInputOverlay.tsx @@ -1,6 +1,5 @@ import styled from '@emotion/styled'; - -import { OVERLAY_BACKGROUND } from '@/ui/theme/constants/OverlayBackground'; +import { OVERLAY_BACKGROUND } from 'twenty-ui'; const StyledFieldInputOverlay = styled.div` align-items: center; diff --git a/packages/twenty-front/src/modules/ui/field/input/components/TextAreaInput.tsx b/packages/twenty-front/src/modules/ui/field/input/components/TextAreaInput.tsx index 27c5791c4cfc..9cbddeb3d3ca 100644 --- a/packages/twenty-front/src/modules/ui/field/input/components/TextAreaInput.tsx +++ b/packages/twenty-front/src/modules/ui/field/input/components/TextAreaInput.tsx @@ -1,10 +1,10 @@ import { ChangeEvent, useEffect, useRef, useState } from 'react'; import TextareaAutosize from 'react-textarea-autosize'; import styled from '@emotion/styled'; +import { TEXT_INPUT_STYLE } from 'twenty-ui'; import { LightCopyIconButton } from '@/object-record/record-field/components/LightCopyIconButton'; import { useRegisterInputEvents } from '@/object-record/record-field/meta-types/input/hooks/useRegisterInputEvents'; -import { TEXT_INPUT_STYLE } from '@/ui/theme/constants/TextInputStyle'; import { isDefined } from '~/utils/isDefined'; export type TextAreaInputProps = { diff --git a/packages/twenty-front/src/modules/ui/field/input/components/TextInput.tsx b/packages/twenty-front/src/modules/ui/field/input/components/TextInput.tsx index 26ab63bb3610..1490e1f7d587 100644 --- a/packages/twenty-front/src/modules/ui/field/input/components/TextInput.tsx +++ b/packages/twenty-front/src/modules/ui/field/input/components/TextInput.tsx @@ -1,9 +1,9 @@ import { ChangeEvent, useEffect, useRef, useState } from 'react'; import styled from '@emotion/styled'; +import { TEXT_INPUT_STYLE } from 'twenty-ui'; import { LightCopyIconButton } from '@/object-record/record-field/components/LightCopyIconButton'; import { useRegisterInputEvents } from '@/object-record/record-field/meta-types/input/hooks/useRegisterInputEvents'; -import { TEXT_INPUT_STYLE } from '@/ui/theme/constants/TextInputStyle'; export const StyledTextInput = styled.input` margin: 0; diff --git a/packages/twenty-front/src/modules/ui/input/components/Radio.tsx b/packages/twenty-front/src/modules/ui/input/components/Radio.tsx index a5f2b57bbfd7..1626e1321400 100644 --- a/packages/twenty-front/src/modules/ui/input/components/Radio.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/Radio.tsx @@ -1,8 +1,7 @@ import * as React from 'react'; import styled from '@emotion/styled'; import { motion } from 'framer-motion'; - -import { RGBA } from '@/ui/theme/constants/Rgba'; +import { RGBA } from 'twenty-ui'; import { RadioGroup } from './RadioGroup'; diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/date/components/InternalDatePicker.tsx b/packages/twenty-front/src/modules/ui/input/components/internal/date/components/InternalDatePicker.tsx index 6f96eaee0040..a45855074b33 100644 --- a/packages/twenty-front/src/modules/ui/input/components/internal/date/components/InternalDatePicker.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/internal/date/components/InternalDatePicker.tsx @@ -2,7 +2,12 @@ import ReactDatePicker from 'react-datepicker'; import styled from '@emotion/styled'; import { DateTime } from 'luxon'; import { Key } from 'ts-key-enum'; -import { IconCalendarX, IconChevronLeft, IconChevronRight } from 'twenty-ui'; +import { + IconCalendarX, + IconChevronLeft, + IconChevronRight, + OVERLAY_BACKGROUND, +} from 'twenty-ui'; import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { DateTimeInput } from '@/ui/input/components/internal/date/components/DateTimeInput'; @@ -10,7 +15,6 @@ import { Select } from '@/ui/input/components/Select'; import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; import { MenuItemLeftContent } from '@/ui/navigation/menu-item/internals/components/MenuItemLeftContent'; import { StyledHoverableMenuItemBase } from '@/ui/navigation/menu-item/internals/components/StyledMenuItemBase'; -import { OVERLAY_BACKGROUND } from '@/ui/theme/constants/OverlayBackground'; import { isDefined } from '~/utils/isDefined'; import 'react-datepicker/dist/react-datepicker.css'; diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuInput.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuInput.tsx index 13c6a90485d5..5022ffecb6dc 100644 --- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuInput.tsx +++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuInput.tsx @@ -1,10 +1,9 @@ import { forwardRef, InputHTMLAttributes, ReactNode, useRef } from 'react'; import { css } from '@emotion/react'; import styled from '@emotion/styled'; +import { RGBA, TEXT_INPUT_STYLE } from 'twenty-ui'; import { useRegisterInputEvents } from '@/object-record/record-field/meta-types/input/hooks/useRegisterInputEvents'; -import { RGBA } from '@/ui/theme/constants/Rgba'; -import { TEXT_INPUT_STYLE } from '@/ui/theme/constants/TextInputStyle'; import { useCombinedRefs } from '~/hooks/useCombinedRefs'; const StyledInput = styled.input<{ withRightComponent?: boolean }>` diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuSearchInput.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuSearchInput.tsx index c5e3ffa84fc6..1c6b06c91527 100644 --- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuSearchInput.tsx +++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuSearchInput.tsx @@ -1,7 +1,6 @@ import { forwardRef, InputHTMLAttributes } from 'react'; import styled from '@emotion/styled'; - -import { TEXT_INPUT_STYLE } from '@/ui/theme/constants/TextInputStyle'; +import { TEXT_INPUT_STYLE } from 'twenty-ui'; const StyledDropdownMenuSearchInputContainer = styled.div` --vertical-padding: ${({ theme }) => theme.spacing(1)}; diff --git a/packages/twenty-front/src/modules/ui/layout/expandable-list/components/__stories__/ExpandableList.stories.tsx b/packages/twenty-front/src/modules/ui/layout/expandable-list/components/__stories__/ExpandableList.stories.tsx index fbbd5d593e90..1cb295ca7e5e 100644 --- a/packages/twenty-front/src/modules/ui/layout/expandable-list/components/__stories__/ExpandableList.stories.tsx +++ b/packages/twenty-front/src/modules/ui/layout/expandable-list/components/__stories__/ExpandableList.stories.tsx @@ -2,10 +2,9 @@ import styled from '@emotion/styled'; import { expect } from '@storybook/jest'; import { Meta, StoryObj } from '@storybook/react'; import { userEvent, within } from '@storybook/test'; -import { ComponentDecorator, Tag } from 'twenty-ui'; +import { ComponentDecorator, MAIN_COLOR_NAMES, Tag } from 'twenty-ui'; import { ExpandableList } from '@/ui/layout/expandable-list/components/ExpandableList'; -import { MAIN_COLOR_NAMES } from '@/ui/theme/constants/MainColorNames'; const StyledContainer = styled.div` padding: ${({ theme }) => theme.spacing(1)}; diff --git a/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx b/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx index 71ba45978faa..7cbc7e4a15b6 100644 --- a/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx +++ b/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx @@ -7,13 +7,13 @@ import { useRecoilValue } from 'recoil'; import { IconChevronLeft, IconComponent, + MOBILE_VIEWPORT, OverflowingTextWithTooltip, } from 'twenty-ui'; import { IconButton } from '@/ui/input/button/components/IconButton'; import { NavigationDrawerCollapseButton } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerCollapseButton'; import { isNavigationDrawerOpenState } from '@/ui/navigation/states/isNavigationDrawerOpenState'; -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; export const PAGE_BAR_MIN_HEIGHT = 40; diff --git a/packages/twenty-front/src/modules/ui/layout/page/RightDrawerContainer.tsx b/packages/twenty-front/src/modules/ui/layout/page/RightDrawerContainer.tsx index 5ee7cae4526e..5d4c0efb7e01 100644 --- a/packages/twenty-front/src/modules/ui/layout/page/RightDrawerContainer.tsx +++ b/packages/twenty-front/src/modules/ui/layout/page/RightDrawerContainer.tsx @@ -1,8 +1,8 @@ import { ReactNode } from 'react'; import styled from '@emotion/styled'; +import { MOBILE_VIEWPORT } from 'twenty-ui'; import { RightDrawer } from '@/ui/layout/right-drawer/components/RightDrawer'; -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; import { PagePanel } from './PagePanel'; diff --git a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemMultiSelect.tsx b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemMultiSelect.tsx index e2b1b00d9a3c..dafaeae1de8c 100644 --- a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemMultiSelect.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemMultiSelect.tsx @@ -1,9 +1,8 @@ import styled from '@emotion/styled'; -import { IconComponent, Tag } from 'twenty-ui'; +import { IconComponent, Tag, ThemeColor } from 'twenty-ui'; import { Checkbox } from '@/ui/input/components/Checkbox'; import { MenuItemLeftContent } from '@/ui/navigation/menu-item/internals/components/MenuItemLeftContent'; -import { ThemeColor } from '@/ui/theme/constants/MainColorNames'; import { StyledMenuItemBase } from '../internals/components/StyledMenuItemBase'; diff --git a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemMultiSelectTag.tsx b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemMultiSelectTag.tsx index bd6a9b5eff98..e1c941c4561b 100644 --- a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemMultiSelectTag.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemMultiSelectTag.tsx @@ -1,11 +1,10 @@ -import { Tag } from 'twenty-ui'; +import { Tag, ThemeColor } from 'twenty-ui'; import { Checkbox, CheckboxShape, CheckboxSize, } from '@/ui/input/components/Checkbox'; -import { ThemeColor } from '@/ui/theme/constants/MainColorNames'; import { StyledMenuItemBase, diff --git a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSelectColor.tsx b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSelectColor.tsx index 3f4f3426f9fa..6dabbded2dfa 100644 --- a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSelectColor.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSelectColor.tsx @@ -1,7 +1,10 @@ import { useTheme } from '@emotion/react'; -import { ColorSample, ColorSampleVariant, IconCheck } from 'twenty-ui'; - -import { ThemeColor } from '@/ui/theme/constants/MainColorNames'; +import { + ColorSample, + ColorSampleVariant, + IconCheck, + ThemeColor, +} from 'twenty-ui'; import { StyledMenuItemLabel, diff --git a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSelectTag.tsx b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSelectTag.tsx index 889465823d4f..ce429c8cf0cf 100644 --- a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSelectTag.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSelectTag.tsx @@ -1,7 +1,5 @@ import { useTheme } from '@emotion/react'; -import { IconCheck, Tag } from 'twenty-ui'; - -import { ThemeColor } from '@/ui/theme/constants/MainColorNames'; +import { IconCheck, Tag, ThemeColor } from 'twenty-ui'; import { StyledMenuItemLeftContent } from '../internals/components/StyledMenuItemBase'; diff --git a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSuggestion.tsx b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSuggestion.tsx index 1876d1e1f39d..7017864d3884 100644 --- a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSuggestion.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemSuggestion.tsx @@ -1,8 +1,6 @@ import { MouseEvent } from 'react'; import styled from '@emotion/styled'; -import { IconComponent } from 'twenty-ui'; - -import { HOVER_BACKGROUND } from '@/ui/theme/constants/HoverBackground'; +import { HOVER_BACKGROUND, IconComponent } from 'twenty-ui'; import { MenuItemLeftContent } from '../internals/components/MenuItemLeftContent'; import { StyledMenuItemLeftContent } from '../internals/components/StyledMenuItemBase'; diff --git a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/__stories__/MenuItemSelectColor.stories.tsx b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/__stories__/MenuItemSelectColor.stories.tsx index be234750b266..6f95af499f9b 100644 --- a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/__stories__/MenuItemSelectColor.stories.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/__stories__/MenuItemSelectColor.stories.tsx @@ -6,12 +6,9 @@ import { CatalogStory, ColorSampleVariant, ComponentDecorator, -} from 'twenty-ui'; - -import { MAIN_COLOR_NAMES, ThemeColor, -} from '@/ui/theme/constants/MainColorNames'; +} from 'twenty-ui'; import { MenuItemSelectColor } from '../MenuItemSelectColor'; diff --git a/packages/twenty-front/src/modules/ui/navigation/menu-item/internals/components/StyledMenuItemBase.tsx b/packages/twenty-front/src/modules/ui/navigation/menu-item/internals/components/StyledMenuItemBase.tsx index b2cd5f9c81ab..71cd27eae09e 100644 --- a/packages/twenty-front/src/modules/ui/navigation/menu-item/internals/components/StyledMenuItemBase.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/menu-item/internals/components/StyledMenuItemBase.tsx @@ -1,7 +1,6 @@ import { css } from '@emotion/react'; import styled from '@emotion/styled'; - -import { HOVER_BACKGROUND } from '@/ui/theme/constants/HoverBackground'; +import { HOVER_BACKGROUND } from 'twenty-ui'; import { MenuItemAccent } from '../../types/MenuItemAccent'; diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawer.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawer.tsx index 88cf5f9b426e..2b9863915ab1 100644 --- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawer.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawer.tsx @@ -3,9 +3,9 @@ import { css, useTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { motion } from 'framer-motion'; import { useRecoilValue } from 'recoil'; +import { MOBILE_VIEWPORT } from 'twenty-ui'; import { isNavigationDrawerOpenState } from '@/ui/navigation/states/isNavigationDrawerOpenState'; -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; import { DESKTOP_NAV_DRAWER_WIDTHS } from '../constants/DesktopNavDrawerWidths'; diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerItem.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerItem.tsx index 7d09a6d774be..8f0dd6ed2f8b 100644 --- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerItem.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerItem.tsx @@ -4,10 +4,9 @@ import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { isNonEmptyString } from '@sniptt/guards'; import { useSetRecoilState } from 'recoil'; -import { IconComponent, Pill } from 'twenty-ui'; +import { IconComponent, MOBILE_VIEWPORT, Pill } from 'twenty-ui'; import { isNavigationDrawerOpenState } from '@/ui/navigation/states/isNavigationDrawerOpenState'; -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; import { isDefined } from '~/utils/isDefined'; diff --git a/packages/twenty-front/src/modules/ui/navigation/states/isNavigationDrawerOpenState.ts b/packages/twenty-front/src/modules/ui/navigation/states/isNavigationDrawerOpenState.ts index 33c9c37eed1f..b5496b4a57ac 100644 --- a/packages/twenty-front/src/modules/ui/navigation/states/isNavigationDrawerOpenState.ts +++ b/packages/twenty-front/src/modules/ui/navigation/states/isNavigationDrawerOpenState.ts @@ -1,6 +1,5 @@ import { atom } from 'recoil'; - -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; +import { MOBILE_VIEWPORT } from 'twenty-ui'; const isMobile = window.innerWidth <= MOBILE_VIEWPORT; diff --git a/packages/twenty-front/src/modules/ui/navigation/step-bar/components/Step.tsx b/packages/twenty-front/src/modules/ui/navigation/step-bar/components/Step.tsx index ebb5d3251c18..01a93c9ac5f6 100644 --- a/packages/twenty-front/src/modules/ui/navigation/step-bar/components/Step.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/step-bar/components/Step.tsx @@ -1,9 +1,8 @@ import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { motion } from 'framer-motion'; -import { AnimatedCheckmark } from 'twenty-ui'; +import { AnimatedCheckmark, MOBILE_VIEWPORT } from 'twenty-ui'; -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; const StyledContainer = styled.div<{ isLast: boolean }>` diff --git a/packages/twenty-front/src/modules/ui/navigation/step-bar/components/StepBar.tsx b/packages/twenty-front/src/modules/ui/navigation/step-bar/components/StepBar.tsx index 1f7ca533e33b..cfa7d50f9648 100644 --- a/packages/twenty-front/src/modules/ui/navigation/step-bar/components/StepBar.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/step-bar/components/StepBar.tsx @@ -1,7 +1,7 @@ import React from 'react'; import styled from '@emotion/styled'; +import { MOBILE_VIEWPORT } from 'twenty-ui'; -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; import { Step, StepProps } from './Step'; diff --git a/packages/twenty-front/src/modules/ui/theme/assets/dark-noise.jpg b/packages/twenty-front/src/modules/ui/theme/assets/dark-noise.jpg deleted file mode 100644 index 6fc95715e9d469efc3d977509c986163270c8ab9..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 26053 zcmbrlX;f2L+bz0wIzk8t7$7mAfdmL4ViK$XLSYCR16mlG(3GH|6_w7YAoWrhLXQDM z4+WGUs0b8AqX=RH(ilQxQ(8qY2!Uz~#TKOivZ>+p!ksFTsBPMxLU3kmgL3p_{i>=-KTStTZ%^TUgiL zuT8f1d1n+RevUDw>|L~c|KHI5A7uY~z@-02$o?0w{}0zRz`~)ej|VpZ`@v_2cLXC2 z_Bw7EvI#mtEMJ{7R?FCpaqM*sUM8_s{{t>sJ>$J)bYzNqG4&_0-TB=dWj6F@D+li7 zL=~oeY@t}X1(bPjN4VpOxdFQ+kNrf0&)`*B;wu$pVZvi)8pD2F3(k$yR@?97Teu3a zI{>~pe{y7|Qu|;+W=@IC&d?Ys(b;=svaSS+0mmKvslG8Xk3zoVlehXkb`eC0^AZsv z*@lxKw_SECe@{8P%?lGkzj}W!gQO*wt%vp1U%h`Dys`uI!}{6hW6U@a2QBe7lM)5W zEbCpTOzZ{VJzVxLvrW|{-;S6b@p>6aT6@Yn>C=z4wOZm}$VYqHQ5TWNz^9)YVxH4u zDHYH+i+8Qw^@*OrGUv7CfBiU0*k%YDN@W+VXA;p+po34P__d^?3$Zzz7@K6AyupwI&sk2XT_1jC zIzm0t%v*1FDB^vR;13l@7M{UNx`$t_Qi-G1NlF~m!W?eV`a!ROIenB+i&pa~@t4WO z=LvXPHvC-d$N8jrCA~sCSj^GG&uS)72`E)Rb6@}FwZ&?Cdb~1SioR650yyxD;ol&- z1JY+U)J!<%hZ?P^>b(8_fu~GDdpOHB)m3VjRzitHoQ+T%6x69|HcdWRsHlYw?N(Q6 zBTnwRpln^+*H*F;IQ8NF>24t;eg8iKkHZr(5 zOk#B9bn1VcLN@#nO)LW3Ljm4FP%_*vDfaK_F?a&}MQXh@W3!K(>oy zX*1k3B^yBEBL4l!Y2D{-EG?z9Z(n{dhwjpO&#E-&NOs*a)KIpIi4C~%a}56Ffw3o} z%H%5UBcn{HeNL*qsr-yx!lDEu|$O-d(IQyw>~kJzOi7x$LO5fnN3 z3o-E}9oZHpn~cEB;h$$gEn;??SYkeV%$%>j8z=8B+<8P1F+;`y{!phJ=y$Q!CjEvF zi`w!tu5oryzLJd*D%}?V#u-FI++v9^7_vLp9r~DMvd2OyXku8FN-NZL1ID#*x;tFb z+kil7xNU`j@5yl_L(Q3liShnmEO2c74XD$sLy=Vp!tl-Nw>%GnS1+?d9*T~OsZdL5 z*jVbfO1$Ra;jX~uwxHvCDYwEaMyQVlTR0#%UhC{x=^%SNFZgZXpBtj*ZoZ771^dH~Cm=_z_%mRAuI(an1?oW%@CfUcAhNx+993D$gwo|k$ zic#8OAN~2uukXOi5fZI1KDeLq7wzyZ_iAl?$E~k^+ddlEX)Sb*-ht@DvWX{@l%~JCs8AO23+pa2Qv#9BX>!Vp24vV zvz8a^$DXz%M@-Nt_3?pfC%p;NW;<1_mSMWfk7dL¬?5MdcHkL@;)EY!!ECpJ!V zh>UtnT_xjev_;*iTxkzv)sV& zjOpj)mWQ#DPrxbh^BNNNg*=n?IofGD$ibr0Rp?Lo^uvzu{2P)T1aF-26(}`w!h?A~ zy732Fetpg>?Xa78OGt;KCxFLdLMoRIggwg)lc1&-x%IKUiGc@>E_Jntrv{zvAuo97 zKB0(sPMVRg6uuz$Qex;mP&CBQ&WNR>7Fv=R^G)@qr9-pM<+OqoHYC)K5Ww;$g>&lo zyRw>zD%XYKAs;+By(sXOUDA0VfjWEC+2T0nM(ppuHcQfp%6~u$)zhLeaZZK-K7)pb z9m?-pJ*V_6O^n*=2M!;|8&|oyl!E5-KzkyvdPAg>(i?EaQcXw=!+AK-OspfCILJ1z zz;e=q^iTn3nprj1Q~hRn5g}IwrEFR-zfOYpLoVBsL9#41%D+f(q$oLMQ_^27hcmze zjH6@l?BAglJ(TJ)WT9oD(fxJhSSz<76Fu$4Aq&_|8m=vCLdo#lSi=6q#$bdfiFWpZmxJTPk{l@=Ht`7oyMESyT=*>lE%q#J}d=XY%c-DchA{V`O}PL^7pczYVzEpROsoOQl>1mf3F4CIFtb7HehrB z>;OWY2MKjvs@*;A)=K{D#|H8WPgCp~c0Uw*xmpgVq%6lyR_N|r8SXcggr_tCp}Z^z zPP!6`xBz@oIyal8T27~o7(eu&#kh!Tv4p3}<~zam`ruhh9&gI%6)eqom=J6XJb({Oecer=mIOyc#mD8===Tv6n>U&v(9iQKh?Wf3sH|X_oREQrI@@KQb zKDkNJF1v<(%`$!^hE-c~Fm~oDfNqMkPP&x|4+M}33A#*PVV?);P(>K^@@+#F6-xCv zA+B#L{r;f8t~ocHHaOCDD=H<{*(6#7lbcG&;lx0biC+Xup?z2ABPBx1bXnN|>UB1V zkT^?^T8AU$S)&n7rzq%_<@TBOlAO6tYYrh7#48&!a2)ua*-XJFRpHMBjLqzI-vn7` zm+n{-2M7eB?8LbbrB_#wut)A4_Rl?R?`vbEdHVp7dtSJ#z}?51T~rqwJ54&cX_TfJ zaEbt?UxGaZ%wHKZ~#Jjgs5TJtZtBa0)ceJvdahSPm2J?!nQc`Te$g z#?{;C8cD1w2R@u+KKzD%0V%6r23@ZVx~DJS;j^@Me;i1E1~oNE0upBH{2a`$#^eQr zd)!WMSIqu;tGX%9sTTR!hDh{KuAiv!bNJqmWn0bEN(f^w{wXUV03Oz%Ob^$j$t-I+--y;k9YndvX{9PCvk<^y{w^8lw| z8R>MEsEsoF;8Ni)d|Vnca_=A|lT@=DOMwPRw?rOzjmh{fN3m<*lyaenx1P>S-E>08 z(fyB;kCpzp?vs>X#a&N!>C1e4t-0BAS4%-cqZsTwE1x=1Ql$4aTeRG*PCrCRxo1i% z<-lyOelI~1Iaih^KUSwnTn|lpZYyQy%ytX7jR!Fw(`w->G4hS4w{d;dSD4w#wS{lh zp3=r}-A|_jD1erUO#KIpKKSf26G0#C#k!jZ;TwG&%6wxG;ZC)vrN5&|MKe5t!=)d> z5@b80=lXPSV+-#$_XrLGqEtEwzqF^@M%G!o)5lRXz5?U#d=fu~t_9ZQw|@^#fA*NG zQT*OlvQ6H8YxY*ngnO)FFX+Y!SXrwq_8TScuJ5q*t2Ioq3bg%ct z&IbzmXQi3BvR%c@5)oH-i08ByG(>dGwVs#=W3NZr;{E*SzhzGI-WVS(aj}L74S`HMovCWROotn=&Fv)97->RRuFMSc4@+R`h6o>()K)X z&aAF0^8TZ$xNv{8gTmz0Wyk)>-`n4tZ#t~z0ZfS|u}S|fVS21!(uqqH*#)DHXKU4t zi~}qP0$iDCdOt1k7P`esdnMzeBPEM?7Y1LD0#j`1$z67D#w|#GhB5nDU8a%^MFd)5 zQahIi0$iF6aoWe|$I8_!^QO$=5yY+K&N64%2GmE=&PHkvzk{=!^1WV>JSWD2H$Qe9 zt!P$n(37yhn#ekr#Vj=N3fXbUf8=DONch~{*paI=`9{h?(NQXT&mIDGsI;=^3!k20 zvg_CJ!Wh`(u-jHHRl8UT!mliZA+9o}KHf5W$rOrV2L1al<^hp#y1C0jEEs9;T;bj7 zIutpLGuvd&HeEL%*~ist*=UAmyUf%#POd8V7!%`Oy7!cp7!kNr=5Bkzvs#fw$0KFK zn~)8iJ(Xp_D`bld=fKk0wR)AHPp3C&qAtM;TeYNnzjI#`!GMpfd4p~4JCbD{sE@=P zvn_LW(DyK}N9ILxGXRee*lwAV|E@v57P9ZQxAW7uWJV%r_vAg!Zb9&a=81OWWYh)o``wc;?s`Z|i{@)^q!q$8-v-)H^3gBYO;;*C-^%QK zYh>rT6F|?eJa+8Fi*1(V#A(&_!Ae<|=LY7rz3VXqwl+)fz`O*^~2G5kTewH;BH_Gu`0TMyCMZ5iUq6O7HhI0)=z@Z0z#f<8*tMMGub|FIxD|9->_rHUeb2Awps%BfK7c^HoRp z0x#nh&wOsu9>u}4(eMD$wOoeD^0!xvkJ+x+8X4sDV|FE|-|53lrO}Yy3!Kh&goALXvNHf)yHw)E=e1l0-%0}0p3q}8 zc}(_bid7`OL9uAYj`yZ|0Yyi{CjtwL*tdeq?OabrT|Rd$UE1O$++6kbk#IOM0a8|Ls2)X8BnhCA<98Q233_}t0msBC z`lTwb7Zru#!l?lfd+u~e7764d$U}6FHA$B!m0e>`PQg-?seUw*(ENv=S0em)2v}fB zZzD8G!#8r#*0q)#{scM3C1@nZtlv|lKlnzXpCOE$Y3Qf+j`VM$Px|kS(aCQ)TGmtx z*ku#|ZmKjvM;bPQZRDoNk>DoU;-{{!dZ&a!ewYabYT?6apL%Z%bnm7j51f7yabPJr zYFcM2%Br+T&}@WFXyuMCERUU3NDA-xM2aKg3wgu7)?*NSFMtiI{Nm!7>V}O30d5x4 z=*LRVf9O9-Ijt}6kA}7hFpI~Wu;hcM(6O0k@p3zFNleKsPQP|Vf(z|br<(`i>YQx4 zO$|reGT`H!MyE~oI?d%V$fkQ{`OH-4U(eb|)HY$g4gEO9VRkHb<+n}(K(SHy3pNP8 zbjR1GMR7V#PDu;HZ zfB(gk3TSd{2hS($eB5DeH%IS*CIg%G=9`cfJN3*)ZtS=yk*52X$kgz9!X!yok4f0vF3l{h*c-thpNlbP z?E1#(B3=wGe_M*_P>2|GZH_9|JnF@e)P8iD8Lt`B+zZUfxc`fzSb0K1RT;Kvz0k5fub0=Ac%H9?x z%HP@~9=vifWGdt8+{RRX)iDWp6PQKY_+!;*ED)0DwP!#$XqPhR{z!Rr*snSXKz4Q$ zBxYP}SD8ePvS8Uek7Z-h3NWylGWHw?68Z$3K6KZP2qM-F4w&cd&d(D1i@gssXy3@8 zvqhfgRE)uxv74u-il`eTJ}wITQiR5SbIEALj*-iodlpQYBnO-aks zzQXlv1G@4x0e${fyu|fab0R#%q2`3{QsL(EHDP z5vUWE^aS%>GjyacfemJ?)#QAnYl5SUED0mJ{8%iudo`Q#Q&9lo8LV{;QPQ*|a<0f% zJv{H;6C7)Ji=M{!w(^24OAuWl6&ZQ~WkC!$zp!;oX(YI{dfJw;=T5>!;Jy`gpAlPs zwo@Wvp7x|$G_~2@`{D_d8erQ8>og4d2fQk@b?uw9gAO2AdmAzo`|VJ#mXY{cMBhBl zG1#HZ;qZ=5bj0OkUcPq;Y14w^;VXePPH?to()GaW{OgbPt1AB#-NJv>6m;CB%uxa9 z0$0`#R{wDgkIx?-7HdOCt3SH*g~=OzT6+s~hzXTIyJ+UucW>2?o&t*nZ z0W*DP^4H)D&iQOjW8?EOnUPH{fXqtY=^t2A1qEhcD{HmPY8kUf&dPUK>U9UsIrMO9 z<3x3NWgOGiXRiMNAkNZ{y1$pw;hfThT6z^p*v~4B%FQ*eHn=CzU%*dI)qmdI4RJ?Q z#XafiaO5=lt8~lab0Pt}W8hz=&GfWaLU!Zp{BiP)zedS?FU*gXcX*z+_JYg`BOzHe z3yTvLpFuF2W50cB^-@ue@oV(=_n+CC8MgfkalY~swC{bGnsdZDzrw@$A3dD2Qh$XR zQ-D~cCdeM%Qup?M_TF`1Y<=hwScqp z5aiCp@P!2N*|r7!?InVbznp0u;%HSqgStbzn?V088xF>IKK>n6bd0r58w%8%R=o;p z<7|7-Z5NoJbE!2r&al0t*`tjw!Qzhab=Z0gU|7A7CK_r<8&0w=cE-sot8eUgmElq0Mfg2sIl{AL0OO(gd?750 zoBEL{V9P<`NYu6>PfdhD<~&|v7pO0uDfxRLqVIwQ7oBifo7t(G69Bal(zeK0!^B(W zRZ(F9(|NaeHi+nqSrJx#P86R5@R}lYySw(9sai-PP#f8`-wm~DMvY8_sXoBxPVeiy zH9LQNK~>VM76zg8U=pPVH7FWNVvP8}NcryxVO~aIksb!u3^NWyVs0kH)?#BRfI3r! z8OnWH@m%p^5hCsDua;xO7EQFxL!Ko5qyWBIqhac5My zu_d_`5rq;I!zBw&Ge|bDdd$JL{>37%N796cx87e8fdgv4?6?=Y<5{6EZE5;DfJaJa z93s{{5ae^PvwR|9*VU_`mrw0y_~6ab6q9EC^sUs&?-|fLoIiVSZ@xvDH<3NHCAeRS zIBEXDa4({BHELUmi$E z_1hR&)!n(^%V^(Xk803Pv>)!d#39?uswhD{+gy{d#DT;`n0fM zkpsHpJDO=%?8&FLh~h}Rw3WKER|TmFgMi(o3mmcgHdfCy?-c6S?^kx` zdy7+kwjLLSc>jdt${{>6li(}S`;V>xus1a5vXEX6Ec`emz?9NwpCPU?MUNh8l~S)C zHdN+C$gk{O(*(nMG(o(%HEnQEkKH!(u1& z&UN!{(wp+$U%mP?LWe+gxLPVVEzExjklTtTpIBRmOS3GAcd43z(13BM>&boN+3N~; zdw14;N4e_m*^xtfiqTA8i<@P^Ho>sIbKR1??DesS-m~>Cw{KDk@w1PpiI>mVROZaq zm19~OAcp-ftCnXAw4-K!FDi|v%20)7S#N|oNCgg<+P%5<<*&cvB<|21pD#Dw7Z(ve z6sm7pV@8TV=uss*Q=OyPg+Wgz<-+$=O7oW2D;y@!hy@Ax{jgDBQL5dQwuUXZ~pWqn{-xm>j^^WsmQ{PWp`Tg{;z6wh0!N{R1^PYaHKXx9Jr|0R z0pm#}u~D;`JJ|vcazVEs5TwddhLbQ#wOwjhk-pdFgJaBhxZ%Lt;fA2$8SLGlF}BZ{ z&u(fzh{;wZPF{!Yi$FS`z5UQ{2jKjL{=u0!)ti;}q^u#Owr#p^*p#16^g3G<4SW)B zVaD%!l#N`r#dEWxpP;OT6}pu(!zWM@Q{G%(CgvD%mbDg0UokSypAZo-9*r5hB>MK%zteY+v6&M zM!?bHn)(f=8Oe+GnIbSd5ck#@Vb&-MAW64=?p?jzd&bRkuP9B%v{%f2z;S(gTm?Xl zTKmswa2f{TDK0gf3v@+)z}blv*T7Bp$j_m83iKV|4(z)4qrZWZK|69JGMG6}dClOG zNiie`G#(n1JgsSRJ$ENaQ(|wz6y2OF-A?|dW;By{83WMA(}AtM*;oLv^0ObM)ZZ|4 ze^NQz8c{O{R#yr)3$0chV{eW2Ms&TD4f?P*E30TB0$I~DSS&54*D7AF%K9)P37QFS zjtuHrK6!Q$&Je%>8M_*m(0Ev3B$UOO+S(R@vAhAATz=|M^qh-eJ&Aepi&`dp*5d_nyUaIPHg?s^o*GI>;eSJqm!q<_z*xS7yT|chTeW ztxJ+B*+nV``la)$;@ENUMG_nD;K+Tt$>R{y4!RN( zZ9_SORY{fB1(kRz5SNxjzwwAj?AEKGuJDigwv%m_-DJC^YQT{qh50E^~`PY&pf7 zY|xHb0HZtCXMTa~zXRSof7(%4P1S9qC!cjFyOe0MI#z*wo~^Xo${09CVi@d!@gd5U z(l^Pz3FOo0M;FRTM)4)a$N4}z>$7F#YO+7ZrT^|l?92`qUbb?=Ge+IDm=z6aed?U4 zPTOv%@<6N?un+o25d6cs3*D%2>=qO2NZ!TDntUQQ&AB%HdY=dtmUW^6dBpw0HPAYX;Du|yHk0BXnkd@SgO1h;rPmPEhOwpfSihR#z3OyUe;^j}PfQDsLq2CIv z6<+JAu1`;5;ywnyU5NBf_~FjWlGqOR`j$5Ak$6Jh+3qfR0op5prax(0xs1SF_xWQ0 zD}oxdGzCY}68uK3v4V#$9rxS)XRiw^7oS64)9h@zbK$ zme#y38o+^PUV|Fd1Ps1HLri;IqNAVo#P3Dvq^mb9B%o=@pyqiq+W>J>gjlD&SF~3@ z1eX}w?;B?4^uf~{N6{mKu_0wA&0w1#9dSF&*|_SI=iLcdVY={gBZ>4evGyTkQrRgUJQ?wlx!#0levE z2l$6$l~wZgc-un4YM~r~R^pKY)Ti|TU1ooN8~670z_+xd4rW-YAJ7L&b+OIGzno+- zRq5Q(yNSQyR~VS$(rHf#lI(nCtaWLH@OAY$H?@+-)kJidls@9m# z(Rq7L=i{ETX3t(J2h zXleEM2i&My_O^O?>5KYVG8Gn4#G-=1ECzJ0v@l(_))q%?D5VY-+qTcnY?1haV;Iou zwU!au-FT9Ew8TJI2-EZi5dVzZ&Tw94Q7t4y8O}V3F>Bz@FYQ)8cVJzes~G;2?B?FP z=jmo1U}xcdtBv92n9cK^7=0$tv?*)Uh=c*c5r5$Y{!9Ue^*WON06ejPpl=k? zdLkxm?7l}Ek7Y#A1;}zy*tlvvNa9jWo!c}fHn7Zz9_m+z_S>E$VFI%bhBa?8;I?@6 z(j*7neyJ`7HiFkf}^EXibprs@s{akFTw2kiSko3 z-3vu|-F&~hMM<8Yc!v*JknPPM-*S;SZ*=X?NIpeC=jp8mqhy0Snc0}&woxip+e!lO zHXBb+f5|a(!vZSKQIW>LwG|6@{eP+k?olP zm`3o1j98r6e*jC<Pr6t3YLH1FG#~L!7r5w!Us)ybykT9-mUs1o?_qk$HRQsy@&4VdDkbZiqS0^0;HctatqIvN<GS4hMS1s)80+j6Ufwp!eL@Bhjo@iI4Q(=T433g;f>T>5|UmR!CbeJ!k^{s_9!w%P5eA;9H#^3X)!q_6N z&N6?-Q{syW#C``HkTh<)=3biJu@B;ksS4~7Q;~GyuR}shSQkeh#wRiCj=m0APgB*~ zAS*Xj@v}4hRQx^_8aRL^FSP-m*nw-8l?7;O)S5n)v&arsgs#X@ zqJl|E^J9l!uyw_TWFBr$ zjEEhBH#eF6gnx7KQ(J9&JiQqP^rgRZZ0-o&(h#j?i^RW}>6P62l&V0s3jLQY2h&$Z zySTgLfXKT-Ywjuomev*LKbtVrK43Qu7#Z*M53N|-(p=;$?~^y!#45(k=S>UofltTf zpv>CtMMBP{i*;9Thz}`pU`0BeC9~Xj{{SjLxeB>Q-&&FMywBZvsrWt&@zv;^DY%^* zvLl2KgL!?>WF2>y4!XNtwG#NUiD#BT{185-6`g?Ia*N!3zXwXQwHgZ6+@i@F*Jeif zzkSdz7w?Mht3|}f%11E0rAZ9*jDhrCJ*>f^`SW{hv>W^aup07}7!(HKwGrWQSZ~Q$ zqN8%a*4}7(>GYd}RuUWxm58KP{q!NuGd7#%mop&UN#1epNJ}3GJq9SorB5 zE2%RNJb!%ap#R6CaT;6Hu|Yxo3M3-A2f-}me&pQqiuEX`5xI>IYC)Z{px+0XI39d$ zU^j@w5)K<9%8(I+xt_8w%1_B+4`T7p0N+Ns;g>98Nox(?Yh(<<(~2qV`U8Bmt^TkC zS46b7#-i}X{ZX4042!*6)TC+}hM&@Qe+j{ABahUcoa)xC%5k~ZY1rQAym^Io^d5YB z_jf=rcB@;HSLGHfQ;fN^bfXDJVh$9RSXN+}ldxwn__LzyC?UVl&-n6(b7n19dfL02 zov{+_Eix3+-eD_zwqR`TIvs~3oe_xjT0=XUBXNg=R5skm)}B0qMn~*p=S43TK5@WU;V<xY!1w!`X}NLP;|x5%_D_tLs^ywLd+<7q%T5?Cf~=wkKnJ4_2Y$N!?llXhDv9kE?k>kXqOB?;uf(PL zyO2~IqkH#7U28dWrJw(>Th&{vA`R9yZ8=CY9HGC!SwbYO?(oi@6BYD0m1Kf_58mBu zAl6aA7_8+!5s=!O5dnf$%wT~9nQ;j9tFN)IXxRw}<*-gwZSTkI^UP$p8ry++8k zI~d6*cM>5Zf1&0!_$0x_$(K$S6*O@dQkGKwHH^7-D`Z*UH>+5VI8vxwf5YmIK^~nS zsbqv7I1psUiE$EbqZn{>iF~aqHmN>`O*5lJ-3JU6sGo&)czCC3_!tQ$0b7F0xw6@X z`#Gyv?ZD3-JHK63iFqC|tpiQ?oq#N3Mw-!3ml5v&cLAagi<{jm*}I zhF68cz(S*ElEEh=0GU6f9k!dlhya=id)YEThvMm$MPCkP%zH9~!wW4al?VwOQP@gQ zALHX8nu$ZJ+<8B!^#@#oMes5T3=M})X4o^&TYcekM=x2nKuP)i-jGFbxc%0a))S{y`$x9??lfW&RPL6!NL-7~1Sw@)ETW?o&$`fma zwMe?&F}gh&b>4hp81-dypJrhH*z@7k(3fRNARXJmjD2OWJ{#)FIy&qo9*=#Z|~$$p~LiyEpIty%Lk0c>p9fA zib|Z#3Y%4O{oorzDZ{B6mXlv72hILIsKN2Iy4YMi)`y(S&ap116}MTtedr@{46+vY zC_ThUW`(hTzdKr$s6~vI3V$j!gx9TFgeWATqfRml$j=S-%}w; zZe)voBm*enqCd;VR%M72lNL6dz&G{ZqZ}ObJ#P?7E2u?B5CKbPEk~4cH-AzrII>^sL$^)N`=Tu)rJ;Tu z$HIwuyM!Yz`Z$+ELbo`MD5k$ZG2VOHGvEwz&camFqC?V(M%2bgfZ@6v-fL0e0d)k{ zIzOXE`nk2sGvk6vEOtgi=O)}PeeYoq>}=9!{-<0b9~$q+aA^g;MO0{C#`M?^7)tl;O=mt+!~6Y}NmK^>)JTI5BJ5h$D7@&Gd^+qa?T+&jPQO zl>3<*a?z!VM2jyF8)9-e$)`7GcCr>Z?QRuNGYM^j?hl54EH>ypitazTcwx zjz#O1LGXCw79~Kj^c}Y;h!B`Dj*SJc1#fAQl3@VYegArWbrm4#XYpM zTg!|lqr$mu%mHTk4+t#iJ(5-fdyC#MCKZ+)tuUeh+st`FF3l~H-g5T#unw%D=^9Fq z2xB+@sJw{)*rhlFZT}}@3N(GfAn6d{iW9Zy5WSKl2c~jFaCS&-J7>!Zb6K|(i%xm+ zh^`_ZoJ@VUC6ntTXpH5ysDpxz4gxv&ZRF0cLtoOI%rjCl=G5E211Cz>!}OVjT@QJw zK1V2wu?l9nYlN)V1QT?3orGz1AZO7tDz#sCOXp9PHF=7h=3hJ7ZaHU~FyNrFd0kxp z)|P2KhE-AoL3t%(&wDi7Y@Ldk?*N9H(l#=d3>lSly3Tf)4mb7x%u9@Jr9x3iH5~sCNaPT@E(KO|;^Y_OU;sYf&|6M@g|!2jl5&3bi_5l&k!qM<=DW zyfVj;K+@AKEK#S4v|e+r+K1jnZYCr7hKax9;v7L7^yCn>ww2-GvwA9Vr+{Q(TwD<$ zdXgNr#jMW_#4RMPPk1j)hm_v6R~gBNPs%?ncMZ)a7IOfpv|sB~$V_2iAz_5{rjNEgqBVYO0ZRaYe&mZ$HYEwTFiS= zqfl1xAIc<28?!_@t6K1#BbSn*Kd>ARy5H3`y|1p742=NTkTwpi?W*X2 z^`^^@>EtNi=uYq*r^VqG7E`v>VG@JHv=JX(klKh1^>eWiH}qAL&Hqk_42}h8fIz}i z$v$s5!TOg8n41)P3zGOiHYKxpWV^*Spvb6$-{u@HC+@H>1Axvy z816*sH<=_~b`U_?+sIfB>u=QOJM3~G(%R-N7 zzi>E3g1RL*S322}CZSL6|NVJnN||~q4;INhHp8{{f}TjcoomEkdeoHBHf3+Zq=M^N z0u`jjEX4xnnvV$@kHfS^njZmsjNh+x#0IYO3k%+i1xi4_gmEM#S-h*viQt|br>t5* zkX63R9E)iNM@J42J`69t!Y38)i<*j}+`E@d0RrzhbHB@Lvof)$E*B|u z-_UC<%nqwID4#c$m^ekouu}sPT~AFsd)h5x58E}>mDJLE%>u|Iw3Ca;(~%v<)39B3 z;$sOuA$pUqrtR-0k5HskXtCncq;u-GGaXurY?VBhsR+*^SmQh0bcjw;gOzlg{cl`F*UIxeQ;ONVxu2 zz_GfEryftwKHFAw-BapOa?fOssu2*_th7x5Xc=uQDHL)e;F2au>4gE^CbV4N@16Vk zE3tsl)RY-t5i3uQfYl-+bvnfhKYsUArnR4{%A!KA*_6;H6As%;w$cLgiSUFl1WR6< z;1#&FR?2XO{0p@GuZkZWi?7IEFbH%aSu9R}IMKfQ= z&RkynZhw`P#Kd|v?DDft+5MBzg>0EU)qlQMgAFv0yZUm_e1Wm`EHst#{a#1G$&V7x z!?_;2X?q;K9-v_|_>ORue<9A+CO?f=*fxGYMJ=+!B+?;-01-~~h@7)~+*`>=J*#4S zB8jr5x@se4jYhsKKs0puB{!NR;+LBk*lzSp!{hsrJ+ru?Bw7(4L>*QI-G62fs0DW_ z$#~2+;@c1$^K-=?k5aG_XTk`vWWzspqABP4U&SBt)^}PIzcssFFmUxg2h0Uk^I`W4 zxwVG&C3e8n*2r%b-GA;wb|nXLqGhzMH>Gs3QdEiM^ZCT(vhWG-3eCR^%25)eWuDc$ zdbs?!U9c@b$QM1No!rLPU~DBb5}X$HN1WkZIC?F`H2#72hf|X4Oh~ueGnTkrlwtyAd(!5%q zH-E!9=f3ZA-PiS*)&pN&By!vW>m_Qn=`U8so*v|JoGMa2erk1+jJd=+%5U96kcJ^+ z3n#Yemck8gU@Ifmy2C@0Xb|EAPLRRqg3d3KUZ#QYmp%5tIwyD znLPp>$BlV5=9H4W$<5C*W3&=eV}1njE@l7M(0M;Qsp+oB&BMHT^oAfLKK4Kl>#B9yyPkqhjNm+l!nDWMgmCNp3T~Pbm^A$mU z(1<3qx_Ie>NA)9?%&$?$>{#=veQeZhgwgAYw8Z^7HV?Z~4;y%k^A5IMGYUpQy-PT7|8WDEhi*%u~(gl^7%&ymSWstom_X5;Jx*%s@U2 zalMLaJ53gA`$B)-Jz0w=3)l&_cX1RvqT4Bb7;V%Qy`1ulSSkDrv^$OavN^N;>Kf_w zwHbNf%;1SGGtI0c;|)NliD~DOwS>6TRu9H(3PpU+`EgRR1+xsH7b#H~>?mmZ%NOg3&zS4~w;%O6daY-r~{bTGu{4>Xzx3bteU7Ko; zTAn-sgsj5c`*UbF{L%%mjDXp z=B_1u!d5WXoJE|wwBCqz;y@r&k? zxV;JAAB8IAG)b-vH24&r(T_`8wm)Mcyj*@xG3M{1WA>j_v0=l9{v?g=Qx+4O(DcFb zKb^#*WJH$DAV=kIf7oFqE{6*60lgV_v)yE|g7wU2+~V3Yo<7th+*D?YB}gsAKIi4c zEmiz%u4j=)uJbZ;Df_DXWT)QtePFGH&{ADc=Xy`qTbjy9-o-vj$m`n_l@q(YldiToLcZ)eHEkd+H-+S5Zr2n)YSDrCJxj(?gsWHtO{ zEehz}2&tYnr^ZoK*{zS;pf_Jq?GAtQGiz@j@DTUlZojv;ec^s8Y0J+|TW^Zt%|nMm z4RYu!yPoSudqLu98hJKWt*O7fP`%$$N}wa^QrNyfmR*=j|W zJI_z~Ba|CLAfLqeB#Idy_aMmjSJN`q>+x?tlO*6-S5sf)s?RMJ>GSsE`8@y~wMUDm zu6UcM2{TCmgZKUW`4-M{ShXmJtGiR$#IWf|vh?U(O9WPw$F##yK0&yXvTNtHfNPE< z>tUJKvHI($u=U^@;CgZ(wOUs_s5HGGbZo=WF+Pcx#)Lq**sz5WPx zpw1kT={{BwRNA>Gv7uBuJG-OfEl-+^7iEM#@RWB!<*nH4LyY}F!vjxd^4trw{5+W}isU8Y1Zu~mP*0qD8n}g{S z4ja}-=FQvp>cjY9LYw}9G5-;RPs6+jQx0B}wU_8Wk#3tlWPmK~+SozZLS#5W|7Lx9 z5b8+vJxj($W_v}h0Q~SYt@;Xo(eoUWHts2qi^$>GG~HNPFLJLHY_!`s99ldK3rVbe zkry1%^0ikucJ%qy)J#0AN_9jm$rxzUJ}NMF=Pw(+*Dc!EGr8{@7BJXa$BY_(?9a?A z4?Z^M!vD?uW0R?`R`edHTCE@6%jt&_RjHGLQJG6cmQA({Go77`D(%ozgWiaR*+X$v zt$+EnosOR)Cfba|i`%cc$T#4SQS!%!rRu8znWqRz9h0?NM;FYW=|0)Ij2CMx?ue<$tjs^5&|y-d@Due*`)sm+#Vx(_&>SyjQdb zH%(4Iq#kPa=qUPEoL}tmkq);^HV7v1u!<+W>UQXV zpr7cO=az2VE_!4Zl?T)O=lu-pGDW|Qtt^xVzBy1}=twfMdi5|N(b-KB5Bn&8Z+6{P z(TJuFsWG?U*?ya;WbIQs@*>Rw?CD}r{inNRXWP^-dgK`cipK;SQe1lU^l@SV(D`^{ zU=jg`mn&D9_A6Ed1L&PcS(K(*kThm^VRh3$adXavc{#gqFQITFepOMdF9^X56b(b9 zqo!j)6?0R(ywZI4T7|{&bzc+jnIh5YIs_Z0TSo5O!%@%S)#vbS;HH^b&vMc?9vN@K ze+0*!4(xp2HrFPvj2@Rt8jW&Tb;ShXgVs|3vc&x-hd!uHh^8H#8Ym6XqIJL*bONl! zRck27_zIVH(Sj1^QNz$HXn!r*NVdAAX`VaDeG_Cuz#l443M%_@z6D^SGBynrW5P~j z7x!XEh8WTT?2xLYcdYv5&hfNZcL#&HU`O&qu_my{WdIDnSHN9a=Qq?9RdYg+S~jg| zGTKr7!9$7fK&^c&rg-$x%*4*Qu&8kaLe%TuAiSqsyb-K{q;L-pYfY~&px3W#J93Ql zDZH`LJ{oKY+yyRc)aHC$rr-)HK;Z)>{sYmNoUpZW4;K0Rl{@7)0P`UVo}&5 zD)_YnzEp}8&7eaWQMxe%O1?cml7xMWEcUhf$A6ELyD>*6&&dU|A_E4J+hWOpr}#!$ zvV`@Z*Q3kClI$(-Q_yO6mBL0%C>NLU^W^8&PSQ_}Q-*WSqcPgUqM`BSldHhf|CB2$ zhbRjUbnobjj-+v|N1@jdZXoMQEx<}nYpr71)A>o zBhXI;za94581<4;B>KB;3Y^Y!197{BaKw*5umywFU9S9Aw7Dn~7ftITwWcx{3E7L$ z8b>qCmU%VF2 z9ll5WTM8kE4PV*5Vr1>rjk%Quud@A_X@*-?drSpDp- ze$i2a=e;HU1z1gKw$sU6|92_<--&LR3X7UXgp+J#Khxg|mUXV#IM%k|CSE!$J8NR| z0KE*g+_}H6n1RPWMaZKs?)aQ?WM>%B70o zJDBLbUuUka>vqY+#SQWTaN=R__`^_VRG3U3#e3!A6eWIT#bvk7Q7_b@oL!6iW6azp zN@p;Za3`+QRAWNlY5Nr3C7uTGBTTUj*8r?SA6=|{r1KE1b{!9<%|MGX{lr^Q`%30Z5Y&^QF& z11n%b!he5}lxm?eMskBwOrHJ3247jG-3LVPrLP{+0v+f377Ho7f5-KxiPlmn18z)( z!)nn+Zd)wa%nQs^FDma-%W@sVW}*61o#>PuWiOzg1IU@(OFy85}(TiTtS&k10LWJ@wF7=`t$l3{^vo_56!Xr>mnKBMN) z?unOLYjje<-7Sqc6!rvc1Vz1myL;U~)c(-g<@ql78+R6C z##L@ul&|W_2RVRsC!nuS6CgNbICyj8+KtI^Kw-9F`sJM9KwlX)Q~o8uunc4&IWVpN zH;7wvGV4>r?ai&lsSvB)AJI0JV#XKrhxG>fovY^!#OU>Y6bn1rEIBW&V7I~Yh8`Kq z8Bd2B&F?){f9GNk%PKhZ7niohy8wZAP1GI2kkT(_+<7_7F_RT+P-@C|&gp&u1mfL8 z>f=O=8z@duHK*r449oM)&OCx7bsB;(7q-)}*HU%-8?F2xe)F~(T00*dKNRk01m0jW z`=W!bw_1<=rG&dnTn9 z&_*uKFDNq#qLhYL17OpJE5;$0f=(dU4}$kqGG$xQ^)Jbg!|=i_@@tvrIpZw?OO3Jb zF@oWpfWo1lQy&wVA9~%q#yT;7RTHP=DBauKiR4`?W&196iG$j-W^OE@{|U`C`1Bip z+V@yPid8KVvFWh%EJlWl=y4bewus#lyf#;02Mwo>duvAG#yQTAP4vr;nFi`iX)%Mv z`Nk^@_-Y^MO`cC-YX`gE-F9Jh3P=;zG88!YL)1F$?#6+{~*3BY>xq}9dH zlGP$e8n77CEmRPUxwN_qmT}hkj zhDhlDV()g9`!{7f!5yPkJ+=R_II=QPHr-TfH4ca}MMhKHPToSei0vnt8(Pk^dn_94 z|6v{osxED$tKA_?UPL&J6gSPW6{^quBP|iGe$xf^|FQm(Ta~D75}}$2zmrZX+gf@g z=2=ttWC&HNU!N#g>9>zF$Rfv)Cx-8pwnN+pO>{}$K~R~mp6%3{S;dYfc`xF?8FL3= zaM2)=6MT@SIbW`^T6~!i-DU53@w_c4;wHHCKn*%eW@y&e5Gf4;BmHy-!G}*3r=_9V zZx=02A9x`}Kil!uFbsI6wUV?|hs6pW@y7UUUOLGvxio3e%XvtX4^F+`Q&X8yW9@ms z-h7}kQn$}7AH5cCILM>|)RJ^d73jy&=0)@%z2@uAn_0vm%Rtj)*~yYF*dueuTdyaQ z44-aAG+k#O>u_>k$o2FxmTL%*X4jB0?a9)^!DkYZnf>?59MlbR_^$-GeK8xr@7RE# z;$u0&4eB8>IHKbXli%#-J19o0jBCNJ&E~Es-PGRo66WXa?{0Qcrg^RUv8TU{6#iL@ zI=R?f79>n;WT%*qu~cmZ{1!yX{oJix`z$mv^hq1baSHj0E4@Qj&R2(=o7ldSA6AM2 z$qA5NS;!dyKU9nEw6HDF7>OXB(cn;+LGJJ|V5W^X8N?|v%Zzx9=%>cr-dPmqt2Y_~IE_xD%9|*2KzzKvE3+r%<%e$0 zTj-?V&hKm-tZ>uP4}|JRA8X~;=NvF#59C?~|B$1t;XW+3M6cL1iJ1iHxM>uBH^0;* z$w<WH?yY5tv;S?Nt^MzOlB7(E%>D_6 zJdz`Jie0IZw@z2rO{?44dak#2nY|SV`h^Dgj6)BU4pq1UoMX>)Y8PzeTsv&uzr~@E zxy(S?BldaCn*QC9d*K4659q^;vgd2;MQKTK(@EJR^NKwOD8^A}59>h<*yi{Z(~$%` z?_I_ttIgTpbQaoKkIfQsp> zv*RmKZ|lY<`%Y9FiQS~-7i|TP$gl!P%kb#tbblJF)8UdQH|+4XPlK$-+I8TXehez; z7;wxbNoJWMPu~Y$@~6yxrMRQV5^To;)mmB?fZ39S;ViE1e|C|z8S-%~JDy0VYZ5&i zkKJrTyI12>mlbYQrLpX(bPE;v>}p#7S4yBoV}p2H~1(3#pw_L~TY)sr8-gwh1j+jJ+ zcicI{h4tp?`+#rpilyT9h9lK^rroA%nrO$+BUSBoCh-?)&OvZD$HmPhZ#1Vmv*f!n zRz}ea<6A?t>9LykvOr*bWbM`ivguP-b!yRf0k*T6wW{PeTh#H9x%@(3nKAs_w?IFY$GI$#y$FZr@&`j`Y8RqPK@@n)M ztKTpilD_;W?^*SE&+z5yLZ+6`4M;k(6vH^*NOH&$nb#1WukH4eSAx})wZ-5hh+l+P zFY^e5VMbgyC8O5iSK>MA)8(mcCuGNcfe|pM1kJH%yuxU6v4tdVwmd3%WdDb*oe_9; zy%#n#$evk{7sFy^PgIZpJ-n&l`Dhr1!)&=_%s7SSXt%^3%dU*!Tz-^ef$gPlsX`^_ z4U1FG1m2uW-u&f@6RU}pvsUg$=z6pB6@C!ibmi*1X=6gh<9fy6z*>}xyh-dciwWN} z0xd?Zt8Nn(6^rBHw5j5PYzDGuXoyx|B#Rh@@H`^5I89J=AFr<5A%{^h#wF?Vc#{6F z?*L28f<|3f<5BZL5n*|#rOd>+NnW8?op?PSwjft+J$c|^d7RWJ&ee|A>vP(AwJI;Z z6j3?c2sAG^NLK#u*XZFJae>(k+Yk$B_=D!{;t!A;(9LR}dDat&ovtA0nH^hTGzb-S z=O(1GwWlzFuheZaXnxSojTX=igl4gp9wJOtBdU-=hJAGrj1!aK{U+mo3Kz#>vNx7U z#nBXD2%pdK0d>@zp@?^g>UFMR%*-;y<_n+cYi+dJC=jLTE}^98sff`w>|ml*rDR=N z9yv&`sL8fr+qAHavWDmm4xgs>ewg_c7X3wqpqH<0_W86NQC$jRM4UGmg$B7bT(BEe z1@d6Apfk0H>}@d42I!{^Y2Mqm!&3Q=49ESLRnD3D@M6pzh0gtBK=(Q>e9ux>hbSmw z&etLqmF9!qcMfUO6nDln1Mny?6 z0%FD;f`xm@)3|eu8V;(IvhSeGESAH=x6^QJBk3wS`89v-?0(fQqe{8n7B&GBROqn9 zd2hoYV@Gq~%*m}uGuhDZ#49Wv+-fYs`X|PUqmD`pxh|LVv5)0NC$o<87c!^Yfa{ z-nZQo@AIj{xVkQ?`943Dts|SY|2bQdw2%`x)80%@U>2p&3_CJz1Ra0<6NC`0G35B#hTp6BeDCab!KQoT#`Y$= zZYMEkpY^bmt@ZM&fg!W3;+Bl(F_;@|*Jl2<-l;G^8`UM#*;-BuA3HGCQ&n($0wy#g zd(-_i&UaT2mc1 zHtZ<6h;eCk@V1H!a{?%xHlFFNM5Sr{?E9`-uYX@(;KZ&8;brC!3E}WMA45OP!u>~< z@4mjvyrloqCL+)N z&1b&FBAQKTEsj9>?Dc52i+=Bn4@_AsVDt^y49YOKcOXTd)lgc#re~ol?|^UZl>Rv` z6#-lQo&`aCqy8?Q8v0ZZ`gN}9JO;L^#iGo15yO)GxA2vP-<>#=c>edSuyE~Tv=V>!q>Wvq%TNV}JWfT{;D zwhpA!POSgSOq86yYxC-|LT4&_gj0bOWt;v9E-d0sOfPnfS2`%dv<=3}q%{UN|5Y8Z zgoPV|XtIXKO2~L2l`ar}WVuco-m?xVnG*a%fyua#t+uU}!Yzhq5TzX7t)d><-Jjv* zP)8~|%%Eg*TJF;Q;rtf|qywWvT1nRW3M9Vnyy z4ocCO2^jLHQ#2IPno7%J>kTIz(0Dg~rq zm3}QPb%t90zsvKYYVWGXCzqVYC1CsUWL zJGropxL*?G+ttL%Xr1hx=*>4;<9{|T5o!T#4vr%I8LJjC%Ov!}Zoa#Sg!V_@SCFd2 z?X^f+?OW9D^L}G>{*6a|`Z=1`(ZtFVm6nrBWFsWVmbFj_-)Jvb=Rd2d$TB%L2F`GR zYZy~((8qQUbNKxj-Esbqhj%|gQ&AEH z!j3F5D&(x{^AET486M3{CuGvr3y8;t>ka7N-9l++%CVm}jQw&02GGGzh{~**@&e$0 zTLQCmC5MiP7Jf{uVZBd7?6;^mxo^OE4485JCy+HYYoUL$ZgwwyKrhY&u=xbJm0~%I zjqw+YLZ>Bk)aBQ@7A;27`f;b7aY8ZWyD&u(gi3-(Jf* zL48}97q!`&toFW;^fjcP%jNC$;wph-!m(yE%%y-Xu{ws8fZWt8izVZDZ~3v>#tn2S z#j{;~@qgg!2G5k-z@|V~S!&)^8iXY0yaVbE4<$$nqS}f-jk1- z*Hx{rdk+8r=1aCB3tPDxaa_#DLX8q+`o?<=#wI^S$k+)iRp7CS6ou6ksVePsWga4*D$~g!cY=JDjf<)3^POLFm#7B(%l^oEunOGqkt09sVE9k z0xv%M+0VD%@7VAA?c-a=vDUiRTIYRU=N0$$cuabN~R}w6*SY%yYG;;s{530XWjp93|jk?{td> z03;uKIKdINC=81^%F^0FiuG%2Co79JQi}DNh?=09lRV1GTGeEGR4t5(I;UAV49AxS*)GurSMC2kWgtG}1y`8>aY| zx!WfxRx1p~NgM=ncXtqe2hhQV?Vk)VlnVlF z?S!#*bYS_-2sd|h#YnN$}oP4XAlqg)(a(Fl}++pSEt-`+Th%cD_nj3Zjt(b4XoxzhZnWENqt0GNea z4UVvO`0WJGzf3{F;24w?>uuh^KtWNUkeIHJu(9e4m*oG$x{IR)#vP7E$y(mV?ms9m(ElXg1@890i~rA(`43h9R{Xz~@8REF_V(fLK8(?l6%{L&S+6Ua>}{*=59UAk!zS99N$G3*sb7wz zZPn?D;U5)0BzLk9(Q}5j_R&H+@4oode0ngLuhcjXQnCw+7;$`=b6L(Y(J?(X~p#756S~2U970-vGhlYp3=E3 zGWTW!jBLH$=x5=*k2@}?@RDS1A@R(+JiRn_S8;?`ly@q!b{|+9LadWRdCO}VW{N;v zZe2nq{Yct;@$xDwUq#GayW?LUVrlb#fR2D5g>jcU=L(fIM4F zp}<@aaY{N{2C3MNa$FoU;hAHA$9iMOyi zl{>C;$!9n|vFu?tQ_tuVQ~0}KPfCOUUUXOk>`!`RN7{;PGQ>*onS7B?OoFNslNjRq^2DWx8Qnl3W&o=zqP3|sUUdI;j^>z9e42$i+kzT3Ehb@jgBiCmAVnzneyR|y8(>)nG} ziIKZ*C8vI!uBmfmo75b(KdUn`Lu2xlvugS2`BJK;vDpj__;J8NoGR9vAOkUD|JG%P z=FAliYM6TjZr9T#!Jie~ARQl4?fOdpo2%6KA@4a_G`Ch863cdmONBP=rdpsL|KvN`=@Q2kib5^VO^~BHfnr_Rlg+rQCt^Z3f z*4uy?0JnBj9s!$4H_>CSUkCFbW37^zRSmC4eFC0E>ceTs{_sd>fZyK35@_r3Gtr(S zSCGpe;dI9`WlEtSl32YVMtEolTVEzaLUfMz*VD@%=eY1L?kvq%Wle@WYt@-CE%)wD z1CC*%eO3hC>BW`b;C^8CvB3B-PgOls8%rp^(?=~T^fTu;>i#+3A@Mfn9|<^9ga#r4 zfRRA#^dyRtBacm-ht^ij7NuNy^1^e28~L=Z{!Yu^-7a`rhbPf_oKZ<5=6Vc9*a1a( zsJ#}d?scdE!z$i-{(~dFU10&^p5R*Z`SF}bpg1$a@|42_%@d`& zTjXZr*gPD9_wjS$=QGGUrh?pJz%%?)Y}j_pLwI{!$D4fxH1YTAyJMPd8HnQo-3|)* z$z};$sk8H<`V`l9C0{Gqk#qE}vh&KO1Q|#kp%-MvSnBdUjmYj7V4n^~X5QzQ;TkiJ zC$pZ|m6aEvk|B~fAiD}>voCl}-OX~*ooJxHkQXG;KoYBfmd%gmr}Hl)DA*W}pcx1d z*dUj|9vW@o#6w>Q)0(%^P;yk`fz=*;(y`yk%8NNx&pUsq?$v;K(R(*1i0(zMRyf4! zlRFJYAv#^zLs9Y04^`SA4eVFPF;2lkQEYjicWyhG##I@e!XG?2<5qQ_K}(Kg-%B^x z1^&0bETgUF9OMk>>B)oY$r}e0;k7=KuPHP?3nJTn)a4e%sULKW9 z9JJji_j>N`IaWz=+w%DhHIWZi28|W$K33dxy(%guGn7R0Y zNYP=JzD)?WISuN2wsP4HqOs4m-JR0ZH&&{utk9~su`mpBL&+9!D3#dILnStN8h>AwpnemGbO4CK_ca$uOn*BZA zK}75*4~M;yVl?Zl6n@frVCBu)d9!nLW1K&nUaHNJ-#mz~07(~L0{1@ggmg)6Ra(lmTpo;rzK?^TF-zTQLr zq*=x#3jUH|)deD(-N8u26FCY#C##F!ruM$6SF`qhB{gB_fn~u9j5^$`(}qZF50LFqydk zj~1_9pGv6PC{6SLe;P3SSS)_YVxs(@1c9jJx*yz7naQ&r*;x6F6uM{d64a=43N5fw;|qp6=}b{oPDVYo-odgS8tFhzS4FIFroOc6mw8-3DllE3&M zcF@U?L;;I2zmc11Ky-Oy#_*DaiWa*fq5JXD38X+hRs3byaUpTTXt{jEy~iN@hjioA zxn$-L`37bQ8l4%#u3hkgBpdaDu?p^BF=Tm9S>HZtF1^UD9?>uQMo%VGPoT6GDH_)5 z$x=MaZ*V~j@4c!lgZrax&w??`8IqIts~HcHDNL8ss#_Jlgg;K6rNfj0EstuCirONq zpHn-u87I0kL|20S?c%>EnOWicY01QhuD{nc;1%9sken;$m`UdLR5={VaL0mz`lUzKw9#8kac>e?Zc8n zWk6&(@5uCbdxy~88$HOHY}bs}%;WJgNx6ECs=*B{PAwAQD+l+}h|g&W_xagQ0z#Yz zH%Q$DL`1`TlCbE{)>A_$WT3_5+X7*MNZw5PeT+vwN3gY>x5Nx_V6>x%s5yD z0bKsZ>g=5$L@p=p2z2ca{Z>gBo8YW_e9B%v+cHe43z?g$q& z=&S%+^b9E+22#ovmz10p7ZHYvcS2S2h`D;^Jn^vE(7cwAM{R#F!-U1G#d7e&%}(I9 zdyLO;rS~3t4u$JlK|!np%7C&R+r2F=D>sfZyNQbXhkbVQEOnn3P#>tuov1ex%VbgN zvJiHjd-TBap0)4Z0!e~88xN*aLrw~3OJ^gvZOgIrt`e6j7v7k%%^W&?_3M;(N<|Qg z3AOLegg3OI=d7TA3=y>Wzz*cxHv_A!6A}niXve%@y}eG1RJHiqOb*X*EoU@V)m}eQ zj%7H^-BG};vbG6ezH2Bu>)hUJ>^t6m3aj_OC&GUZ`5-Fzd#;v8*G&3jT7G}cuyLs; zamFx#Wy|7kUw|V{)O+;jlRrLA&)k1*x3VEzvxX5!--OZIB|C)#&fWr$uqS4~JccAqu+r?%O`;cpmdj6S~ z-%b4%W#j2A9-m6~wHv)!tA!~=G&XjXboSlV?nnrU?|m5d!N=sfv9!7&>bGJJYY#{5 z-58?txTRiLFt+L>+E!g$U5X}5)r8uzFE85bYa+t~8sw!tVKYRu8Jw<)HLdkcEm{Hi zQ&qcbS?c?c9eG(m3J#WTA5%G;&uTF%aYYNBH^9c70xoQh551u&uN^1Vxk-LzA8%p?yMLVXpTK7MKfbWR7ouFHX-zhSaRnjLgqEs}aX5ZK`R^Qy704xW z{wkIR%%eFGQ4@9Bz(C+dVZ!%r;ptj>Yi?v#2@d-@yAxomNFDFPI3(dGG;75^k)9yU z$o-)!3|M{r>l~;3iO76MUF0Um$I{F9d3Z0)K3YaDTy}k!t~3+J?j31BvOW^w_sc!6HejhZ4DiGTGzrT{9fg_sqhAigh}$7 zUqNzc>d(ja)rvy{{VchYmQgg1Lz;tjh>qel!IKXgEGTe)j<&CbkX4{-l*vm849N}_ zFyi;ih1!^}#2{8|^YnPpG!Yc%Ps&`NWxrTsdV$Vjv93TPO4R82j~O&$C-)>K;@Yj% zzQtZa7{?o?K0A%mkwkeXT*PJ98vl!_V8Nh6opB%`{(*^l36Z+Npl6K7v(NX8C_QF9 zaW85Pw&|?kdMYV=Ol#Zb-<-He&87@>$cQAw3N&)ywE?|f3f`onwV!~KBRBSsyKeK| zj7fxo*Y@JpcXlkjjLh-dVfnkXa`w}-kCAIlb17nmUPA<#v7$y%FyF`g>tZHmWIa1vgwBSW0rJ9vrx_Ir z;lb1fa!2#WU&PvKScJB4d4{}5s%4`D8lg! zopWPf0ibu$r50#{m5gn_`e}=u;Jqk6`M`&zMX>@~9ua_P#*ktUes1mxU2t&PU3Bma zUqS96=0&U9b*V}n?4r#CBo&6*4153#%rC9X_`rMQ_IBrKr!F>t+GIXY<144Y2lH0C zPk`f$&@=2prPgO5>(s`DLzO|991&J4s__9!hC0FIRD@l9Y1)OEt%t(;i9ISLOaoos ziH%W>%+tg;9aUwxg(VL@qeN8fv#YgcNZ-}cDD#UL#WqhJM>zw9la7M4 zk&AWjqr{4*S%*JyK0)9wPRAGH>Ghxxto4yK-PXDC5}n8?`k7{az9phrxNL%q>ZiTx zMRR#S_d@rmIF@!Zz4y6~{ihDcO4q47skpAf8UQD>vfA-kKGC`X)ZNeAQ%$;_Cf(@> zbB!J1+tBqO+f_OnPitLVwfx*gfEIFoj>9d=R@AR&H(i4Jx+l~un#gzb+#)BmDv#dq z!A~hiihO!&diKD#YZro$2D=|63hg|v0n1z%vv))hc5+sfQfui)qCmrAx*eKqdn*-p zqCct?PKr7+7>qOwi{{hz-W=Mg?kMr$HK|)ubEJ{cX|eny%i7_Q+WwNMVM?Lg@#*Wu zPOiT&UvpN&Y7)*nq}MDRRZ~A4G?f5Kjk@3plr{5Wpo-H|=B;Nf>4ggraKvd{zw?O$ z2)=xqTjzu5Zn=s5{n7bVbHBDzpjL*sG^KJ`KVjUB&~>XaXad46xHFA2Scem&$0lf)ZKZ zkO<_zW#Md^8C(CRvM&>Cq-r~9)!p3$VH^G$?dvfvLI%V`IaWc93nCW%(-m74eOi>i zfJYa%DID?g=fcADnXIRbb7iL=oqm)X&iFyPHKOW%zu5crouv4{MzInlFuinIRIv(q zw7$Ss4rB>+tM||gElr+gnd9AKctjk`CFaWM20JK8U}E>p(h?ne}bXg(HJ=_O#cMN4GejdY(&-Kx^e2c$}PDF1Hnmfh~(l;xw;grCL(|cX$51aHRfaZ`{zm_pk z^zQgGwTHg%_l|2jh#TD=SU`5DK$fx{-`HH6p}p^jd^C|~-y_?T&Iv<6BFLyk8b*97 zzO^^P5?#n|UowCr{bw`XaqWOZ-Z#R$o*p-V`Vh`Iby|FO&pp{g%g70wL(pd=>yH{c7jJzYT@Fz~0d^W44zMbrxl zDie~hK1B^UOW8V`%t( zyk-Sb1Y6*df0gWAGHW(0%*}o9i?_Pi`;r;0@JNMbXb}GPu4h!9?->d49PM@F-KqUR z3rsFcglhJ*{P@|l<}S_TThG{R>*YP5Te$zK zu~Lz>!lSQS11aFrciG7W{Nw@a1I{?*(`iVX5OYEmDz3*_KX)nBQ;Y~-?fx`-@Ag0z zr#3+MVwLBJf^t-pxu@^!}(Cjn$YYWep1Gk${g$!XD zpL<5i+;g>^GRx)% z&C(kg5Ju@u9?y^TgY2AlY^Lkq)r>cvWiESf9A#73;@28$#KiH)WIUIep~!_|XB%N+ z63PYzu?8uvJ()5DHu?~2j4yUE^|1uzqzMG<*nRS(&0-S!;mc`#wX>wu{J3XLOG7yE zII~*(4SLo>#dW2#U3?QXUnq5j{JL;@gNTJbukoK@46$}9>|#jFHa1HeOvM7E+0;o;eT%}iD<`{6r z;q&L$dcFM|ZeP=Sz~fN8e1?^iR;I8SA>0rL2VYZZSi{pUu?k%09)R`O2cI0mZN2#I zk3Lq@Yx3eVKIzge1)a>&d#%RqD^_&G6Bc%{HqN1;NeQ3)&HHwKcq#_s&9^-Lc4RSI z*Q_hCY^D%WLuin4-7nOYRV34Eyb^Y5X*a+BIhq&bI7~<@c7OWS3ae>=t6TFs{m;s? zTzHQPr&x4vccg@CmKlfpLc^c&itV(_84?QW!@6CiqVH_jew-eCL;vEuvd$AYz~S=z z@X8^6t(#?1TgPejj#L6LO-(iC4H7E zOAhT$kAL&d97jZZuzOR}prH3MIW_A3xJ0JN!6c5+W@povuRNmr)B|K6MY=g$Hblor z&zF5*hVHbW46;Lx#GH7Zo|k4w&EPdvhKUIKj!cbbs;ItH3uW9Sc~?l`cs6$0D4l#` z1ZdyqBG)U=a(qt&x=+oOSF)3uQJ^?#goH?7Sy+ZEF`eeRW$#B1@MuJPq;>59l1ry) z<0t6N#oG}T{lf{fTX86hZkA{7=s7+QZgj6{pFK}IMBguNtJ85HIpZ|K5)mut3D1|& z3pZ9T4KK=GKP|P@Ib%eo$dWg`uO6hc`sS|zwwpE-%X(|>tb|E8v8psrul?}dFYD>* zvF!)yMg@r}X(Imj^wuZgj83JlQXMb#gDkLH%$swMH=-MoH-T59ZKceMY~ei3MNY+` z+3$h;t*AxUW4&RRe$hNe0wMis!!b@c%UkT1hS*HE?q?S>pI^*~zQPqBB;h3!#Se7V z-myASUK5l8D|_`-NaS*$P`H+}4GoHqDL^_eB*#gSfvRuEia$iCKw{PD zhdiUy;N_Rqj?*QQ)uo?;Cv)8qtjh}67jN|0S6QgXlnfP9DiyxU8Z(x`)qY8ryR~kk zTm;V|mTz=fh!Vm}B#F@VeBKPYhk-1Q;mxCrt5=3CSxY*nyjr{j2WasSe}6W3DSSXuE^e7<2#n4!hDrZd;QQr{mS9ypwaqtdTumh~Xe*d6QArg)wK?I2Jwj zz;pPIs|?~`WR3E2p_>N}9q#ler=JWex$_qHufER;4zO4txrOQu{dkFfZU;MbKnU%y zXyRGZ{C+$xUtH2E%OG!KzA#c3#hMeN*6(CRn^SjS;y8@rkEPg#m2K+NrPsWj9<$Zs z0AJ+*Qj|93LMO{+O_K|~FLUXA%e_x!L9^v~v7=8#khv))g&e)~DL7c$$2951iQiAXExH2SUbQq7H9iGnQN&Jse0&?Ih* z&Ll2^@X;gpSI&+WC8_0t6%ox6>uuRvkBS@TO790jA+38=qI zoUxIEt~hf-j2xHaQ@`YSLj#@NF4-X_6R)w%(ocH%t@r5;Mplz19U?oD@iDr-M08~C zjyVpeNVaD}(ap7YJt*vLYrJ37BT4}YL@>GBzH`w1jLamTi>LOX)rhRy->xE`lqYY6 zllQZO&@iI=Sy)`7Zz)0z=jHGOEb+n|oXs@x?2BtBzr=Cy%1bo~m59~d<$S-q9!=YI zC_&11bA1VVm9L css` - transition: background 0.1s ease; - &:hover { - background: ${props.theme.background.transparent.light}; - } -`; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/Icon.ts b/packages/twenty-front/src/modules/ui/theme/constants/Icon.ts deleted file mode 100644 index e103c0b8ec3f..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/Icon.ts +++ /dev/null @@ -1,13 +0,0 @@ -export const ICON = { - size: { - sm: 14, - md: 16, - lg: 20, - xl: 40, - }, - stroke: { - sm: 1.6, - md: 2, - lg: 2.5, - }, -}; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/MainColorNames.ts b/packages/twenty-front/src/modules/ui/theme/constants/MainColorNames.ts deleted file mode 100644 index 626de706ad34..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/MainColorNames.ts +++ /dev/null @@ -1,5 +0,0 @@ -import { MAIN_COLORS } from 'twenty-ui'; - -export const MAIN_COLOR_NAMES = Object.keys(MAIN_COLORS) as ThemeColor[]; - -export type ThemeColor = keyof typeof MAIN_COLORS; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/MobileViewport.ts b/packages/twenty-front/src/modules/ui/theme/constants/MobileViewport.ts deleted file mode 100644 index 485d2dacd0f4..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/MobileViewport.ts +++ /dev/null @@ -1 +0,0 @@ -export const MOBILE_VIEWPORT = 768; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/Modal.ts b/packages/twenty-front/src/modules/ui/theme/constants/Modal.ts deleted file mode 100644 index 2a53265cc00e..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/Modal.ts +++ /dev/null @@ -1,7 +0,0 @@ -export const MODAL = { - size: { - sm: '300px', - md: '400px', - lg: '53%', - }, -}; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/OverlayBackground.ts b/packages/twenty-front/src/modules/ui/theme/constants/OverlayBackground.ts deleted file mode 100644 index e7f7de01c6f0..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/OverlayBackground.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { css } from '@emotion/react'; -import { ThemeType } from 'twenty-ui'; - -export const OVERLAY_BACKGROUND = (props: { theme: ThemeType }) => css` - backdrop-filter: blur(12px) saturate(200%) contrast(50%) brightness(130%); - background: ${props.theme.background.transparent.secondary}; - box-shadow: ${props.theme.boxShadow.strong}; -`; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/Rgba.ts b/packages/twenty-front/src/modules/ui/theme/constants/Rgba.ts deleted file mode 100644 index 6b06f2a64e9d..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/Rgba.ts +++ /dev/null @@ -1,8 +0,0 @@ -/* eslint-disable @nx/workspace-no-hardcoded-colors */ -import hexRgb from 'hex-rgb'; - -export const RGBA = (hex: string, alpha: number) => { - return `rgba(${hexRgb(hex, { format: 'array' }) - .slice(0, -1) - .join(',')},${alpha})`; -}; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/SecondaryColors.ts b/packages/twenty-front/src/modules/ui/theme/constants/SecondaryColors.ts deleted file mode 100644 index 2eb3be248fdd..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/SecondaryColors.ts +++ /dev/null @@ -1,106 +0,0 @@ -/* eslint-disable @nx/workspace-no-hardcoded-colors */ -import { GRAY_SCALE } from '@/ui/theme/constants/GrayScale'; - -export const SECONDARY_COLORS = { - yellow80: '#2e2a1a', - yellow70: '#453d1e', - yellow60: '#746224', - yellow50: '#b99b2e', - yellow40: '#ffe074', - yellow30: '#ffedaf', - yellow20: '#fff6d7', - yellow10: '#fffbeb', - - green80: '#1d2d1b', - green70: '#23421e', - green60: '#2a5822', - green50: '#42ae31', - green40: '#88f477', - green30: '#ccfac5', - green20: '#ddfcd8', - green10: '#eefdec', - - turquoise80: '#172b23', - turquoise70: '#173f2f', - turquoise60: '#166747', - turquoise50: '#16a26b', - turquoise40: '#5be8b1', - turquoise30: '#a1f2d2', - turquoise20: '#d0f8e9', - turquoise10: '#e8fcf4', - - sky80: '#152b2e', - sky70: '#123f45', - sky60: '#0e6874', - sky50: '#07a4b9', - sky40: '#4de9ff', - sky30: '#99f3ff', - sky20: '#ccf9ff', - sky10: '#e5fcff', - - blue80: '#171e2c', - blue70: '#172642', - blue60: '#18356d', - blue50: '#184bad', - blue40: '#5e90f2', - blue30: '#a3c0f8', - blue20: '#d1dffb', - blue10: '#e8effd', - - purple80: '#231e2e', - purple70: '#2f2545', - purple60: '#483473', - purple50: '#6c49b8', - purple40: '#b28ffe', - purple30: '#d3bffe', - purple20: '#e9dfff', - purple10: '#f4efff', - - pink80: '#2d1c29', - pink70: '#43213c', - pink60: '#702c61', - pink50: '#b23b98', - pink40: '#f881de', - pink30: '#fbb7ec', - pink20: '#fddbf6', - pink10: '#feedfa', - - red80: '#2d1b1b', - red70: '#441f1f', - red60: '#712727', - red50: '#b43232', - red40: '#fa7878', - red30: '#fcb2b2', - red20: '#fed8d8', - red10: '#feecec', - - orange80: '#2e2018', - orange70: '#452919', - orange60: '#743b1b', - orange50: '#b9571f', - orange40: '#ff9c64', - orange30: '#ffc7a7', - orange20: '#ffe3d3', - orange10: '#fff1e9', - - gray80: GRAY_SCALE.gray70, - gray70: GRAY_SCALE.gray65, - gray60: GRAY_SCALE.gray55, - gray50: GRAY_SCALE.gray40, - gray40: GRAY_SCALE.gray25, - gray30: GRAY_SCALE.gray20, - gray20: GRAY_SCALE.gray15, - gray10: GRAY_SCALE.gray10, - blueAccent90: '#141a25', - blueAccent85: '#151d2e', - blueAccent80: '#152037', - blueAccent75: '#16233f', - blueAccent70: '#17294a', - blueAccent60: '#18356d', - blueAccent40: '#a3c0f8', - blueAccent35: '#c8d9fb', - blueAccent25: '#dae6fc', - blueAccent20: '#e2ecfd', - blueAccent15: '#edf2fe', - blueAccent10: '#f5f9fd', -}; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/TagDark.ts b/packages/twenty-front/src/modules/ui/theme/constants/TagDark.ts deleted file mode 100644 index f146d694b539..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/TagDark.ts +++ /dev/null @@ -1,28 +0,0 @@ -import { COLOR } from '@/ui/theme/constants/Colors'; - -export const TAG_DARK = { - text: { - green: COLOR.green10, - turquoise: COLOR.turquoise10, - sky: COLOR.sky10, - blue: COLOR.blue10, - purple: COLOR.purple10, - pink: COLOR.pink10, - red: COLOR.red10, - orange: COLOR.orange10, - yellow: COLOR.yellow10, - gray: COLOR.gray10, - }, - background: { - green: COLOR.green60, - turquoise: COLOR.turquoise60, - sky: COLOR.sky60, - blue: COLOR.blue60, - purple: COLOR.purple60, - pink: COLOR.pink60, - red: COLOR.red60, - orange: COLOR.orange60, - yellow: COLOR.yellow60, - gray: COLOR.gray60, - }, -}; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/TagLight.ts b/packages/twenty-front/src/modules/ui/theme/constants/TagLight.ts deleted file mode 100644 index 29bdee8be638..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/TagLight.ts +++ /dev/null @@ -1,28 +0,0 @@ -import { COLOR } from './Colors'; - -export const TAG_LIGHT = { - text: { - green: COLOR.green60, - turquoise: COLOR.turquoise60, - sky: COLOR.sky60, - blue: COLOR.blue60, - purple: COLOR.purple60, - pink: COLOR.pink60, - red: COLOR.red60, - orange: COLOR.orange60, - yellow: COLOR.yellow60, - gray: COLOR.gray60, - }, - background: { - green: COLOR.green20, - turquoise: COLOR.turquoise20, - sky: COLOR.sky20, - blue: COLOR.blue20, - purple: COLOR.purple20, - pink: COLOR.pink20, - red: COLOR.red20, - orange: COLOR.orange20, - yellow: COLOR.yellow20, - gray: COLOR.gray20, - }, -}; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/Text.ts b/packages/twenty-front/src/modules/ui/theme/constants/Text.ts deleted file mode 100644 index db9a0786b766..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/Text.ts +++ /dev/null @@ -1,13 +0,0 @@ -export const TEXT = { - lineHeight: { - lg: 1.5, - md: 1.2, - }, - - iconSizeMedium: 16, - iconSizeSmall: 14, - - iconStrikeLight: 1.6, - iconStrikeMedium: 2, - iconStrikeBold: 2.5, -}; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/TextInputStyle.ts b/packages/twenty-front/src/modules/ui/theme/constants/TextInputStyle.ts deleted file mode 100644 index 640b28a08261..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/TextInputStyle.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { css } from '@emotion/react'; -import { ThemeType } from 'twenty-ui'; - -export const TEXT_INPUT_STYLE = (props: { theme: ThemeType }) => css` - background-color: transparent; - border: none; - color: ${props.theme.font.color.primary}; - font-family: ${props.theme.font.family}; - font-size: inherit; - font-weight: inherit; - outline: none; - padding: ${props.theme.spacing(0)} ${props.theme.spacing(2)}; - - &::placeholder, - &::-webkit-input-placeholder { - color: ${props.theme.font.color.light}; - font-family: ${props.theme.font.family}; - font-weight: ${props.theme.font.weight.medium}; - } -`; diff --git a/packages/twenty-front/src/modules/ui/theme/constants/ThemeCommon.ts b/packages/twenty-front/src/modules/ui/theme/constants/ThemeCommon.ts deleted file mode 100644 index 1480582a2fb6..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/constants/ThemeCommon.ts +++ /dev/null @@ -1,44 +0,0 @@ -/* eslint-disable @nx/workspace-no-hardcoded-colors */ -import { ANIMATION } from '@/ui/theme/constants/Animation'; -import { BLUR } from '@/ui/theme/constants/Blur'; -import { COLOR } from '@/ui/theme/constants/Colors'; -import { GRAY_SCALE } from '@/ui/theme/constants/GrayScale'; -import { ICON } from '@/ui/theme/constants/Icon'; -import { MODAL } from '@/ui/theme/constants/Modal'; -import { TEXT } from '@/ui/theme/constants/Text'; - -export const THEME_COMMON = { - color: COLOR, - grayScale: GRAY_SCALE, - icon: ICON, - modal: MODAL, - text: TEXT, - blur: BLUR, - animation: ANIMATION, - snackBar: { - success: { - background: '#16A26B', - color: '#D0F8E9', - }, - error: { - background: '#B43232', - color: '#FED8D8', - }, - info: { - background: COLOR.gray80, - color: GRAY_SCALE.gray0, - }, - }, - spacingMultiplicator: 4, - spacing: (...args: number[]) => - args.map((multiplicator) => `${multiplicator * 4}px`).join(' '), - betweenSiblingsGap: `2px`, - table: { - horizontalCellMargin: '8px', - checkboxColumnWidth: '32px', - horizontalCellPadding: '8px', - }, - rightDrawerWidth: '500px', - clickableElementBackgroundTransition: 'background 0.1s ease', - lastLayerZIndex: 2147483647, -}; diff --git a/packages/twenty-front/src/modules/ui/theme/utils/themeColorSchema.ts b/packages/twenty-front/src/modules/ui/theme/utils/themeColorSchema.ts deleted file mode 100644 index 2e0159e586be..000000000000 --- a/packages/twenty-front/src/modules/ui/theme/utils/themeColorSchema.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { z } from 'zod'; - -import { - MAIN_COLOR_NAMES, - ThemeColor, -} from '@/ui/theme/constants/MainColorNames'; - -export const themeColorSchema = z.enum( - MAIN_COLOR_NAMES as [ThemeColor, ...ThemeColor[]], -); diff --git a/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedEaseIn.tsx b/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedEaseIn.tsx index 00bccbbd798d..e3a25bf60544 100644 --- a/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedEaseIn.tsx +++ b/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedEaseIn.tsx @@ -1,7 +1,6 @@ import { useTheme } from '@emotion/react'; import { motion } from 'framer-motion'; - -import { AnimationDuration } from '@/ui/theme/constants/Animation'; +import { AnimationDuration } from 'twenty-ui'; type AnimatedEaseInProps = Omit< React.ComponentProps, diff --git a/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedEaseInOut.tsx b/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedEaseInOut.tsx index a52c69e4b229..8411a4fb31ee 100644 --- a/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedEaseInOut.tsx +++ b/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedEaseInOut.tsx @@ -1,7 +1,6 @@ import { useTheme } from '@emotion/react'; import { AnimatePresence, motion } from 'framer-motion'; - -import { AnimationDuration } from '@/ui/theme/constants/Animation'; +import { AnimationDuration } from 'twenty-ui'; type AnimatedEaseInOutProps = { isOpen: boolean; diff --git a/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedFadeOut.tsx b/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedFadeOut.tsx index d3e227084de4..7dd5f4a4b1f4 100644 --- a/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedFadeOut.tsx +++ b/packages/twenty-front/src/modules/ui/utilities/animation/components/AnimatedFadeOut.tsx @@ -1,7 +1,6 @@ import { useTheme } from '@emotion/react'; import { AnimatePresence, motion } from 'framer-motion'; - -import { AnimationDuration } from '@/ui/theme/constants/Animation'; +import { AnimationDuration } from 'twenty-ui'; type AnimatedFadeOutProps = { isOpen: boolean; diff --git a/packages/twenty-front/src/modules/ui/utilities/drag-select/components/DragSelect.tsx b/packages/twenty-front/src/modules/ui/utilities/drag-select/components/DragSelect.tsx index ab4c8a304c95..a9dca6c5e625 100644 --- a/packages/twenty-front/src/modules/ui/utilities/drag-select/components/DragSelect.tsx +++ b/packages/twenty-front/src/modules/ui/utilities/drag-select/components/DragSelect.tsx @@ -4,8 +4,7 @@ import { useSelectionContainer, } from '@air/react-drag-to-select'; import { useTheme } from '@emotion/react'; - -import { RGBA } from '@/ui/theme/constants/Rgba'; +import { RGBA } from 'twenty-ui'; import { useDragSelect } from '../hooks/useDragSelect'; diff --git a/packages/twenty-front/src/modules/ui/utilities/responsive/hooks/useIsMobile.ts b/packages/twenty-front/src/modules/ui/utilities/responsive/hooks/useIsMobile.ts index 0479488cfa44..6bed73a89697 100644 --- a/packages/twenty-front/src/modules/ui/utilities/responsive/hooks/useIsMobile.ts +++ b/packages/twenty-front/src/modules/ui/utilities/responsive/hooks/useIsMobile.ts @@ -1,6 +1,5 @@ import { useMediaQuery } from 'react-responsive'; - -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; +import { MOBILE_VIEWPORT } from 'twenty-ui'; export const useIsMobile = () => useMediaQuery({ query: `(max-width: ${MOBILE_VIEWPORT}px)` }); diff --git a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerDropdown.tsx b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerDropdown.tsx index 60818e49307d..a3461683af1c 100644 --- a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerDropdown.tsx +++ b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerDropdown.tsx @@ -1,12 +1,16 @@ import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { useRecoilValue } from 'recoil'; -import { IconChevronDown, IconList, useIcons } from 'twenty-ui'; +import { + IconChevronDown, + IconList, + MOBILE_VIEWPORT, + useIcons, +} from 'twenty-ui'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { StyledDropdownButtonContainer } from '@/ui/layout/dropdown/components/StyledDropdownButtonContainer'; import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; -import { MOBILE_VIEWPORT } from '@/ui/theme/constants/MobileViewport'; import { useGetCurrentView } from '@/views/hooks/useGetCurrentView'; import { ViewsHotkeyScope } from '@/views/types/ViewsHotkeyScope'; import { ViewPickerCreateOrEditContent } from '@/views/view-picker/components/ViewPickerCreateOrEditContent'; diff --git a/packages/twenty-front/src/pages/auth/PaymentSuccess.tsx b/packages/twenty-front/src/pages/auth/PaymentSuccess.tsx index 6be845d67338..028166bd3f53 100644 --- a/packages/twenty-front/src/pages/auth/PaymentSuccess.tsx +++ b/packages/twenty-front/src/pages/auth/PaymentSuccess.tsx @@ -2,13 +2,12 @@ import React from 'react'; import { useNavigate } from 'react-router-dom'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconCheck } from 'twenty-ui'; +import { IconCheck, RGBA } from 'twenty-ui'; import { SubTitle } from '@/auth/components/SubTitle'; import { Title } from '@/auth/components/Title'; import { AppPath } from '@/types/AppPath'; import { MainButton } from '@/ui/input/button/components/MainButton'; -import { RGBA } from '@/ui/theme/constants/Rgba'; import { AnimatedEaseIn } from '@/ui/utilities/animation/components/AnimatedEaseIn'; const StyledCheckContainer = styled.div` diff --git a/packages/twenty-ui/src/theme/constants/ThemeCommon.ts b/packages/twenty-ui/src/theme/constants/ThemeCommon.ts index 9ba6fadef1cb..8c450fb87436 100644 --- a/packages/twenty-ui/src/theme/constants/ThemeCommon.ts +++ b/packages/twenty-ui/src/theme/constants/ThemeCommon.ts @@ -1,3 +1,4 @@ +/* eslint-disable @nx/workspace-no-hardcoded-colors */ import { ANIMATION } from './Animation'; import { BLUR } from './Blur'; import { COLOR } from './Colors'; @@ -14,6 +15,20 @@ export const THEME_COMMON = { text: TEXT, blur: BLUR, animation: ANIMATION, + snackBar: { + success: { + background: '#16A26B', + color: '#D0F8E9', + }, + error: { + background: '#B43232', + color: '#FED8D8', + }, + info: { + background: COLOR.gray80, + color: GRAY_SCALE.gray0, + }, + }, spacingMultiplicator: 4, spacing: (...args: number[]) => args.map((multiplicator) => `${multiplicator * 4}px`).join(' '),