From 44f0e4620f446f98b1171347cf810be9ea563467 Mon Sep 17 00:00:00 2001
From: Maxime Lalo <maxime.lalo.pro@gmail.com>
Date: Mon, 29 Jul 2024 18:30:39 +0200
Subject: [PATCH] :sparkles: Responsive on full pages

---
 .../Folder/AddClientToFolder/classes.module.scss     | 12 +++++++++++-
 .../Layouts/Folder/AskDocuments/classes.module.scss  | 12 +++++++++++-
 .../Layouts/Folder/CreateFolder/classes.module.scss  | 11 ++++++++++-
 .../UpdateFolderCollaborators/classes.module.scss    | 12 ++++++++----
 .../Folder/UpdateFolderMetadata/classes.module.scss  | 12 +++++++++++-
 .../Layouts/Login/StepEmail/classes.module.scss      | 11 ++++++++++-
 6 files changed, 61 insertions(+), 9 deletions(-)

diff --git a/src/front/Components/Layouts/Folder/AddClientToFolder/classes.module.scss b/src/front/Components/Layouts/Folder/AddClientToFolder/classes.module.scss
index 19fc7a55..d51866e2 100644
--- a/src/front/Components/Layouts/Folder/AddClientToFolder/classes.module.scss
+++ b/src/front/Components/Layouts/Folder/AddClientToFolder/classes.module.scss
@@ -4,9 +4,19 @@
 	display: flex;
 	flex-direction: column;
 	align-items: flex-start;
-	width: 472px;
+	width: 566px;
 	margin: auto;
 	margin-top: 24px;
+
+	@media (max-width: $screen-m) {
+		width: 474px;
+	}
+
+	@media (max-width: $screen-s) {
+		width: 100%;
+		padding: var(--spacing-md, 16px);
+	}
+
 	.back-arrow {
 		margin-bottom: 24px;
 	}
diff --git a/src/front/Components/Layouts/Folder/AskDocuments/classes.module.scss b/src/front/Components/Layouts/Folder/AskDocuments/classes.module.scss
index 95f5d5f1..cc4cfae8 100644
--- a/src/front/Components/Layouts/Folder/AskDocuments/classes.module.scss
+++ b/src/front/Components/Layouts/Folder/AskDocuments/classes.module.scss
@@ -2,7 +2,17 @@
 
 .root {
 	margin: 24px auto;
-	width: 600px;
+	width: 566px;
+
+	@media (max-width: $screen-m) {
+		width: 474px;
+	}
+
+	@media (max-width: $screen-s) {
+		width: 100%;
+		padding: var(--spacing-md, 16px);
+	}
+
 	.title {
 		margin-top: 24px;
 	}
diff --git a/src/front/Components/Layouts/Folder/CreateFolder/classes.module.scss b/src/front/Components/Layouts/Folder/CreateFolder/classes.module.scss
index ae18852b..b4ed1cc4 100644
--- a/src/front/Components/Layouts/Folder/CreateFolder/classes.module.scss
+++ b/src/front/Components/Layouts/Folder/CreateFolder/classes.module.scss
@@ -1,13 +1,22 @@
 @import "@Themes/constants.scss";
 
 .root {
-	width: 472px;
+	width: 566px;
 	margin: 24px auto;
 
 	display: flex;
 	flex-direction: column;
 	gap: var(--spacing-xl, 32px);
 
+	@media (max-width: $screen-m) {
+		width: 474px;
+	}
+
+	@media (max-width: $screen-s) {
+		width: 100%;
+		padding: var(--spacing-md, 16px);
+	}
+
 	.form {
 		display: flex;
 		flex-direction: column;
diff --git a/src/front/Components/Layouts/Folder/UpdateFolderCollaborators/classes.module.scss b/src/front/Components/Layouts/Folder/UpdateFolderCollaborators/classes.module.scss
index 5c8539d8..76b11e55 100644
--- a/src/front/Components/Layouts/Folder/UpdateFolderCollaborators/classes.module.scss
+++ b/src/front/Components/Layouts/Folder/UpdateFolderCollaborators/classes.module.scss
@@ -3,14 +3,18 @@
 .root {
 	display: flex;
 	flex-direction: column;
-	width: 472px;
+	width: 566px;
 	margin: auto;
 	margin-top: 24px;
 	gap: var(--spacing-xl, 32px);
 
-	@media (max-width: 504px) {
-		width: unset;
-		margin: 24px 16px;
+	@media (max-width: $screen-m) {
+		width: 474px;
+	}
+
+	@media (max-width: $screen-s) {
+		width: 100%;
+		padding: var(--spacing-md, 16px);
 	}
 
 	.form {
diff --git a/src/front/Components/Layouts/Folder/UpdateFolderMetadata/classes.module.scss b/src/front/Components/Layouts/Folder/UpdateFolderMetadata/classes.module.scss
index 57f936d6..8f7fa6b5 100644
--- a/src/front/Components/Layouts/Folder/UpdateFolderMetadata/classes.module.scss
+++ b/src/front/Components/Layouts/Folder/UpdateFolderMetadata/classes.module.scss
@@ -4,9 +4,19 @@
 	display: flex;
 	flex-direction: column;
 	gap: var(--spacing-xl, 32px);
-	width: 472px;
+	width: 566px;
 	margin: auto;
 	margin: 24px auto;
+
+	@media (max-width: $screen-m) {
+		width: 474px;
+	}
+
+	@media (max-width: $screen-s) {
+		width: 100%;
+		padding: var(--spacing-md, 16px);
+	}
+
 	.form {
 		.content {
 			display: flex;
diff --git a/src/front/Components/Layouts/Login/StepEmail/classes.module.scss b/src/front/Components/Layouts/Login/StepEmail/classes.module.scss
index 2826c0af..28b9b276 100644
--- a/src/front/Components/Layouts/Login/StepEmail/classes.module.scss
+++ b/src/front/Components/Layouts/Login/StepEmail/classes.module.scss
@@ -1,11 +1,20 @@
 .root {
-	width: 472px;
+	width: 566px;
 	margin: auto;
 	margin-top: 80px;
 	display: flex;
 	flex-direction: column;
 	gap: var(--spacing-xl, 32px);
 
+	@media (max-width: $screen-m) {
+		width: 474px;
+	}
+
+	@media (max-width: $screen-s) {
+		width: 100%;
+		padding: var(--spacing-md, 16px);
+	}
+
 	.header {
 		display: flex;
 		flex-direction: column;