From b83233eb7c81c1ce21c627f62cce7c15ddbd709a Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Wed, 27 Jan 2021 11:31:56 +0100
Subject: [PATCH] fix: layout issue on small components

---
 src/app/profile/profile.component.html                     | 2 +-
 src/app/reset-email/reset-email.component.html             | 2 +-
 src/app/reset-password/reset-password.component.html       | 2 +-
 src/app/user-verification/user-verification.component.html | 2 +-
 src/styles.scss                                            | 4 ++++
 5 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index c80a5534f..e28fca468 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="column" class="content-container">
+<div fxLayout="column" class="content-container full-screen">
   <div class="section-container" fxLayout="column" fxLayoutAlign="center center">
     <h1>Profil</h1>
     <div *ngIf="userProfile" fxLayout="column" fxLayoutAlign="center" fxLayoutGap="10px">
diff --git a/src/app/reset-email/reset-email.component.html b/src/app/reset-email/reset-email.component.html
index 725a7a8f9..0d5ba6a00 100644
--- a/src/app/reset-email/reset-email.component.html
+++ b/src/app/reset-email/reset-email.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="column" class="content-container">
+<div fxLayout="column" class="content-container full-screen">
   <div class="section-container" fxLayout="colum" fxLayoutAlign="center center">
     <p *ngIf="changeSuccess">
       Vous avez correctement changé votre email associé a votre compte. Vous pouvez désormais vous reconnecter avec
diff --git a/src/app/reset-password/reset-password.component.html b/src/app/reset-password/reset-password.component.html
index f9c3810a2..09c0e2aeb 100644
--- a/src/app/reset-password/reset-password.component.html
+++ b/src/app/reset-password/reset-password.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="column" class="content-container">
+<div fxLayout="column" class="content-container full-screen">
   <div class="section-container" fxLayout="column" fxLayoutAlign="center center">
     <h1>Réinitialisation du mot de passe</h1>
     <form *ngIf="!token" [formGroup]="resetForm" (ngSubmit)="onSubmit()">
diff --git a/src/app/user-verification/user-verification.component.html b/src/app/user-verification/user-verification.component.html
index acb513c81..f1a4876a4 100644
--- a/src/app/user-verification/user-verification.component.html
+++ b/src/app/user-verification/user-verification.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="column" class="content-container">
+<div fxLayout="column" class="content-container full-screen">
   <h1 style="display: none">Vérification du mail utilisateur</h1>
   <div class="section-container" fxLayout="colum" fxLayoutAlign="center center">
     <p *ngIf="!verificationSuccess && !verificationIssue">Votre email est en cours de vérification ...</p>
diff --git a/src/styles.scss b/src/styles.scss
index 5f20d287c..76e407a18 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -6,6 +6,7 @@
 @import 'assets/scss/icons';
 @import 'assets/scss/inputs';
 @import 'assets/scss/hyperlink';
+@import 'assets/scss/layout';
 @import '../node_modules/leaflet.locatecontrol/dist/L.Control.Locate.css';
 
 html {
@@ -68,6 +69,9 @@ a {
   &.no-pt {
     padding: 0 0 30px 0;
   }
+  &.full-screen {
+    height: calc(100vh - #{$header-height} - #{$footer-height});
+  }
   @media #{$phone} {
     padding-top: 30px;
   }
-- 
GitLab