From a8b42c01222b73c6f8f5a089490a37f1c0809d48 Mon Sep 17 00:00:00 2001
From: Max S <maxime.sallerin@smart-chain.fr>
Date: Tue, 23 Jul 2024 11:34:34 +0200
Subject: [PATCH] handle information section

---
 .../InformationSection/classes.module.scss          | 13 ++++++++++++-
 .../FolderInformation/InformationSection/index.tsx  |  6 ++++--
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/front/Components/Layouts/Folder/FolderInformation/InformationSection/classes.module.scss b/src/front/Components/Layouts/Folder/FolderInformation/InformationSection/classes.module.scss
index 5abf5a01..dd4839c0 100644
--- a/src/front/Components/Layouts/Folder/FolderInformation/InformationSection/classes.module.scss
+++ b/src/front/Components/Layouts/Folder/FolderInformation/InformationSection/classes.module.scss
@@ -5,7 +5,7 @@
 	gap: var(--spacing-lg, 40px);
 	.info-box1 {
 		display: flex;
-		width: 648px;
+		width: 100%;
 		flex-direction: column;
 		gap: var(--spacing-sm, 8px);
 
@@ -19,7 +19,11 @@
 		display: flex;
 		flex-direction: column;
 		gap: var(--spacing-lg, 24px);
+		width: 100%;
+		max-width: 400px;
+
 		.progress-container {
+			width: 100%;
 			display: flex;
 			justify-content: space-between;
 			align-items: center;
@@ -29,6 +33,13 @@
 				gap: var(--spacing-md, 8px);
 			}
 		}
+
+		.description-container {
+			.text {
+				max-height: 60px;
+				overflow-y: auto;
+			}
+		}
 	}
 
 	.separator {
diff --git a/src/front/Components/Layouts/Folder/FolderInformation/InformationSection/index.tsx b/src/front/Components/Layouts/Folder/FolderInformation/InformationSection/index.tsx
index cfd93afe..39a6e2c8 100644
--- a/src/front/Components/Layouts/Folder/FolderInformation/InformationSection/index.tsx
+++ b/src/front/Components/Layouts/Folder/FolderInformation/InformationSection/index.tsx
@@ -76,11 +76,13 @@ export default function InformationSection(props: IProps) {
 						)}
 					</div>
 				</div>
-				<div>
+				<div className={classes["description-container"]}>
 					<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.COLOR_NEUTRAL_700}>
 						Note du dossier
 					</Typography>
-					<Typography typo={ETypo.TEXT_LG_REGULAR}>{folder?.description}</Typography>
+					<Typography typo={ETypo.TEXT_LG_REGULAR} className={classes["text"]}>
+						{folder?.description}
+					</Typography>
 				</div>
 			</div>
 		</section>