diff --git a/index.html b/index.html index 80a65c821f..ede3c478d3 100644 --- a/index.html +++ b/index.html @@ -14,7 +14,7 @@ GridStudy - +
diff --git a/src/components/app-wrapper.jsx b/src/components/app-wrapper.jsx index f852c075ec..3c5dd0ace2 100644 --- a/src/components/app-wrapper.jsx +++ b/src/components/app-wrapper.jsx @@ -5,7 +5,7 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ -import { useMemo } from 'react'; +import {useEffect, useMemo} from 'react'; import App from './app'; import { createTheme, @@ -110,6 +110,7 @@ import useNotificationsUrlGenerator from 'hooks/use-notifications-url-generator' import { AllCommunityModule, ModuleRegistry, provideGlobalGridOptions } from 'ag-grid-community'; import { lightThemeCssVars } from '../styles/light-theme-css-vars'; import { darkThemeCssVars } from '../styles/dark-theme-css-vars'; +import "@design-system-rte/react/dist/style.css"; // Register all community features (migration to V33) ModuleRegistry.registerModules([AllCommunityModule]); @@ -470,6 +471,10 @@ const AppWrapperWithRedux = () => { const urlMapper = useNotificationsUrlGenerator(); + useEffect(() => { + document.body.setAttribute('data-mode', theme.toLowerCase()); + }, [theme]); + return ( diff --git a/src/components/dialogs/commons/modificationDialog.tsx b/src/components/dialogs/commons/modificationDialog.tsx index 80b160cab4..8c27250df0 100644 --- a/src/components/dialogs/commons/modificationDialog.tsx +++ b/src/components/dialogs/commons/modificationDialog.tsx @@ -7,7 +7,7 @@ import { useCallback } from 'react'; import { FieldErrors, FieldValues, useFormContext } from 'react-hook-form'; -import { SubmitButton } from '@gridsuite/commons-ui'; +import { ValidateButton } from '@gridsuite/commons-ui'; import { ModificationDialogContent, ModificationDialogContentProps } from './modification-dialog-content'; /** @@ -80,9 +80,8 @@ export function ModificationDialog({ }; const submitButton = ( - ); diff --git a/src/components/dialogs/parameters/dynamic-security-analysis/dynamic-security-analysis-parameters.tsx b/src/components/dialogs/parameters/dynamic-security-analysis/dynamic-security-analysis-parameters.tsx index 23d8b580fd..4c83d3c728 100644 --- a/src/components/dialogs/parameters/dynamic-security-analysis/dynamic-security-analysis-parameters.tsx +++ b/src/components/dialogs/parameters/dynamic-security-analysis/dynamic-security-analysis-parameters.tsx @@ -24,7 +24,7 @@ import { isObjectEmpty, mergeSx, ProviderParam, - SubmitButton, + ValidateButton, useParametersBackend, ComputingType, PopupConfirmationDialog, @@ -261,9 +261,7 @@ const DynamicSecurityAnalysisParameters: FunctionComponent - - - + {/* Reset Confirmation Dialog */} diff --git a/src/components/dialogs/parameters/dynamicsimulation/dynamic-simulation-parameters.tsx b/src/components/dialogs/parameters/dynamicsimulation/dynamic-simulation-parameters.tsx index ee662788c6..c316ca4ca2 100644 --- a/src/components/dialogs/parameters/dynamicsimulation/dynamic-simulation-parameters.tsx +++ b/src/components/dialogs/parameters/dynamicsimulation/dynamic-simulation-parameters.tsx @@ -31,7 +31,7 @@ import { mergeSx, PopupConfirmationDialog, ProviderParam, - SubmitButton, + ValidateButton, useParametersBackend, ComputingType, } from '@gridsuite/commons-ui'; @@ -316,9 +316,7 @@ const DynamicSimulationParameters: FunctionComponent - - - + diff --git a/src/components/dialogs/parameters/state-estimation/state-estimation-parameters.tsx b/src/components/dialogs/parameters/state-estimation/state-estimation-parameters.tsx index c511d0f9b2..c8191791ba 100644 --- a/src/components/dialogs/parameters/state-estimation/state-estimation-parameters.tsx +++ b/src/components/dialogs/parameters/state-estimation/state-estimation-parameters.tsx @@ -10,7 +10,7 @@ import { mergeSx, PopupConfirmationDialog, snackWithFallback, - SubmitButton, + ValidateButton, useSnackMessage, } from '@gridsuite/commons-ui'; import { Button, DialogActions, Grid, Tab, Tabs } from '@mui/material'; @@ -209,7 +209,7 @@ export const StateEstimationParameters = ({ - + diff --git a/src/components/dialogs/reactive-limits/reactive-capability-curve/reactive-capability-curve-row-form.tsx b/src/components/dialogs/reactive-limits/reactive-capability-curve/reactive-capability-curve-row-form.tsx index 390c2cbb86..71b9bbd188 100644 --- a/src/components/dialogs/reactive-limits/reactive-capability-curve/reactive-capability-curve-row-form.tsx +++ b/src/components/dialogs/reactive-limits/reactive-capability-curve/reactive-capability-curve-row-form.tsx @@ -11,6 +11,7 @@ import { ActivePowerAdornment, ReactivePowerAdornment } from '../../dialog-utils import GridItem from '../../commons/grid-item'; import { useCallback } from 'react'; import { useFormContext } from 'react-hook-form'; +import { Grid } from '@mui/material'; export interface ReactiveCapabilityCurveRowFormProps { id: string; @@ -47,8 +48,7 @@ export function ReactiveCapabilityCurveRowForm({ const pField = ( @@ -57,8 +57,7 @@ export function ReactiveCapabilityCurveRowForm({ const qminPField = ( @@ -67,8 +66,7 @@ export function ReactiveCapabilityCurveRowForm({ const qmaxPField = ( diff --git a/src/components/dialogs/reactive-limits/reactive-capability-curve/reactive-capability-curve-table.tsx b/src/components/dialogs/reactive-limits/reactive-capability-curve/reactive-capability-curve-table.tsx index f9d57e5321..a91ec8ca29 100644 --- a/src/components/dialogs/reactive-limits/reactive-capability-curve/reactive-capability-curve-table.tsx +++ b/src/components/dialogs/reactive-limits/reactive-capability-curve/reactive-capability-curve-table.tsx @@ -7,17 +7,17 @@ import { useCallback, useEffect } from 'react'; import { FormattedMessage } from 'react-intl'; -import { Grid, IconButton } from '@mui/material'; -import DeleteIcon from '@mui/icons-material/Delete'; -import AddIcon from '@mui/icons-material/ControlPoint'; +import { Grid } from '@mui/material'; import { useFieldArray } from 'react-hook-form'; import { MAX_Q, MIN_Q, P } from 'components/utils/field-constants'; import { ErrorInput, MidFormError } from '@gridsuite/commons-ui'; import { INSERT, REMOVE } from './reactive-capability-utils'; import { ReactiveCapabilityCurvePoints } from '../reactive-limits.type'; import { ReactiveCapabilityCurveRowForm } from './reactive-capability-curve-row-form'; +import { IconButton } from '@design-system-rte/react'; const MIN_LENGTH = 2; + interface ReactiveCapabilityCurveTableFormProps { id: string; tableHeadersIds: string[]; @@ -90,27 +90,28 @@ export function ReactiveCapabilityCurveTableForm({ labelSuffix = index - 1; } return ( - + handleRemoveRow(index)} - disabled={disabled || index === 0 || index === displayedValues.length - 1} - > - - + appearance="filled" + variant="transparent" + /> {index === displayedValues.length - 1 && ( handleInsertRow()} - disabled={disabled} - style={{ top: '-1em' }} - > - - + appearance="outlined" + variant="transparent" + /> )} diff --git a/src/components/spreadsheet-view/columns/column-creation-dialog.tsx b/src/components/spreadsheet-view/columns/column-creation-dialog.tsx index 7cdaff004d..ed68b03547 100644 --- a/src/components/spreadsheet-view/columns/column-creation-dialog.tsx +++ b/src/components/spreadsheet-view/columns/column-creation-dialog.tsx @@ -17,7 +17,7 @@ import { type MuiStyles, MultipleAutocompleteInput, snackWithFallback, - SubmitButton, + ValidateButton, TextInput, useSnackMessage, type UseStateBooleanReturn, @@ -367,7 +367,7 @@ export default function ColumnCreationDialog({ - + diff --git a/src/index.css b/src/index.css index 627ead4541..85075070b5 100644 --- a/src/index.css +++ b/src/index.css @@ -56,8 +56,8 @@ body { -moz-osx-font-smoothing: grayscale; } -/* In order for oidc-client-js silent renew to work it inserts an iframe in the DOM directly under body tag, it is supposed to be invisible thus its height and width are set to 0 by default. - Except iframes have a border value set to 2 which can cause a slight offset to the UI. +/* In order for oidc-client-js silent renew to work it inserts an iframe in the DOM directly under body tag, it is supposed to be invisible thus its height and width are set to 0 by default. + Except iframes have a border value set to 2 which can cause a slight offset to the UI. This rule prevent the iframe to cause an unwanted offset. It can be removed if oidc-client-js is no longer the authentification library in use in this project. */ @@ -351,3 +351,990 @@ code { .react-flow { --xy-edge-stroke-width-default: 1; } + + + +[data-theme=bleu_iceberg][data-mode=light] { + --background-default: #ffffff; + --background-hover: #ebebea; + --background-neutral-regular-default: #e1e1e0; + --background-neutral-regular-hover: #c2c1c0; + --background-neutral-bold-default: #737272; + --background-neutral-bold-hover: #4c4c4b; + --background-neutral-navigation-default: #ebebea; + --background-neutral-navigation-hover: #e1e1e0; + --background-disabled: #f4f5f4; + --background-inverse: #201f1f; + --background-brand-default: #2964a0; + --background-brand-hover: #225082; + --background-brand-pressed: #214770; + --background-brand-selected-default: #2964a0; + --background-brand-selected-hover: #225082; + --background-brand-unselected-default: #e6eef8; + --background-brand-unselected-hover: #c7dbf0; + --background-brand-inverse-default: #ffffff; + --background-brand-inverse-hover: #f3f6fc; + --background-brand-inverse-pressed: #e6eef8; + --background-brand-navigation-default: #15253c; + --background-brand-navigation-hover: #1f3b5b; + --background-brand-navigation-pressed: #225082; + --background-danger-default: #de2048; + --background-danger-hover: #c81640; + --background-danger-pressed: #9d1439; + --background-info-default: #1465fc; + --background-warning-default: #ffe500; + --background-success-default: #0b8a4d; + --border-primary: #737272; + --border-secondary: #a1a1a0; + --border-tertiary: #cdcccb; + --border-divider: #cdcccb; + --border-disabled: #cdcccb; + --border-inverse: #ffffff; + --border-brand-default: #2964a0; + --border-brand-focused: #1f3b5b; + --border-brand-navigation-active: #225082; + --border-brand-navigation-divider: #214770; + --border-danger: #de2048; + --border-info: #1465fc; + --border-warning: #f4922b; + --border-success: #0b8a4d; + --content-primary: #201f1f; + --content-secondary: #3e3e3d; + --content-tertiary: #737272; + --content-primary-inverse: #ffffff; + --content-disabled: #cdcccb; + --content-brand-default: #2964a0; + --content-brand-hover: #225082; + --content-brand-pressed: #214770; + --content-brand-navigation-default: #e6eef8; + --content-brand-navigation-hover: #f3f6fc; + --content-brand-navigation-disabled: #225082; + --content-link-default: #2b86ff; + --content-link-hover: #1465fc; + --content-link-pressed: #0d4fea; + --content-link-visited-default: #7d5a9f; + --content-link-visited-hover: #674883; + --content-link-visited-pressed: #563c6c; + --content-danger-default: #de2048; + --content-danger-hover: #c81640; + --content-danger-inverse: #ffffff; + --content-success-default: #0b8a4d; + --content-success-hover: #0e6d40; + --content-info-default: #1465fc; + --content-info-hover: #0d4fea; + --content-decorative: #201f1f; + --brand-navigation-divider: #214770; + --brand-navigation-divider-2: #214770; + --brand-navigation-divider-3: #214770; + --brand-navigation-divider-4: #214770; + --chart-brand: #397ebe; + --chart-neutral: #acacab; + --chart-category-1: #397ebe; + --chart-category-2: #ff2c74; + --chart-category-3: #7d5a9f; + --chart-category-4: #4dba97; + --chart-category-5: #233857; + --chart-category-6: #ed6e13; + --chart-category-7: #73636c; + --chart-category-8: #639cad; + --chart-bleu-iceberg: #e6eef8; + --chart-bleu-iceberg-bold: #397ebe; + --chart-vert-foret: #d7f4e6; + --chart-vert-foret-bold: #4dba97; + --chart-violet: #d2c3e4; + --chart-violet-bold: #7d5a9f; + --chart-bleu-rte: #e0f5fe; + --chart-bleu-rte-bold: #00a6d9; + --chart-bleu-digital: #d8ebff; + --chart-bleu-digital-bold: #2b86ff; + --chart-marine: #e7edf7; + --chart-marine-bold: #2f5d9a; + --chart-bleu-petrole: #deecef; + --chart-bleu-petrole-bold: #478093; + --chart-bleu-cyan: #d1f9fc; + --chart-bleu-cyan-bold: #0fb3cb; + --chart-vert: #c7fff4; + --chart-vert-bold: #04c8b1; + --chart-vert-indications: #e6f2a4; + --chart-vert-indications-bold: #bed942; + --chart-vert-digital: #d9ffec; + --chart-vert-digital-bold: #3cec96; + --chart-jaune: #faffc1; + --chart-jaune-bold: #ffe500; + --chart-jaune-ocre: #faefc7; + --chart-jaune-ocre-bold: #ebb53d; + --chart-jaune-indications: #fce7c9; + --chart-jaune-indications-bold: #f4922b; + --chart-saumon: #fde8e3; + --chart-saumon-bold: #ec775c; + --chart-rose-digital: #ffccd1; + --chart-rose-digital-bold: #f93a58; + --chart-fuschia: #ffe1e9; + --chart-fuschia-bold: #ff2c74; + --chart-rouge-indications: #fdced4; + --chart-rouge-indications-bold: #f14662; + --chart-greyscale: #ebebea; + --chart-greyscale-bold: #7f7e7e; + --chart-taupe: #e7e3e6; + --chart-taupe-bold: #8a7883; + --decorative-neutral: #ebebea; + --decorative-bleu-iceberg: #c7dbf0; + --decorative-vert-foret: #d7f4e6; + --decorative-violet: #e6def0; + --decorative-bleu-rte: #b9edfe; + --decorative-bleu-digital: #baddff; + --decorative-marine: #e7edf7; + --decorative-bleu-petrole: #c1dae0; + --decorative-bleu-cyan: #a9f2f8; + --decorative-vert: #90ffe8; + --decorative-vert-indications: #e6f2a4; + --decorative-vert-digital: #b5fdd9; + --decorative-jaune: #faffc1; + --decorative-jaune-ocre: #f5de93; + --decorative-jaune-indications: #f9ce8e; + --decorative-saumon: #f9b7a8; + --decorative-rose-digital: #ffccd1; + --decorative-fuschia: #ffc8d8; + --decorative-rouge-indication: #ffe4e6; + --decorative-taupe: #e7e3e6; + --elevation-surface-inner-shadow: rgba(0, 0, 0, 0); + --elevation-surface-shadow-1: rgba(255, 255, 255, 0); + --elevation-surface-shadow-2: rgba(255, 255, 255, 0); + --elevation-surface-shadow-3: rgba(255, 255, 255, 0); + --elevation-surface-shadow-4: rgba(255, 255, 255, 0); + --elevation-surface-shadow-5: rgba(255, 255, 255, 0); + --elevation-surface-shadow-6: rgba(255, 255, 255, 0); + --elevation-shadow-ambient: rgba(0, 0, 0, 0.12); + --elevation-shadow-ambient-darker: rgba(0, 0, 0, 0.2); + --elevation-shadow-ambient-brand: rgba(0, 0, 0, 0.25); + --elevation-shadow-key: rgba(0, 0, 0, 0.14); + --elevation-shadow-key-darker: rgba(0, 0, 0, 0.24); + --elevation-shadow-key-brand: rgba(0, 0, 0, 0.31); + --brand-navigation-divider-5: #214770; + --brand-navigation-divider-6: #214770; + --brand-navigation-divider-7: #214770; + --background-brand-hover-opacity-20: rgba(34, 80, 130, 0.2); + --background-danger-hover-opacity-20: rgba(200, 22, 64, 0.2); + --background-hover-opacity-50: rgba(235, 235, 234, 0.5) +} + +[data-theme=bleu_iceberg][data-mode=dark] { + --background-default: #201f1f; + --background-hover: #3e3e3d; + --background-neutral-regular-default: #595958; + --background-neutral-regular-hover: #7f7e7e; + --background-neutral-bold-default: #cdcccb; + --background-neutral-bold-hover: #ebebea; + --background-neutral-navigation-default: #ebebea; + --background-neutral-navigation-hover: #e1e1e0; + --background-disabled: #3e3e3d; + --background-inverse: #ffffff; + --background-brand-default: #96bde3; + --background-brand-hover: #c7dbf0; + --background-brand-pressed: #e6eef8; + --background-brand-selected-default: #96bde3; + --background-brand-selected-hover: #c7dbf0; + --background-brand-unselected-default: #225082; + --background-brand-unselected-hover: #2964a0; + --background-brand-inverse-default: #201f1f; + --background-brand-inverse-hover: #225082; + --background-brand-inverse-pressed: #2964a0; + --background-brand-navigation-default: #15253c; + --background-brand-navigation-hover: #1f3b5b; + --background-brand-navigation-pressed: #225082; + --background-danger-default: #f14662; + --background-danger-hover: #f97385; + --background-danger-pressed: #fca5af; + --background-info-default: #53aaff; + --background-warning-default: #ffe500; + --background-success-default: #3cec96; + --border-primary: #a1a1a0; + --border-secondary: #737272; + --border-tertiary: #3e3e3d; + --border-divider: #a1a1a0; + --border-disabled: #595958; + --border-inverse: #201f1f; + --border-brand-default: #f9fbfd; + --border-brand-focused: #f9fbfd; + --border-brand-navigation-active: #225082; + --border-brand-navigation-divider: #214770; + --border-danger: #f14662; + --border-info: #53aaff; + --border-warning: #f4922b; + --border-success: #3cec96; + --content-primary: #ffffff; + --content-secondary: #e1e1e0; + --content-tertiary: #b7b7b6; + --content-primary-inverse: #201f1f; + --content-disabled: #595958; + --content-brand-default: #f9fbfd; + --content-brand-hover: #f3f6fc; + --content-brand-pressed: #e6eef8; + --content-brand-navigation-default: #e6eef8; + --content-brand-navigation-hover: #f3f6fc; + --content-brand-navigation-disabled: #225082; + --content-link-default: #2b86ff; + --content-link-hover: #53aaff; + --content-link-pressed: #8ac8ff; + --content-link-visited-default: #9979bc; + --content-link-visited-hover: #b89fd3; + --content-link-visited-pressed: #d2c3e4; + --content-danger-default: #f14662; + --content-danger-hover: #f97385; + --content-danger-inverse: #ffffff; + --content-success-default: #3cec96; + --content-success-hover: #12d577; + --content-info-default: #53aaff; + --content-info-hover: #2b86ff; + --content-decorative: #201f1f; + --brand-navigation-divider: #214770; + --brand-navigation-divider-2: #214770; + --brand-navigation-divider-3: #214770; + --brand-navigation-divider-4: #214770; + --chart-brand: #397ebe; + --chart-neutral: #acacab; + --chart-category-1: #397ebe; + --chart-category-2: #ff2c74; + --chart-category-3: #7d5a9f; + --chart-category-4: #2a9f7d; + --chart-category-5: #233857; + --chart-category-6: #ed6e13; + --chart-category-7: #73636c; + --chart-category-8: #639cad; + --chart-bleu-iceberg: #e6eef8; + --chart-bleu-iceberg-bold: #397ebe; + --chart-vert-foret: #d7f4e6; + --chart-vert-foret-bold: #4dba97; + --chart-violet: #d2c3e4; + --chart-violet-bold: #7d5a9f; + --chart-bleu-rte: #e0f5fe; + --chart-bleu-rte-bold: #00a6d9; + --chart-bleu-digital: #d8ebff; + --chart-bleu-digital-bold: #2b86ff; + --chart-marine: #e7edf7; + --chart-marine-bold: #3d70ad; + --chart-bleu-petrole: #deecef; + --chart-bleu-petrole-bold: #478093; + --chart-bleu-cyan: #d1f9fc; + --chart-bleu-cyan-bold: #0fb3cb; + --chart-vert: #c7fff4; + --chart-vert-bold: #04c8b1; + --chart-vert-indications: #e6f2a4; + --chart-vert-indications-bold: #bed942; + --chart-vert-digital: #d9ffec; + --chart-vert-digital-bold: #3cec96; + --chart-jaune: #faffc1; + --chart-jaune-bold: #ffe500; + --chart-jaune-ocre: #faefc7; + --chart-jaune-ocre-bold: #ebb53d; + --chart-jaune-indications: #fce7c9; + --chart-jaune-indications-bold: #f4922b; + --chart-saumon: #fde8e3; + --chart-saumon-bold: #ec775c; + --chart-rose-digital: #ffccd1; + --chart-rose-digital-bold: #f93a58; + --chart-fuschia: #ffe1e9; + --chart-fuschia-bold: #ff2c74; + --chart-rouge-indications: #ffe4e6; + --chart-rouge-indications-bold: #f14662; + --chart-greyscale: #ebebea; + --chart-greyscale-bold: #7f7e7e; + --chart-taupe: #e7e3e6; + --chart-taupe-bold: #8a7883; + --decorative-neutral: #ebebea; + --decorative-bleu-iceberg: #c7dbf0; + --decorative-vert-foret: #d7f4e6; + --decorative-violet: #e6def0; + --decorative-bleu-rte: #b9edfe; + --decorative-bleu-digital: #baddff; + --decorative-marine: #e7edf7; + --decorative-bleu-petrole: #c1dae0; + --decorative-bleu-cyan: #a9f2f8; + --decorative-vert: #90ffe8; + --decorative-vert-indications: #e6f2a4; + --decorative-vert-digital: #b5fdd9; + --decorative-jaune: #faffc1; + --decorative-jaune-ocre: #f5de93; + --decorative-jaune-indications: #f9ce8e; + --decorative-saumon: #f9b7a8; + --decorative-rose-digital: #ffccd1; + --decorative-fuschia: #ffc8d8; + --decorative-rouge-indication: #ffe4e6; + --decorative-taupe: #e7e3e6; + --elevation-surface-inner-shadow: rgba(0, 0, 0, 0.2); + --elevation-surface-shadow-1: rgba(255, 255, 255, 0.03); + --elevation-surface-shadow-2: rgba(255, 255, 255, 0.05); + --elevation-surface-shadow-3: rgba(255, 255, 255, 0.08); + --elevation-surface-shadow-4: rgba(255, 255, 255, 0.1); + --elevation-surface-shadow-5: rgba(255, 255, 255, 0.12); + --elevation-surface-shadow-6: rgba(255, 255, 255, 0.14); + --elevation-shadow-ambient: rgba(0, 0, 0, 0.2); + --elevation-shadow-ambient-darker: rgba(0, 0, 0, 0.4); + --elevation-shadow-ambient-brand: rgba(0, 0, 0, 0.17); + --elevation-shadow-key: rgba(0, 0, 0, 0.28); + --elevation-shadow-key-darker: rgba(0, 0, 0, 0.48); + --elevation-shadow-key-brand: rgba(0, 0, 0, 0.21); + --brand-navigation-divider-5: #214770; + --brand-navigation-divider-6: #214770; + --brand-navigation-divider-7: #214770; + --background-brand-hover-opacity-20: rgba(199, 219, 240, 0.2); + --background-danger-hover-opacity-20: rgba(241, 70, 98, 0.2); + --background-hover-opacity-50: rgba(62, 62, 61, 0.5) +} + +[data-theme=violet][data-mode=light] { + --background-default: #ffffff; + --background-hover: #ebebea; + --background-neutral-regular-default: #e1e1e0; + --background-neutral-regular-hover: #c2c1c0; + --background-neutral-bold-default: #737272; + --background-neutral-bold-hover: #4c4c4b; + --background-neutral-navigation-default: #ebebea; + --background-neutral-navigation-hover: #e1e1e0; + --background-disabled: #f4f5f4; + --background-inverse: #201f1f; + --background-brand-default: #7d5a9f; + --background-brand-hover: #674883; + --background-brand-pressed: #563c6c; + --background-brand-selected-default: #7d5a9f; + --background-brand-selected-hover: #674883; + --background-brand-unselected-default: #f3eff8; + --background-brand-unselected-hover: #e6def0; + --background-brand-inverse-default: #ffffff; + --background-brand-inverse-hover: #f9f7fc; + --background-brand-inverse-pressed: #f3eff8; + --background-brand-navigation-default: #2b1a38; + --background-brand-navigation-hover: #4a355a; + --background-brand-navigation-pressed: #674883; + --background-danger-default: #de2048; + --background-danger-hover: #c81640; + --background-danger-pressed: #9d1439; + --background-info-default: #1465fc; + --background-warning-default: #ffe500; + --background-success-default: #0b8a4d; + --border-primary: #737272; + --border-secondary: #a1a1a0; + --border-tertiary: #cdcccb; + --border-divider: #cdcccb; + --border-disabled: #cdcccb; + --border-inverse: #ffffff; + --border-brand-default: #7d5a9f; + --border-brand-focused: #4a355a; + --border-brand-navigation-active: #674883; + --border-brand-navigation-divider: #563c6c; + --border-danger: #de2048; + --border-info: #1465fc; + --border-warning: #f4922b; + --border-success: #0b8a4d; + --content-primary: #201f1f; + --content-secondary: #3e3e3d; + --content-tertiary: #737272; + --content-primary-inverse: #ffffff; + --content-disabled: #cdcccb; + --content-brand-default: #7d5a9f; + --content-brand-hover: #674883; + --content-brand-pressed: #563c6c; + --content-brand-navigation-default: #f3eff8; + --content-brand-navigation-hover: #f9f7fc; + --content-brand-navigation-disabled: #674883; + --content-link-default: #2b86ff; + --content-link-hover: #1465fc; + --content-link-pressed: #0d4fea; + --content-link-visited-default: #7d5a9f; + --content-link-visited-hover: #674883; + --content-link-visited-pressed: #563c6c; + --content-danger-default: #de2048; + --content-danger-hover: #c81640; + --content-danger-inverse: #ffffff; + --content-success-default: #0b8a4d; + --content-success-hover: #0e6d40; + --content-info-default: #1465fc; + --content-info-hover: #0d4fea; + --content-decorative: #201f1f; + --brand-navigation-divider: #563c6c; + --brand-navigation-divider-2: #563c6c; + --brand-navigation-divider-3: #563c6c; + --brand-navigation-divider-4: #563c6c; + --chart-brand: #7d5a9f; + --chart-neutral: #acacab; + --chart-category-1: #397ebe; + --chart-category-2: #ff2c74; + --chart-category-3: #7d5a9f; + --chart-category-4: #2a9f7d; + --chart-category-5: #233857; + --chart-category-6: #ed6e13; + --chart-category-7: #73636c; + --chart-category-8: #639cad; + --chart-bleu-iceberg: #e6eef8; + --chart-bleu-iceberg-bold: #397ebe; + --chart-vert-foret: #d7f4e6; + --chart-vert-foret-bold: #4dba97; + --chart-violet: #d2c3e4; + --chart-violet-bold: #7d5a9f; + --chart-bleu-rte: #e0f5fe; + --chart-bleu-rte-bold: #00a6d9; + --chart-bleu-digital: #d8ebff; + --chart-bleu-digital-bold: #2b86ff; + --chart-marine: #e7edf7; + --chart-marine-bold: #3d70ad; + --chart-bleu-petrole: #deecef; + --chart-bleu-petrole-bold: #478093; + --chart-bleu-cyan: #d1f9fc; + --chart-bleu-cyan-bold: #0fb3cb; + --chart-vert: #c7fff4; + --chart-vert-bold: #04c8b1; + --chart-vert-indications: #e6f2a4; + --chart-vert-indications-bold: #bed942; + --chart-vert-digital: #d9ffec; + --chart-vert-digital-bold: #3cec96; + --chart-jaune: #faffc1; + --chart-jaune-bold: #ffe500; + --chart-jaune-ocre: #faefc7; + --chart-jaune-ocre-bold: #ebb53d; + --chart-jaune-indications: #fce7c9; + --chart-jaune-indications-bold: #f4922b; + --chart-saumon: #fde8e3; + --chart-saumon-bold: #ec775c; + --chart-rose-digital: #ffccd1; + --chart-rose-digital-bold: #f93a58; + --chart-fuschia: #ffe1e9; + --chart-fuschia-bold: #ff2c74; + --chart-rouge-indications: #ffe4e6; + --chart-rouge-indications-bold: #f14662; + --chart-greyscale: #ebebea; + --chart-greyscale-bold: #7f7e7e; + --chart-taupe: #e7e3e6; + --chart-taupe-bold: #8a7883; + --decorative-neutral: #ebebea; + --decorative-bleu-iceberg: #c7dbf0; + --decorative-vert-foret: #d7f4e6; + --decorative-violet: #e6def0; + --decorative-bleu-rte: #b9edfe; + --decorative-bleu-digital: #baddff; + --decorative-marine: #e7edf7; + --decorative-bleu-petrole: #c1dae0; + --decorative-bleu-cyan: #a9f2f8; + --decorative-vert: #90ffe8; + --decorative-vert-indications: #e6f2a4; + --decorative-vert-digital: #b5fdd9; + --decorative-jaune: #faffc1; + --decorative-jaune-ocre: #f5de93; + --decorative-jaune-indications: #f9ce8e; + --decorative-saumon: #f9b7a8; + --decorative-rose-digital: #ffccd1; + --decorative-fuschia: #ffc8d8; + --decorative-rouge-indication: #ffe4e6; + --decorative-taupe: #e7e3e6; + --elevation-surface-inner-shadow: rgba(0, 0, 0, 0); + --elevation-surface-shadow-1: rgba(255, 255, 255, 0); + --elevation-surface-shadow-2: rgba(255, 255, 255, 0); + --elevation-surface-shadow-3: rgba(255, 255, 255, 0); + --elevation-surface-shadow-4: rgba(255, 255, 255, 0); + --elevation-surface-shadow-5: rgba(255, 255, 255, 0); + --elevation-surface-shadow-6: rgba(255, 255, 255, 0); + --elevation-shadow-ambient: rgba(0, 0, 0, 0.12); + --elevation-shadow-ambient-darker: rgba(0, 0, 0, 0.2); + --elevation-shadow-ambient-brand: rgba(0, 0, 0, 0.25); + --elevation-shadow-key: rgba(0, 0, 0, 0.14); + --elevation-shadow-key-darker: rgba(0, 0, 0, 0.24); + --elevation-shadow-key-brand: rgba(0, 0, 0, 0.31); + --brand-navigation-divider-5: #563c6c; + --brand-navigation-divider-6: #563c6c; + --brand-navigation-divider-7: #563c6c; + --background-brand-hover-opacity-20: rgba(103, 72, 131, 0.2); + --background-danger-hover-opacity-20: rgba(200, 22, 64, 0.2); + --background-hover-opacity-50: rgba(235, 235, 234, 0.5) +} + +[data-theme=violet][data-mode=dark] { + --background-default: #201f1f; + --background-hover: #3e3e3d; + --background-neutral-regular-default: #595958; + --background-neutral-regular-hover: #7f7e7e; + --background-neutral-bold-default: #cdcccb; + --background-neutral-bold-hover: #ebebea; + --background-neutral-navigation-default: #ebebea; + --background-neutral-navigation-hover: #e1e1e0; + --background-disabled: #3e3e3d; + --background-inverse: #ffffff; + --background-brand-default: #d2c3e4; + --background-brand-hover: #e6def0; + --background-brand-pressed: #f3eff8; + --background-brand-selected-default: #d2c3e4; + --background-brand-selected-hover: #e6def0; + --background-brand-unselected-default: #674883; + --background-brand-unselected-hover: #7d5a9f; + --background-brand-inverse-default: #201f1f; + --background-brand-inverse-hover: #674883; + --background-brand-inverse-pressed: #7d5a9f; + --background-brand-navigation-default: #2b1a38; + --background-brand-navigation-hover: #4a355a; + --background-brand-navigation-pressed: #674883; + --background-danger-default: #f14662; + --background-danger-hover: #f97385; + --background-danger-pressed: #fca5af; + --background-info-default: #53aaff; + --background-warning-default: #ffe500; + --background-success-default: #3cec96; + --border-primary: #a1a1a0; + --border-secondary: #737272; + --border-tertiary: #3e3e3d; + --border-divider: #a1a1a0; + --border-disabled: #595958; + --border-inverse: #201f1f; + --border-brand-default: #fcfbfd; + --border-brand-focused: #fcfbfd; + --border-brand-navigation-active: #674883; + --border-brand-navigation-divider: #563c6c; + --border-danger: #f14662; + --border-info: #53aaff; + --border-warning: #f4922b; + --border-success: #3cec96; + --content-primary: #ffffff; + --content-secondary: #e1e1e0; + --content-tertiary: #b7b7b6; + --content-primary-inverse: #201f1f; + --content-disabled: #595958; + --content-brand-default: #fcfbfd; + --content-brand-hover: #f9f7fc; + --content-brand-pressed: #f3eff8; + --content-brand-navigation-default: #f3eff8; + --content-brand-navigation-hover: #f9f7fc; + --content-brand-navigation-disabled: #674883; + --content-link-default: #2b86ff; + --content-link-hover: #53aaff; + --content-link-pressed: #8ac8ff; + --content-link-visited-default: #9979bc; + --content-link-visited-hover: #b89fd3; + --content-link-visited-pressed: #d2c3e4; + --content-danger-default: #f14662; + --content-danger-hover: #f97385; + --content-danger-inverse: #ffffff; + --content-success-default: #3cec96; + --content-success-hover: #12d577; + --content-info-default: #53aaff; + --content-info-hover: #2b86ff; + --content-decorative: #201f1f; + --brand-navigation-divider: #563c6c; + --brand-navigation-divider-2: #563c6c; + --brand-navigation-divider-3: #563c6c; + --brand-navigation-divider-4: #563c6c; + --chart-brand: #7d5a9f; + --chart-neutral: #acacab; + --chart-category-1: #397ebe; + --chart-category-2: #ff2c74; + --chart-category-3: #7d5a9f; + --chart-category-4: #2a9f7d; + --chart-category-5: #233857; + --chart-category-6: #ed6e13; + --chart-category-7: #73636c; + --chart-category-8: #639cad; + --chart-bleu-iceberg: #e6eef8; + --chart-bleu-iceberg-bold: #397ebe; + --chart-vert-foret: #d7f4e6; + --chart-vert-foret-bold: #4dba97; + --chart-violet: #d2c3e4; + --chart-violet-bold: #7d5a9f; + --chart-bleu-rte: #e0f5fe; + --chart-bleu-rte-bold: #00a6d9; + --chart-bleu-digital: #d8ebff; + --chart-bleu-digital-bold: #2b86ff; + --chart-marine: #e7edf7; + --chart-marine-bold: #3d70ad; + --chart-bleu-petrole: #deecef; + --chart-bleu-petrole-bold: #478093; + --chart-bleu-cyan: #d1f9fc; + --chart-bleu-cyan-bold: #0fb3cb; + --chart-vert: #c7fff4; + --chart-vert-bold: #04c8b1; + --chart-vert-indications: #e6f2a4; + --chart-vert-indications-bold: #bed942; + --chart-vert-digital: #d9ffec; + --chart-vert-digital-bold: #3cec96; + --chart-jaune: #faffc1; + --chart-jaune-bold: #ffe500; + --chart-jaune-ocre: #faefc7; + --chart-jaune-ocre-bold: #ebb53d; + --chart-jaune-indications: #fce7c9; + --chart-jaune-indications-bold: #f4922b; + --chart-saumon: #fde8e3; + --chart-saumon-bold: #ec775c; + --chart-rose-digital: #ffccd1; + --chart-rose-digital-bold: #f93a58; + --chart-fuschia: #ffe1e9; + --chart-fuschia-bold: #ff2c74; + --chart-rouge-indications: #ffe4e6; + --chart-rouge-indications-bold: #f14662; + --chart-greyscale: #ebebea; + --chart-greyscale-bold: #7f7e7e; + --chart-taupe: #e7e3e6; + --chart-taupe-bold: #8a7883; + --decorative-neutral: #ebebea; + --decorative-bleu-iceberg: #c7dbf0; + --decorative-vert-foret: #d7f4e6; + --decorative-violet: #e6def0; + --decorative-bleu-rte: #b9edfe; + --decorative-bleu-digital: #baddff; + --decorative-marine: #e7edf7; + --decorative-bleu-petrole: #c1dae0; + --decorative-bleu-cyan: #a9f2f8; + --decorative-vert: #90ffe8; + --decorative-vert-indications: #e6f2a4; + --decorative-vert-digital: #b5fdd9; + --decorative-jaune: #faffc1; + --decorative-jaune-ocre: #f5de93; + --decorative-jaune-indications: #f9ce8e; + --decorative-saumon: #f9b7a8; + --decorative-rose-digital: #ffccd1; + --decorative-fuschia: #ffc8d8; + --decorative-rouge-indication: #ffe4e6; + --decorative-taupe: #e7e3e6; + --elevation-surface-inner-shadow: rgba(0, 0, 0, 0.2); + --elevation-surface-shadow-1: rgba(255, 255, 255, 0.03); + --elevation-surface-shadow-2: rgba(255, 255, 255, 0.05); + --elevation-surface-shadow-3: rgba(255, 255, 255, 0.08); + --elevation-surface-shadow-4: rgba(255, 255, 255, 0.1); + --elevation-surface-shadow-5: rgba(255, 255, 255, 0.12); + --elevation-surface-shadow-6: rgba(255, 255, 255, 0.14); + --elevation-shadow-ambient: rgba(0, 0, 0, 0.2); + --elevation-shadow-ambient-darker: rgba(0, 0, 0, 0.4); + --elevation-shadow-ambient-brand: rgba(0, 0, 0, 0.17); + --elevation-shadow-key: rgba(0, 0, 0, 0.28); + --elevation-shadow-key-darker: rgba(0, 0, 0, 0.48); + --elevation-shadow-key-brand: rgba(0, 0, 0, 0.21); + --brand-navigation-divider-5: #563c6c; + --brand-navigation-divider-6: #563c6c; + --brand-navigation-divider-7: #563c6c; + --background-brand-hover-opacity-20: rgba(230, 222, 240, 0.2); + --background-danger-hover-opacity-20: rgba(241, 70, 98, 0.2); + --background-hover-opacity-50: rgba(62, 62, 61, 0.5) +} + +[data-theme=vert_foret][data-mode=light] { + --background-default: #ffffff; + --background-hover: #ebebea; + --background-neutral-regular-default: #e1e1e0; + --background-neutral-regular-hover: #c2c1c0; + --background-neutral-bold-default: #737272; + --background-neutral-bold-hover: #4c4c4b; + --background-neutral-navigation-default: #ebebea; + --background-neutral-navigation-hover: #e1e1e0; + --background-disabled: #f4f5f4; + --background-inverse: #201f1f; + --background-brand-default: #1b8065; + --background-brand-hover: #176b57; + --background-brand-pressed: #145143; + --background-brand-selected-default: #1b8065; + --background-brand-selected-hover: #176b57; + --background-brand-unselected-default: #d7f4e6; + --background-brand-unselected-hover: #b3e7d1; + --background-brand-inverse-default: #ffffff; + --background-brand-inverse-hover: #effaf6; + --background-brand-inverse-pressed: #d7f4e6; + --background-brand-navigation-default: #082620; + --background-brand-navigation-hover: #114338; + --background-brand-navigation-pressed: #176b57; + --background-danger-default: #de2048; + --background-danger-hover: #c81640; + --background-danger-pressed: #9d1439; + --background-info-default: #1465fc; + --background-warning-default: #ffe500; + --background-success-default: #0b8a4d; + --border-primary: #737272; + --border-secondary: #a1a1a0; + --border-tertiary: #cdcccb; + --border-divider: #cdcccb; + --border-disabled: #cdcccb; + --border-inverse: #ffffff; + --border-brand-default: #1b8065; + --border-brand-focused: #114338; + --border-brand-navigation-active: #176b57; + --border-brand-navigation-divider: #145143; + --border-danger: #de2048; + --border-info: #1465fc; + --border-warning: #f4922b; + --border-success: #0b8a4d; + --content-primary: #201f1f; + --content-secondary: #3e3e3d; + --content-tertiary: #737272; + --content-primary-inverse: #ffffff; + --content-disabled: #cdcccb; + --content-brand-default: #1b8065; + --content-brand-hover: #176b57; + --content-brand-pressed: #145143; + --content-brand-navigation-default: #d7f4e6; + --content-brand-navigation-hover: #effaf6; + --content-brand-navigation-disabled: #176b57; + --content-link-default: #2b86ff; + --content-link-hover: #1465fc; + --content-link-pressed: #0d4fea; + --content-link-visited-default: #7d5a9f; + --content-link-visited-hover: #674883; + --content-link-visited-pressed: #563c6c; + --content-danger-default: #de2048; + --content-danger-hover: #c81640; + --content-danger-inverse: #ffffff; + --content-success-default: #0b8a4d; + --content-success-hover: #0e6d40; + --content-info-default: #1465fc; + --content-info-hover: #0d4fea; + --content-decorative: #201f1f; + --brand-navigation-divider: #145143; + --brand-navigation-divider-2: #145143; + --brand-navigation-divider-3: #145143; + --brand-navigation-divider-4: #145143; + --chart-brand: #2a9f7d; + --chart-neutral: #acacab; + --chart-category-1: #397ebe; + --chart-category-2: #ff2c74; + --chart-category-3: #7d5a9f; + --chart-category-4: #2a9f7d; + --chart-category-5: #233857; + --chart-category-6: #ed6e13; + --chart-category-7: #73636c; + --chart-category-8: #639cad; + --chart-bleu-iceberg: #e6eef8; + --chart-bleu-iceberg-bold: #397ebe; + --chart-vert-foret: #d7f4e6; + --chart-vert-foret-bold: #4dba97; + --chart-violet: #d2c3e4; + --chart-violet-bold: #7d5a9f; + --chart-bleu-rte: #e0f5fe; + --chart-bleu-rte-bold: #00a6d9; + --chart-bleu-digital: #d8ebff; + --chart-bleu-digital-bold: #2b86ff; + --chart-marine: #e7edf7; + --chart-marine-bold: #3d70ad; + --chart-bleu-petrole: #deecef; + --chart-bleu-petrole-bold: #478093; + --chart-bleu-cyan: #d1f9fc; + --chart-bleu-cyan-bold: #0fb3cb; + --chart-vert: #c7fff4; + --chart-vert-bold: #04c8b1; + --chart-vert-indications: #e6f2a4; + --chart-vert-indications-bold: #bed942; + --chart-vert-digital: #d9ffec; + --chart-vert-digital-bold: #3cec96; + --chart-jaune: #faffc1; + --chart-jaune-bold: #ffe500; + --chart-jaune-ocre: #faefc7; + --chart-jaune-ocre-bold: #ebb53d; + --chart-jaune-indications: #fce7c9; + --chart-jaune-indications-bold: #f4922b; + --chart-saumon: #fde8e3; + --chart-saumon-bold: #ec775c; + --chart-rose-digital: #ffccd1; + --chart-rose-digital-bold: #f93a58; + --chart-fuschia: #ffe1e9; + --chart-fuschia-bold: #ff2c74; + --chart-rouge-indications: #ffe4e6; + --chart-rouge-indications-bold: #f14662; + --chart-greyscale: #ebebea; + --chart-greyscale-bold: #7f7e7e; + --chart-taupe: #e7e3e6; + --chart-taupe-bold: #8a7883; + --decorative-neutral: #ebebea; + --decorative-bleu-iceberg: #c7dbf0; + --decorative-vert-foret: #d7f4e6; + --decorative-violet: #e6def0; + --decorative-bleu-rte: #b9edfe; + --decorative-bleu-digital: #baddff; + --decorative-marine: #e7edf7; + --decorative-bleu-petrole: #c1dae0; + --decorative-bleu-cyan: #a9f2f8; + --decorative-vert: #90ffe8; + --decorative-vert-indications: #e6f2a4; + --decorative-vert-digital: #b5fdd9; + --decorative-jaune: #faffc1; + --decorative-jaune-ocre: #f5de93; + --decorative-jaune-indications: #f9ce8e; + --decorative-saumon: #f9b7a8; + --decorative-rose-digital: #ffccd1; + --decorative-fuschia: #ffc8d8; + --decorative-rouge-indication: #ffe4e6; + --decorative-taupe: #e7e3e6; + --elevation-surface-inner-shadow: rgba(0, 0, 0, 0); + --elevation-surface-shadow-1: rgba(255, 255, 255, 0); + --elevation-surface-shadow-2: rgba(255, 255, 255, 0); + --elevation-surface-shadow-3: rgba(255, 255, 255, 0); + --elevation-surface-shadow-4: rgba(255, 255, 255, 0); + --elevation-surface-shadow-5: rgba(255, 255, 255, 0); + --elevation-surface-shadow-6: rgba(255, 255, 255, 0); + --elevation-shadow-ambient: rgba(0, 0, 0, 0.12); + --elevation-shadow-ambient-darker: rgba(0, 0, 0, 0.2); + --elevation-shadow-ambient-brand: rgba(0, 0, 0, 0.25); + --elevation-shadow-key: rgba(0, 0, 0, 0.14); + --elevation-shadow-key-darker: rgba(0, 0, 0, 0.24); + --elevation-shadow-key-brand: rgba(0, 0, 0, 0.31); + --brand-navigation-divider-5: #145143; + --brand-navigation-divider-6: #145143; + --brand-navigation-divider-7: #145143; + --background-brand-hover-opacity-20: rgba(23, 107, 87, 0.2); + --background-danger-hover-opacity-20: rgba(200, 22, 64, 0.2); + --background-hover-opacity-50: rgba(235, 235, 234, 0.5) +} + +[data-theme=vert_foret][data-mode=dark] { + --background-default: #201f1f; + --background-hover: #3e3e3d; + --background-neutral-regular-default: #595958; + --background-neutral-regular-hover: #7f7e7e; + --background-neutral-bold-default: #cdcccb; + --background-neutral-bold-hover: #ebebea; + --background-neutral-navigation-default: #ebebea; + --background-neutral-navigation-hover: #e1e1e0; + --background-disabled: #3e3e3d; + --background-inverse: #ffffff; + --background-brand-default: #81d4b7; + --background-brand-hover: #b3e7d1; + --background-brand-pressed: #d7f4e6; + --background-brand-selected-default: #81d4b7; + --background-brand-selected-hover: #b3e7d1; + --background-brand-unselected-default: #176b57; + --background-brand-unselected-hover: #1b8065; + --background-brand-inverse-default: #201f1f; + --background-brand-inverse-hover: #176b57; + --background-brand-inverse-pressed: #1b8065; + --background-brand-navigation-default: #082620; + --background-brand-navigation-hover: #114338; + --background-brand-navigation-pressed: #176b57; + --background-danger-default: #f14662; + --background-danger-hover: #f97385; + --background-danger-pressed: #fca5af; + --background-info-default: #53aaff; + --background-warning-default: #ffe500; + --background-success-default: #3cec96; + --border-primary: #a1a1a0; + --border-secondary: #737272; + --border-tertiary: #3e3e3d; + --border-divider: #a1a1a0; + --border-disabled: #595958; + --border-inverse: #201f1f; + --border-brand-default: #f5fcfa; + --border-brand-focused: #f5fcfa; + --border-brand-navigation-active: #176b57; + --border-brand-navigation-divider: #145143; + --border-danger: #f14662; + --border-info: #53aaff; + --border-warning: #f4922b; + --border-success: #3cec96; + --content-primary: #ffffff; + --content-secondary: #e1e1e0; + --content-tertiary: #b7b7b6; + --content-primary-inverse: #201f1f; + --content-disabled: #595958; + --content-brand-default: #f5fcfa; + --content-brand-hover: #effaf6; + --content-brand-pressed: #d7f4e6; + --content-brand-navigation-default: #d7f4e6; + --content-brand-navigation-hover: #effaf6; + --content-brand-navigation-disabled: #176b57; + --content-link-default: #2b86ff; + --content-link-hover: #53aaff; + --content-link-pressed: #8ac8ff; + --content-link-visited-default: #9979bc; + --content-link-visited-hover: #b89fd3; + --content-link-visited-pressed: #d2c3e4; + --content-danger-default: #f14662; + --content-danger-hover: #f97385; + --content-danger-inverse: #ffffff; + --content-success-default: #3cec96; + --content-success-hover: #12d577; + --content-info-default: #53aaff; + --content-info-hover: #2b86ff; + --content-decorative: #201f1f; + --brand-navigation-divider: #145143; + --brand-navigation-divider-2: #145143; + --brand-navigation-divider-3: #145143; + --brand-navigation-divider-4: #145143; + --chart-brand: #2a9f7d; + --chart-neutral: #acacab; + --chart-category-1: #397ebe; + --chart-category-2: #ff2c74; + --chart-category-3: #7d5a9f; + --chart-category-4: #2a9f7d; + --chart-category-5: #233857; + --chart-category-6: #ed6e13; + --chart-category-7: #73636c; + --chart-category-8: #639cad; + --chart-bleu-iceberg: #e6eef8; + --chart-bleu-iceberg-bold: #397ebe; + --chart-vert-foret: #d7f4e6; + --chart-vert-foret-bold: #4dba97; + --chart-violet: #d2c3e4; + --chart-violet-bold: #7d5a9f; + --chart-bleu-rte: #e0f5fe; + --chart-bleu-rte-bold: #00a6d9; + --chart-bleu-digital: #d8ebff; + --chart-bleu-digital-bold: #2b86ff; + --chart-marine: #e7edf7; + --chart-marine-bold: #3d70ad; + --chart-bleu-petrole: #deecef; + --chart-bleu-petrole-bold: #478093; + --chart-bleu-cyan: #d1f9fc; + --chart-bleu-cyan-bold: #0fb3cb; + --chart-vert: #c7fff4; + --chart-vert-bold: #04c8b1; + --chart-vert-indications: #e6f2a4; + --chart-vert-indications-bold: #bed942; + --chart-vert-digital: #d9ffec; + --chart-vert-digital-bold: #3cec96; + --chart-jaune: #faffc1; + --chart-jaune-bold: #ffe500; + --chart-jaune-ocre: #faefc7; + --chart-jaune-ocre-bold: #ebb53d; + --chart-jaune-indications: #fce7c9; + --chart-jaune-indications-bold: #f4922b; + --chart-saumon: #fde8e3; + --chart-saumon-bold: #ec775c; + --chart-rose-digital: #ffccd1; + --chart-rose-digital-bold: #f93a58; + --chart-fuschia: #ffe1e9; + --chart-fuschia-bold: #ff2c74; + --chart-rouge-indications: #ffe4e6; + --chart-rouge-indications-bold: #f14662; + --chart-greyscale: #ebebea; + --chart-greyscale-bold: #7f7e7e; + --chart-taupe: #e7e3e6; + --chart-taupe-bold: #8a7883; + --decorative-neutral: #ebebea; + --decorative-bleu-iceberg: #c7dbf0; + --decorative-vert-foret: #d7f4e6; + --decorative-violet: #e6def0; + --decorative-bleu-rte: #b9edfe; + --decorative-bleu-digital: #baddff; + --decorative-marine: #e7edf7; + --decorative-bleu-petrole: #c1dae0; + --decorative-bleu-cyan: #a9f2f8; + --decorative-vert: #90ffe8; + --decorative-vert-indications: #e6f2a4; + --decorative-vert-digital: #b5fdd9; + --decorative-jaune: #faffc1; + --decorative-jaune-ocre: #f5de93; + --decorative-jaune-indications: #f9ce8e; + --decorative-saumon: #f9b7a8; + --decorative-rose-digital: #ffccd1; + --decorative-fuschia: #ffc8d8; + --decorative-rouge-indication: #ffe4e6; + --decorative-taupe: #e7e3e6; + --elevation-surface-inner-shadow: rgba(0, 0, 0, 0.2); + --elevation-surface-shadow-1: rgba(255, 255, 255, 0.03); + --elevation-surface-shadow-2: rgba(255, 255, 255, 0.05); + --elevation-surface-shadow-3: rgba(255, 255, 255, 0.08); + --elevation-surface-shadow-4: rgba(255, 255, 255, 0.1); + --elevation-surface-shadow-5: rgba(255, 255, 255, 0.12); + --elevation-surface-shadow-6: rgba(255, 255, 255, 0.14); + --elevation-shadow-ambient: rgba(0, 0, 0, 0.2); + --elevation-shadow-ambient-darker: rgba(0, 0, 0, 0.4); + --elevation-shadow-ambient-brand: rgba(0, 0, 0, 0.17); + --elevation-shadow-key: rgba(0, 0, 0, 0.28); + --elevation-shadow-key-darker: rgba(0, 0, 0, 0.48); + --elevation-shadow-key-brand: rgba(0, 0, 0, 0.21); + --brand-navigation-divider-5: #145143; + --brand-navigation-divider-6: #145143; + --brand-navigation-divider-7: #145143; + --background-brand-hover-opacity-20: rgba(179, 231, 209, 0.2); + --background-danger-hover-opacity-20: rgba(241, 70, 98, 0.2); + --background-hover-opacity-50: rgba(62, 62, 61, 0.5) +} + diff --git a/src/index.jsx b/src/index.jsx index 3715d9adee..ceddcf8cb8 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -14,6 +14,8 @@ import { createRoot } from 'react-dom/client'; import '@xyflow/react/dist/base.css'; import './index.css'; +import "@design-system-rte/react/dist/style.css"; + import AppWrapper from './components/app-wrapper'; const container = document.getElementById('root'); diff --git a/src/utils/dialogs.tsx b/src/utils/dialogs.tsx index b38b6ff4f3..3c19ac2b98 100644 --- a/src/utils/dialogs.tsx +++ b/src/utils/dialogs.tsx @@ -5,9 +5,8 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ -import { Button, Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material'; -import { FormattedMessage } from 'react-intl'; -import { CancelButton, type SxStyle } from '@gridsuite/commons-ui'; +import { Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material'; +import { CancelButton, ValidateButton, type SxStyle } from '@gridsuite/commons-ui'; import { ReactElement, useCallback } from 'react'; interface SelectOptionsDialogProps { @@ -51,9 +50,7 @@ const SelectOptionsDialog = ({ {child} - + ); diff --git a/vite.config.ts b/vite.config.ts index a5a2fce97b..bd05817591 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -10,6 +10,7 @@ import { CommonServerOptions, defineConfig } from 'vite'; import checker from 'vite-plugin-checker'; import svgr from 'vite-plugin-svgr'; import tsconfigPaths from 'vite-tsconfig-paths'; +import path from 'node:path'; const serverSettings: CommonServerOptions = { port: 3004, @@ -29,30 +30,6 @@ const serverSettings: CommonServerOptions = { export default defineConfig((_config) => ({ plugins: [ react(), - checker({ - // TypeScript checking - typescript: true, - - // ESLint checking - eslint: { - useFlatConfig: true, - lintCommand: 'eslint . --max-warnings 0', - dev: { - logLevel: ['error', 'warning'], - }, - watchPath: './src', - }, - - overlay: false, // Disable overlay in browser - - // Show errors in terminal - terminal: true, - - // Disable during build because vite-plugin-checker runs checks in a parallel worker, - // which doesn't block the build if linting or type checking fails. To ensure build - // failure on errors, we use the 'prebuild' script instead (runs before 'npm run build'). - enableBuild: false, - }), svgr(), // works on every import with the pattern "**/*.svg?react" tsconfigPaths(), // to resolve absolute path via tsconfig cf https://stackoverflow.com/a/68250175/5092999 ], @@ -62,4 +39,9 @@ export default defineConfig((_config) => ({ build: { outDir: 'build', }, + resolve: { + alias: { + '@gridsuite/commons-ui': path.resolve(__dirname, '../commons-ui/src'), + }, + }, }));