🔨 update modals

src/front/Components/DesignSystem/Modal/classes.module.scss

@@ -7,7 +7,7 @@
 	left: 0;
 	width: 100%;
 	height: 100%;
-	z-index: 3;
+	z-index: 5;
 
 	.content {
 		position: fixed;
@@ -54,7 +54,8 @@
 		left: 0;
 		width: 100%;
 		height: 100%;
-		background-color: rgba(0, 0, 0, 0.5);
+		opacity: 0.3;
+		background: var(--primary-default-deep, #013391);
 		overflow: hidden;
 	}
 }

src/front/Components/Layouts/Folder/AddClientToFolder/classes.module.scss

@@ -40,7 +40,7 @@
 
 			.cancel-button {
 				display: flex;
-				margin-right: 32px;
+				margin-right: var(--spacing-md, 16px);
 			}
 
 			@media (max-width: $screen-m) {

src/front/Components/Layouts/Folder/AskDocuments/ParameterDocuments/classes.module.scss

@@ -1,11 +1,12 @@
-.add-document-form-container {
+.root {
 	display: flex;
 	flex-direction: column;
-	gap: 24px;
+	gap: var(--spacing-md, 16px);
+	width: 566px;
 
 	.radiobox-container {
-		> :not(:last-child) {
-			margin-bottom: 16px;
-		}
+		display: flex;
+		flex-direction: column;
+		gap: var(--spacing-xs, 8px);
 	}
 }

src/front/Components/Layouts/Folder/AskDocuments/ParameterDocuments/index.tsx

@@ -4,6 +4,7 @@ import { IOption } from "@Front/Components/DesignSystem/Dropdown/DropdownMenu/Dr
 import AutocompleteMultiSelectField from "@Front/Components/DesignSystem/Form/AutocompleteMultiSelectField";
 import TextAreaField from "@Front/Components/DesignSystem/Form/TextareaField";
 import TextField from "@Front/Components/DesignSystem/Form/TextField";
+import Modal from "@Front/Components/DesignSystem/Modal";
 import Confirm from "@Front/Components/DesignSystem/OldModal/Confirm";
 import RadioBox from "@Front/Components/DesignSystem/RadioBox";
 import { DocumentType, OfficeFolder } from "le-coffre-resources/dist/Notary";
@@ -117,32 +118,32 @@ export default function ParameterDocuments(props: IProps) {
 	}, [getAvailableDocuments, props.folder]);
 
 	return (
-		<Confirm
+		<Modal
 			isOpen={props.isCreateDocumentModalVisible}
 			onClose={handleClose}
-			onAccept={addDocument}
-			closeBtn
-			header={"Ajouter des documents demandables"}
-			cancelText={"Annuler"}
-			confirmText={"Ajouter"}>
-			<div className={classes["add-document-form-container"]}>
+			firstButton={{ children: "Annuler", onClick: handleClose }}
+			secondButton={{ children: "Ajouter", onClick: addDocument }}
+			title={"Ajouter un document"}>
+			<div className={classes["root"]}>
 				<div className={classes["radiobox-container"]}>
-					<RadioBox
-						name="document"
-						onChange={selectEditMode}
-						checked={addOrEditDocument === "edit"}
-						value={"existing client"}
-						label="Document existant"
-					/>
+				<RadioBox
+					name="document"
+					onChange={selectEditMode}
+					checked={addOrEditDocument === "edit"}
+					value={"existing client"}
+					label="Document existant"
+				/>
 
-					<RadioBox
-						name="document"
-						onChange={selectAddMode}
-						checked={addOrEditDocument === "add"}
-						value={"new client"}
-						label="Créer un document"
-					/>
+				<RadioBox
+					name="document"
+					onChange={selectAddMode}
+					checked={addOrEditDocument === "add"}
+					value={"new client"}
+					label="Créer un document"
+				/>
 				</div>
+
+
 				{addOrEditDocument === "add" && (
 					<>
 						<TextField name="document_name" placeholder="Nom du document à ajouter" onChange={onDocumentNameChange} />
@@ -162,6 +163,6 @@ export default function ParameterDocuments(props: IProps) {
 					/>
 				)}
 			</div>
-		</Confirm>
+		</Modal>
 	);
 }

src/front/Components/Layouts/Folder/AskDocuments/classes.module.scss

@@ -33,7 +33,7 @@
 
 		.buttons-container {
 			display: flex;
-			gap: 32px;
+			gap: var(--spacing-md, 16px);
 			margin-top: 32px;
 
 			@media (max-width: $screen-s) {

src/front/Components/Layouts/Folder/AskDocuments/index.tsx

@@ -155,7 +155,7 @@ export default function AskDocuments() {
 						</div>
 						<div className={classes["add-document-container"]}>
 							<Button
-								rightIcon={<PlusIcon style={{ transform: "rotate(180deg)", width: "22px", height: "22px" }} />}
+								leftIcon={<PlusIcon style={{ transform: "rotate(180deg)", width: "22px", height: "22px" }} />}
 								variant={EButtonVariant.PRIMARY}
 								styletype={EButtonstyletype.OUTLINED}
 								size={EButtonSize.MD}
@@ -169,7 +169,7 @@ export default function AskDocuments() {
 									Annuler
 								</Button>
 							</a>
-							<Button type="submit">Valider</Button>
+							<Button type="submit">Envoyer la demande</Button>
 						</div>
 					</div>
 				</Form>

src/front/Components/Layouts/Folder/FolderInformation/ClientView/classes.module.scss

@@ -16,6 +16,16 @@ $mobile-breakpoint: 664px;
 		.tabs {
 			width: calc(100% - 210px);
 		}
+
+		border-bottom: 1px solid var(--tabs-stroke);
+
+		> :first-child {
+			margin-bottom: -1px;
+		}
+
+		> :last-child {
+			margin-bottom: -1px;
+		}
 	}
 
 	.content {