From 8e1844acd93e08b06f2afd6dfc15fac0895acee4 Mon Sep 17 00:00:00 2001
From: Vins <vincent.alamelle@smart-chain.fr>
Date: Mon, 19 Feb 2024 11:30:08 +0100
Subject: [PATCH] Button fixed

---
 .../Layouts/ClientDashboard/classes.module.scss    |  1 +
 .../Components/Layouts/ClientDashboard/index.tsx   | 14 +++++++++-----
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/front/Components/Layouts/ClientDashboard/classes.module.scss b/src/front/Components/Layouts/ClientDashboard/classes.module.scss
index 669d9522..97e56410 100644
--- a/src/front/Components/Layouts/ClientDashboard/classes.module.scss
+++ b/src/front/Components/Layouts/ClientDashboard/classes.module.scss
@@ -4,6 +4,7 @@
 	.header {
 		display: flex;
 		padding: 64px;
+		justify-content: space-between;
 
 		@media (max-width: $screen-m) {
 			flex-wrap: wrap;
diff --git a/src/front/Components/Layouts/ClientDashboard/index.tsx b/src/front/Components/Layouts/ClientDashboard/index.tsx
index 281f3a23..21794511 100644
--- a/src/front/Components/Layouts/ClientDashboard/index.tsx
+++ b/src/front/Components/Layouts/ClientDashboard/index.tsx
@@ -95,9 +95,11 @@ export default function ClientDashboard(props: IProps) {
 			<div className={classes["header"]}>
 				<div className={classes["text-container"]}>
 					{/* TODO Get name from userStore */}
-					<Typography typo={ITypo.H1} className={classes["title"]}>
-						Bonjour {customer?.contact?.first_name.concat(" ", customer?.contact?.last_name)}
-					</Typography>
+					<div className={classes["title-container"]}>
+						<Typography typo={ITypo.H1} className={classes["title"]}>
+							Bonjour {customer?.contact?.first_name.concat(" ", customer?.contact?.last_name)}
+						</Typography>
+					</div>
 
 					<Typography typo={ITypo.P_SB_18} className={classes["folder-number"]} color={ITypoColor.GREY}>
 						Dossier {folder?.folder_number} - {folder?.name}
@@ -117,9 +119,11 @@ export default function ClientDashboard(props: IProps) {
 						sélectionnez le document correspondant. <br /> En déposant un document, celui-ci est automatiquement enregistré et
 						transmis à votre notaire.
 					</Typography>
-
-					{folder?.office?.rib_name && <Button onClick={downloadFile}>Télécharger le Rib</Button>}
 				</div>
+				{folder?.office?.rib_name && (
+					//Div to avoid the button to be on the same line as the text
+					<Button onClick={downloadFile}>Télécharger le Rib</Button>
+				)}
 			</div>
 		);
 	}, [customer, folder?.folder_number, folder?.name, folder?.office?.name]);