Merge branch 'dev' into feature/ora-lecoffr-420-file-component

src/front/Components/DesignSystem/UserFolder/index.tsx

@@ -73,7 +73,7 @@ export default class UserFolder extends React.Component<IProps, IState> {
 				{this.state.isOpen && (
 					<div className={classes["container"]} data-will-close={this.state.willClose.toString()} ref={this.rootRefElement}>
 						<QuantityProgressBar
-							title="Complétion du dossier"
+							title="Complétion du dossier client"
 							total={100}
 							currentNumber={this.calculateDocumentsPercentageProgress()}
 						/>

src/front/Components/LayoutTemplates/DefaultDoubleSidePage/classes.module.scss

@@ -13,19 +13,25 @@
 			max-height: 100vh;
 			overflow: auto;
 		}
+
 		.sides {
 			width: 50%;
+
 			@media (max-width: $screen-m) {
 				width: 100%;
 			}
+
 			&.image-container {
 				display: flex;
 				align-items: center;
 				justify-content: center;
+
 				@media (max-width: $screen-m) {
 					display: none;
 				}
+
 				background: var(--grey-soft);
+
 				.image {
 					width: 100%;
 					height: 100%;
@@ -38,6 +44,10 @@
 				align-items: center;
 				justify-content: center;
 
+				@media (max-width: $screen-m) {
+					display: none;
+				}
+
 				.background-image {
 					height: 100%;
 					width: 100%;

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

@@ -89,7 +89,7 @@ export default class CreateFolder extends BasePage<IProps, IState> {
 							<Select options={this.actsOptions} placeholder={"Type d’acte"} onChange={this.onActTypeChange} />
 							<InputField
 								name="personal_note"
-								fakeplaceholder="Note personnelle"
+								fakeplaceholder="Note du dossier"
 								textarea
 								onChange={this.onPersonalNoteChange}
 							/>

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

@@ -56,7 +56,7 @@ class FolderInformationClass extends BasePage<IPropsClass, IState> {
 									<FolderBoxInformation folder={this.state.selectedFolder} isDescription />
 								</div>
 								<div className={classes["progress-bar"]}>
-									<QuantityProgressBar title="Complétion du dossier client" total={100} currentNumber={0} />
+									<QuantityProgressBar title="Complétion du dossier" total={100} currentNumber={0} />
 								</div>
 								{this.doesFolderHaveCustomer() && <ClientSection folder={this.state.selectedFolder} />}
 							</div>

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

@@ -36,7 +36,7 @@ class UpdateFolderDescriptionClass extends BasePage<IProps, IState> {
 
 					<Form className={classes["form"]}>
 						<div className={classes["content"]}>
-							<InputField name="input field" fakeplaceholder="Intitulé du dossier" textarea />
+							<InputField name="input field" fakeplaceholder="Note du dossier" textarea />
 						</div>
 
 						<div className={classes["button-container"]}>

src/front/Components/Layouts/MyAccount/classes.module.scss

@@ -0,0 +1,27 @@
+@import "@Themes/constants.scss";
+
+.root {
+	.title {
+		margin-top: 24px;
+	}
+
+	.parts-container {
+		display: flex;
+		gap: 64px;
+		margin-top: 32px;
+
+		@media (max-width: $screen-m) {
+			flex-direction: column;
+		}
+		.part {
+			flex: 1;
+
+			.form-container {
+				display: flex;
+				flex-direction: column;
+				gap: 24px;
+				margin-top: 32px;
+			}
+		}
+	}
+}

src/front/Components/Layouts/MyAccount/index.tsx

@@ -0,0 +1,61 @@
+import Form, { IApiFormErrors } from "@Front/Components/DesignSystem/Form";
+import InputField from "@Front/Components/DesignSystem/Form/Elements/InputField";
+import Typography, { ITypo, ITypoColor } from "@Front/Components/DesignSystem/Typography";
+import Base from "@Front/Components/Layouts/Base";
+import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate";
+import React from "react";
+
+import classes from "./classes.module.scss";
+
+type IProps = {};
+type IState = {};
+
+export default class MyAccount extends Base<IProps, IState> {
+	public override render(): JSX.Element {
+		return (
+			<DefaultTemplate title={"Mon compte"}>
+				<div className={classes["root"]}>
+					<Typography typo={ITypo.H1} color={ITypoColor.BLACK} className={classes["title"]}>
+						Mon compte
+					</Typography>
+					<div className={classes["parts-container"]}>
+						<div className={classes["part"]}>
+							<Typography typo={ITypo.H2} color={ITypoColor.BLACK}>
+								Mes informations
+							</Typography>
+							<Form onSubmit={this.onFormSubmit}>
+								<div className={classes["form-container"]}>
+									<InputField name="name" fakeplaceholder="Nom" type="text" />
+									<InputField name="surname" fakeplaceholder="Prénom" type="text" />
+									<InputField name="email" fakeplaceholder="E-mail" type="email" />
+									<InputField name="phone" fakeplaceholder="Numéro de téléphone" type="tel" />
+								</div>
+							</Form>
+						</div>
+						<div className={classes["part"]}>
+							<Typography typo={ITypo.H2} color={ITypoColor.BLACK}>
+								Mon office
+							</Typography>
+							<Form onSubmit={this.onFormSubmit}>
+								<div className={classes["form-container"]}>
+									<InputField name="office_denomination" fakeplaceholder="Dénomination de l'office" type="text" />
+									<InputField name="crpcen" fakeplaceholder="CRPCEN" type="number" />
+									<InputField name="cp_address" fakeplaceholder="Adresse CP" type="text" />
+									<InputField name="city" fakeplaceholder="Ville" type="text" />
+								</div>
+							</Form>
+						</div>
+					</div>
+				</div>
+			</DefaultTemplate>
+		);
+	}
+
+	private onFormSubmit(
+		e: React.FormEvent<HTMLFormElement> | null,
+		values: {
+			[key: string]: string;
+		},
+		onApiErrors: (apiFormErrors: IApiFormErrors | null) => void,
+	) {}
+}

src/front/index.scss

@@ -18,6 +18,20 @@ body {
 
 input {
 	font-size: 18px;
+	/* Firefox */
+	-moz-appearance: textfield;
+
+	/* Chrome */
+	&::-webkit-inner-spin-button {
+		-webkit-appearance: none;
+		margin: 0;
+	}
+
+	/* Opéra*/
+	&::-o-inner-spin-button {
+		-o-appearance: none;
+		margin: 0;
+	}
 }
 
 ::placeholder {

src/pages/my-account/index.tsx

@@ -0,0 +1,5 @@
+import MyAccount from "@Front/Components/Layouts/MyAccount";
+
+export default function Route() {
+	return <MyAccount />;
+}