diff --git a/src/front/Assets/logo.svg b/src/front/Assets/logo.svg deleted file mode 100644 index 8269f65f..00000000 --- a/src/front/Assets/logo.svg +++ /dev/null @@ -1,34 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/src/front/Assets/logo_small_blue.svg b/src/front/Assets/logo_small_blue.svg new file mode 100644 index 00000000..a52c0ab4 --- /dev/null +++ b/src/front/Assets/logo_small_blue.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/front/Assets/logo_small_neutral.svg b/src/front/Assets/logo_small_neutral.svg new file mode 100644 index 00000000..9935033b --- /dev/null +++ b/src/front/Assets/logo_small_neutral.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/front/Assets/logo_standard_blue.svg b/src/front/Assets/logo_standard_blue.svg new file mode 100644 index 00000000..2095bba7 --- /dev/null +++ b/src/front/Assets/logo_standard_blue.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/src/front/Assets/logo_standard_neutral.svg b/src/front/Assets/logo_standard_neutral.svg new file mode 100644 index 00000000..242b01dc --- /dev/null +++ b/src/front/Assets/logo_standard_neutral.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/src/front/Components/DesignSystem/BlockList/classes.module.scss b/src/front/Components/DesignSystem/BlockList/classes.module.scss index 879ad55d..a297cd3d 100644 --- a/src/front/Components/DesignSystem/BlockList/classes.module.scss +++ b/src/front/Components/DesignSystem/BlockList/classes.module.scss @@ -6,15 +6,15 @@ align-items: center; width: 100%; padding: 24px; - border: 1px solid $grey-medium; + border: 1px solid $color-neutral-200; cursor: pointer; &:hover { - background-color: $grey-medium; + background-color: $color-neutral-200; } &[data-selected="true"] { - background-color: $grey-medium; + background-color: $color-neutral-200; } .left-side { diff --git a/src/front/Components/DesignSystem/BlockList/index.tsx b/src/front/Components/DesignSystem/BlockList/index.tsx index ddf1cbb9..1d140528 100644 --- a/src/front/Components/DesignSystem/BlockList/index.tsx +++ b/src/front/Components/DesignSystem/BlockList/index.tsx @@ -32,7 +32,7 @@ export default function BlockList({ blocks, onSelectedBlock }: IProps) {
- {folder.name} + {folder.name}
{folder.hasFlag && } diff --git a/src/front/Components/DesignSystem/Button/classes.module.scss b/src/front/Components/DesignSystem/Button/classes.module.scss index bc86a437..dd3440d1 100644 --- a/src/front/Components/DesignSystem/Button/classes.module.scss +++ b/src/front/Components/DesignSystem/Button/classes.module.scss @@ -23,51 +23,51 @@ } &[variant="primary"] { - color: $white; - background-color: $purple-flash; - border-color: $purple-flash; + color: $color-generic-white; + background-color: $color-primary-500; + border-color: $color-primary-500; padding: 24px 48px; font-weight: 400; font-size: 18px; line-height: 22px; &:hover { - border-color: $purple-hover; - background-color: $purple-hover; + border-color: $color-primary-700; + background-color: $color-primary-700; } &:disabled { - border-color: $purple-soft; - background-color: $purple-soft; + border-color: $color-primary-500-soft; + background-color: $color-primary-500-soft; pointer-events: none; } } &[variant="secondary"] { - color: $white; - background-color: $red-flash; - border-color: $red-flash; + color: $color-generic-white; + background-color: $color-error-600; + border-color: $color-error-600; padding: 24px 48px; font-weight: 400; font-size: 18px; line-height: 22px; &:hover { - border-color: $re-hover; - background-color: $re-hover; + border-color: $color-error-800; + background-color: $color-error-800; } &:disabled { - border-color: $red-soft; - background-color: $red-soft; + border-color: $color-error-600-soft; + background-color: $color-error-600-soft; pointer-events: none; } } &[variant="ghost"] { - color: $pink-flash; + color: $color-secondary-500; background-color: transparent; - border-color: $pink-flash; + border-color: $color-secondary-500; padding: 24px 48px; font-weight: 400; font-size: 18px; @@ -75,26 +75,26 @@ svg { path { - stroke: $white; + stroke: $color-generic-white; } } &:hover { - border-color: $pink-hover; - color: $pink-hover; + border-color: $color-secondary-700; + color: $color-secondary-700; } &:disabled { - border-color: $pink-soft; - background-color: $pink-soft; + border-color: $color-secondary-500-soft; + background-color: $color-secondary-500-soft; pointer-events: none; } } &[variant="white"] { - color: $pink-flash; + color: $color-secondary-500; background-color: white; - border-color: $pink-flash; + border-color: $color-secondary-500; padding: 24px 48px; font-weight: 400; font-size: 18px; @@ -102,18 +102,18 @@ svg { path { - stroke: $white; + stroke: $color-generic-white; } } &:hover { - border-color: $pink-hover; - color: $pink-hover; + border-color: $color-secondary-700; + color: $color-secondary-700; } &:disabled { - border-color: $pink-soft; - background-color: $pink-soft; + border-color: $color-secondary-500-soft; + background-color: $color-secondary-500-soft; pointer-events: none; } } @@ -132,7 +132,7 @@ } &[variant="line"] { - color: $pink-flash; + color: $color-secondary-500; background-color: transparent; border-color: transparent; padding: 0; diff --git a/src/front/Components/DesignSystem/CheckBox/classes.module.scss b/src/front/Components/DesignSystem/CheckBox/classes.module.scss index 42530455..2eb130fb 100644 --- a/src/front/Components/DesignSystem/CheckBox/classes.module.scss +++ b/src/front/Components/DesignSystem/CheckBox/classes.module.scss @@ -13,7 +13,7 @@ background-color: transparent; width: 16px; height: 16px; - border: 1px solid $turquoise-flash; + border: 1px solid $color-secondary-500; border-radius: 2px; margin-right: 16px; display: grid; @@ -30,7 +30,7 @@ display: grid; width: 16px; height: 16px; - background-color: $turquoise-flash; + background-color: $color-secondary-500; border-radius: 2px; transform: scale(0); } diff --git a/src/front/Components/DesignSystem/CheckBox/index.tsx b/src/front/Components/DesignSystem/CheckBox/index.tsx index 3e7b30d6..f7d719c3 100644 --- a/src/front/Components/DesignSystem/CheckBox/index.tsx +++ b/src/front/Components/DesignSystem/CheckBox/index.tsx @@ -37,7 +37,7 @@ export default class CheckBox extends React.Component { public override render(): JSX.Element { return ( - +
- +
{ )} {this.props.document.document_status !== EDocumentStatus.VALIDATED && ( - + Sélectionnez des documents .jpg, .pdf ou .png )} @@ -157,7 +157,10 @@ export default class DepositDocument extends React.Component {
Document check - + {this.shortName(file.fileName || fileObj.name)}
@@ -177,7 +180,7 @@ export default class DepositDocument extends React.Component {
- + Chargement...
@@ -188,7 +191,10 @@ export default class DepositDocument extends React.Component { {this.props.document.document_status !== EDocumentStatus.VALIDATED && (
@@ -203,7 +209,7 @@ export default class DepositDocument extends React.Component { header={"Motif du refus"} confirmText={"J'ai compris"}>
- + Votre document a été refusé pour la raison suivante : @@ -211,14 +217,14 @@ export default class DepositDocument extends React.Component {
{this.props.document.document_status === EDocumentStatus.REFUSED && ( - + Ce document n'est pas conforme. Veuillez le déposer à nouveau. )} {this.state.showFailedUploaded && (
- + {this.state.showFailedUploaded}
@@ -262,26 +268,26 @@ export default class DepositDocument extends React.Component { switch (history.document_status) { case EDocumentStatus.ASKED: return ( - + Demandé par votre notaire le {this.formatDate(history.created_at!)} ); case EDocumentStatus.VALIDATED: return ( - + Validé par votre notaire le {this.formatDate(history.created_at!)} ); case EDocumentStatus.DEPOSITED: return ( - + Déposé le {this.formatDate(history.created_at!)} ); case EDocumentStatus.REFUSED: return ( - + Document non conforme {history.refused_reason && history.refused_reason.length > 0 && ( @@ -167,7 +173,7 @@ export default class DepositOtherDocument extends React.Component
- + {this.state.showFailedDocument}
@@ -176,7 +182,7 @@ export default class DepositOtherDocument extends React.Component
- + {this.state.showFailedUploaded}
diff --git a/src/front/Components/DesignSystem/DepositRib/classes.module.scss b/src/front/Components/DesignSystem/DepositRib/classes.module.scss index 9bba001b..dbbcbd00 100644 --- a/src/front/Components/DesignSystem/DepositRib/classes.module.scss +++ b/src/front/Components/DesignSystem/DepositRib/classes.module.scss @@ -1,19 +1,17 @@ .container { - - .root { padding: 24px; - background-color: var(--white); + background-color: var(--color-generic-white); border: 1px dashed #e7e7e7; height: fit-content; &[data-drag-over="true"] { - border: 1px dashed var(--grey); + border: 1px dashed var(--color-neutral-500); } &.validated { - border: 1px dashed var(--green-flash); + border: 1px dashed var(--color-success-600); } .top-container { @@ -34,12 +32,12 @@ margin-left: 18px; .validated { - color: var(--green-flash); + color: var(--color-success-600); } .refused-button { font-size: 14px; - color: var(--re-hover); + color: var(--color-error-800); margin-left: 8px; } @@ -102,7 +100,7 @@ } .error-message { - color: var(--red-flash); + color: var(--color-error-600); margin-top: 8px; } -} \ No newline at end of file +} diff --git a/src/front/Components/DesignSystem/DepositRib/index.tsx b/src/front/Components/DesignSystem/DepositRib/index.tsx index 99e147b9..034653c5 100644 --- a/src/front/Components/DesignSystem/DepositRib/index.tsx +++ b/src/front/Components/DesignSystem/DepositRib/index.tsx @@ -129,10 +129,10 @@ export default class DepositRib extends React.Component {
- +
Déposer un RIB
 - + Sélectionnez des documents .jpg, .pdf ou .png
@@ -144,7 +144,7 @@ export default class DepositRib extends React.Component {
Document check - + {this.shortName(file.name)}
@@ -161,7 +161,10 @@ export default class DepositRib extends React.Component {
diff --git a/src/front/Components/DesignSystem/Document/DocumentNotary/classes.module.scss b/src/front/Components/DesignSystem/Document/DocumentNotary/classes.module.scss index 3785a54e..c9b9fd5b 100644 --- a/src/front/Components/DesignSystem/Document/DocumentNotary/classes.module.scss +++ b/src/front/Components/DesignSystem/Document/DocumentNotary/classes.module.scss @@ -1,30 +1,30 @@ @import "@Themes/constants.scss"; .root { - border: 1px solid $grey-medium; + border: 1px solid $color-neutral-200; padding: 16px; display: flex; justify-content: space-between; align-items: center; &.DEPOSITED { cursor: pointer; - border: 1px solid $orange-soft; + border: 1px solid $color-warning-500-soft; &:hover { - border: 1px solid $orange-soft; - outline: 1px solid $orange-soft; + border: 1px solid $color-warning-500-soft; + outline: 1px solid $color-warning-500-soft; } } &.VALIDATED { cursor: pointer; - border: 1px solid $green-soft; + border: 1px solid $color-success-600-soft; &:hover { - border: 1px solid $green-soft; - outline: 1px solid $green-soft; + border: 1px solid $color-success-600-soft; + outline: 1px solid $color-success-600-soft; } } .valid-radius { - background-color: $green-flash; + background-color: color-success-600; padding: 6px; border-radius: 20px; } diff --git a/src/front/Components/DesignSystem/Document/DocumentNotary/index.tsx b/src/front/Components/DesignSystem/Document/DocumentNotary/index.tsx index 4e6e7c70..5db4bc46 100644 --- a/src/front/Components/DesignSystem/Document/DocumentNotary/index.tsx +++ b/src/front/Components/DesignSystem/Document/DocumentNotary/index.tsx @@ -41,8 +41,8 @@ class DocumentNotaryClass extends React.Component { return (
- {this.props.document?.document_type?.name} - {this.getDocumentsTitle()} + {this.props.document?.document_type?.name} + {this.getDocumentsTitle()}
{this.renderIcon()}
diff --git a/src/front/Components/DesignSystem/FilePreview/index.tsx b/src/front/Components/DesignSystem/FilePreview/index.tsx index 81046eff..9dfc749a 100644 --- a/src/front/Components/DesignSystem/FilePreview/index.tsx +++ b/src/front/Components/DesignSystem/FilePreview/index.tsx @@ -26,7 +26,7 @@ export default class FilePreview extends React.Component { {this.props.href && ( <> {!type && ( - + Erreur lors du chargement du fichier )} diff --git a/src/front/Components/DesignSystem/FolderArchivedListContainer/classes.module.scss b/src/front/Components/DesignSystem/FolderArchivedListContainer/classes.module.scss index 98e9d101..4ba15488 100644 --- a/src/front/Components/DesignSystem/FolderArchivedListContainer/classes.module.scss +++ b/src/front/Components/DesignSystem/FolderArchivedListContainer/classes.module.scss @@ -18,6 +18,6 @@ max-height: calc(100vh - 215px); height: calc(100vh - 215px); overflow: auto; - border-right: 1px solid var(--grey-medium); + border-right: 1px solid var(--color-neutral-200); } } diff --git a/src/front/Components/DesignSystem/FolderBoxInformation/classes.module.scss b/src/front/Components/DesignSystem/FolderBoxInformation/classes.module.scss index 0d828c7d..4e1fcd0a 100644 --- a/src/front/Components/DesignSystem/FolderBoxInformation/classes.module.scss +++ b/src/front/Components/DesignSystem/FolderBoxInformation/classes.module.scss @@ -1,7 +1,7 @@ @import "@Themes/constants.scss"; .root { - background-color: var(--grey-soft); + background-color: var(--color-neutral-50); padding: 24px; width: 100%; display: flex; diff --git a/src/front/Components/DesignSystem/FolderBoxInformation/index.tsx b/src/front/Components/DesignSystem/FolderBoxInformation/index.tsx index 7048b425..2d9df590 100644 --- a/src/front/Components/DesignSystem/FolderBoxInformation/index.tsx +++ b/src/front/Components/DesignSystem/FolderBoxInformation/index.tsx @@ -6,7 +6,7 @@ import Image from "next/image"; import Link from "next/link"; import React from "react"; -import Typography, { ITypo } from "../Typography"; +import Typography, { ITypo, ITypoColor } from "../Typography"; import classes from "./classes.module.scss"; import { AnchorStatus } from "@Front/Components/Layouts/Folder/FolderInformation"; import Note from "le-coffre-resources/dist/Customer/Note"; @@ -70,42 +70,56 @@ export default function FolderBoxInformation(props: IProps) { case EFolderBoxInformationType.DESCRIPTION: return (
- Note dossier - {folder.description ?? ""} + + Note dossier + + {folder.description ?? ""}
); case EFolderBoxInformationType.NOTE: return (
- Note client - {note?.content ?? ""} + + Note client + + {note?.content ?? ""}
); case EFolderBoxInformationType.ARCHIVED_DESCRIPTION: return (
- Note archive - {folder.archived_description ?? ""} + + Note archive + + {folder.archived_description ?? ""}
); case EFolderBoxInformationType.INFORMATIONS: return ( <>
- Intitulé du dossier - {folder.name ?? ""} + + Intitulé du dossier + + {folder.name ?? ""}
- Numéro de dossier - {folder.folder_number ?? ""} + + Numéro de dossier + + {folder.folder_number ?? ""}
- Type d'acte - {folder.deed?.deed_type?.name ?? ""} + + Type d'acte + + {folder.deed?.deed_type?.name ?? ""}
- Ouverture du dossier - {formatDate(folder.created_at)} + + Ouverture du dossier + + {formatDate(folder.created_at)}
); diff --git a/src/front/Components/DesignSystem/FolderContainer/classes.module.scss b/src/front/Components/DesignSystem/FolderContainer/classes.module.scss index 989c0eca..302d29e1 100644 --- a/src/front/Components/DesignSystem/FolderContainer/classes.module.scss +++ b/src/front/Components/DesignSystem/FolderContainer/classes.module.scss @@ -6,11 +6,11 @@ align-items: center; width: 100%; padding: 24px; - border: 1px solid $grey-medium; + border: 1px solid $color-neutral-200; cursor: pointer; &:hover { - background-color: $grey-medium; + background-color: $color-neutral-200; } .left-side { diff --git a/src/front/Components/DesignSystem/FolderContainer/index.tsx b/src/front/Components/DesignSystem/FolderContainer/index.tsx index b35a87d9..a3ac8f9e 100644 --- a/src/front/Components/DesignSystem/FolderContainer/index.tsx +++ b/src/front/Components/DesignSystem/FolderContainer/index.tsx @@ -24,7 +24,7 @@ export default class FolderContainer extends React.Component { return (
- + {this.props.folder.folder_number.concat(" - ").concat(this.props.folder.name)} {this.countPendingDocuments() > 0 && ( diff --git a/src/front/Components/DesignSystem/FolderList/classes.module.scss b/src/front/Components/DesignSystem/FolderList/classes.module.scss index d8013f29..b1bf1c69 100644 --- a/src/front/Components/DesignSystem/FolderList/classes.module.scss +++ b/src/front/Components/DesignSystem/FolderList/classes.module.scss @@ -4,11 +4,11 @@ height: calc(100vh - 290px); overflow-y: scroll; - &.archived{ + &.archived { height: calc(100vh - 220px); } .active { - background-color: var(--grey-medium); + background-color: var(--color-neutral-200); } -} \ No newline at end of file +} diff --git a/src/front/Components/DesignSystem/FolderListContainer/classes.module.scss b/src/front/Components/DesignSystem/FolderListContainer/classes.module.scss index d787f90f..deb6e813 100644 --- a/src/front/Components/DesignSystem/FolderListContainer/classes.module.scss +++ b/src/front/Components/DesignSystem/FolderListContainer/classes.module.scss @@ -18,6 +18,6 @@ max-height: calc(100vh - 290px); height: calc(100vh - 290px); overflow: auto; - border-right: 1px solid var(--grey-medium); + border-right: 1px solid var(--color-neutral-200); } } diff --git a/src/front/Components/DesignSystem/Form/BaseField.tsx b/src/front/Components/DesignSystem/Form/BaseField.tsx index 05afdf38..488ecc69 100644 --- a/src/front/Components/DesignSystem/Form/BaseField.tsx +++ b/src/front/Components/DesignSystem/Form/BaseField.tsx @@ -107,7 +107,7 @@ export default abstract class BaseField

{ errors.push( - + {value} , ); diff --git a/src/front/Components/DesignSystem/Form/DateField/classes.module.scss b/src/front/Components/DesignSystem/Form/DateField/classes.module.scss index 0fda11ae..bac68da9 100644 --- a/src/front/Components/DesignSystem/Form/DateField/classes.module.scss +++ b/src/front/Components/DesignSystem/Form/DateField/classes.module.scss @@ -12,7 +12,7 @@ gap: 10px; width: 100%; height: 70px; - border: 1px solid var(--grey-medium); + border: 1px solid var(--color-neutral-200); &:disabled { cursor: not-allowed; @@ -76,16 +76,16 @@ padding: 0 16px; pointer-events: none; position: absolute; - background: $white; + background: $color-generic-white; transition: transform 0.3s ease-in-out; } } &[data-is-errored="true"] { .input { - border: 1px solid var(--red-flash); + border: 1px solid var(--color-error-600); ~ .fake-placeholder { - color: var(--red-flash); + color: var(--color-error-600); } } } diff --git a/src/front/Components/DesignSystem/Form/DateField/index.tsx b/src/front/Components/DesignSystem/Form/DateField/index.tsx index 0c0e892a..47d60181 100644 --- a/src/front/Components/DesignSystem/Form/DateField/index.tsx +++ b/src/front/Components/DesignSystem/Form/DateField/index.tsx @@ -20,7 +20,7 @@ export default class DateField extends BaseField { public override render(): ReactNode { const value = this.state.value ?? ""; return ( - +

{ {selectedOption && ( <> {selectedOption?.icon} - + {selectedOption?.label} )} {!selectedOption && (
- + {this.props.placeholder ?? ""}
@@ -110,7 +110,7 @@ class SelectFieldClass extends React.Component { className={classes["container-li"]} onClick={(e) => this.onSelect(option, e)}>
{option.icon}
- {option.label} + {option.label} ))} @@ -199,7 +199,7 @@ class SelectFieldClass extends React.Component { private renderErrors(): JSX.Element | null { if (!this.state.errors) return null; return ( - + {this.props.placeholder} ne peut pas être vide ); diff --git a/src/front/Components/DesignSystem/Form/TextField/classes.module.scss b/src/front/Components/DesignSystem/Form/TextField/classes.module.scss index 0fda11ae..bac68da9 100644 --- a/src/front/Components/DesignSystem/Form/TextField/classes.module.scss +++ b/src/front/Components/DesignSystem/Form/TextField/classes.module.scss @@ -12,7 +12,7 @@ gap: 10px; width: 100%; height: 70px; - border: 1px solid var(--grey-medium); + border: 1px solid var(--color-neutral-200); &:disabled { cursor: not-allowed; @@ -76,16 +76,16 @@ padding: 0 16px; pointer-events: none; position: absolute; - background: $white; + background: $color-generic-white; transition: transform 0.3s ease-in-out; } } &[data-is-errored="true"] { .input { - border: 1px solid var(--red-flash); + border: 1px solid var(--color-error-600); ~ .fake-placeholder { - color: var(--red-flash); + color: var(--color-error-600); } } } diff --git a/src/front/Components/DesignSystem/Form/TextField/index.tsx b/src/front/Components/DesignSystem/Form/TextField/index.tsx index bb83fbf2..8e3e5d6d 100644 --- a/src/front/Components/DesignSystem/Form/TextField/index.tsx +++ b/src/front/Components/DesignSystem/Form/TextField/index.tsx @@ -21,7 +21,7 @@ export default class TextField extends BaseField { public override render(): ReactNode { const value = this.state.value ?? ""; return ( - +
{ public override render(): ReactNode { const value = this.state.value ?? ""; return ( - +