From d4b10c2b721d464907f0b2c288f5f138f663df44 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Andr=C3=A9?= <sebastien.andre@arolla.fr>
Date: Wed, 29 Apr 2020 17:01:56 +0200
Subject: [PATCH] Un peu de changement sur la largeur et sur la hauteur

---
 .../skydivelogs-app/src/app/app.component.css |  6 ++-
 .../list-of-aircrafts.component.html          | 40 ++++++++++---------
 .../list-of-jump-types.component.html         | 40 ++++++++++---------
 .../skydivelogs-app/src/assets/css/styles.css |  4 +-
 4 files changed, 49 insertions(+), 41 deletions(-)

diff --git a/Front/skydivelogs-app/src/app/app.component.css b/Front/skydivelogs-app/src/app/app.component.css
index 515deac..c20ccd9 100644
--- a/Front/skydivelogs-app/src/app/app.component.css
+++ b/Front/skydivelogs-app/src/app/app.component.css
@@ -17,7 +17,6 @@
 .navigation {
   position: absolute;
   width: 200px;
-  /* height: 100%; */
   z-index: 101;
   background-color: grey;
   padding: 5px;
@@ -39,6 +38,11 @@
   text-decoration: none;
   cursor: pointer;
   color: #424242;
+  vertical-align: middle;
+}
+
+.navigation .mat-icon {
+  vertical-align: middle;
 }
 
 .navigation .splitter {
diff --git a/Front/skydivelogs-app/src/app/list-of-aircrafts/list-of-aircrafts.component.html b/Front/skydivelogs-app/src/app/list-of-aircrafts/list-of-aircrafts.component.html
index 954a4b5..30bee75 100644
--- a/Front/skydivelogs-app/src/app/list-of-aircrafts/list-of-aircrafts.component.html
+++ b/Front/skydivelogs-app/src/app/list-of-aircrafts/list-of-aircrafts.component.html
@@ -1,23 +1,25 @@
-<div *ngIf="dataSourceTable != null else loading">
-  <button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a aircraft</button>
+<div class="content">
+  <div *ngIf="dataSourceTable != null else loading">
+    <button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a aircraft</button>
 
-  <table mat-table [dataSource]="dataSourceTable">
-    <ng-container matColumnDef="id">
-      <th mat-header-cell *matHeaderCellDef>ID</th>
-      <td mat-cell *matCellDef="let element">{{element.id}}</td>
-    </ng-container>
+    <table mat-table [dataSource]="dataSourceTable">
+      <ng-container matColumnDef="id">
+        <th mat-header-cell *matHeaderCellDef>ID</th>
+        <td mat-cell *matCellDef="let element">{{element.id}}</td>
+      </ng-container>
 
-    <ng-container matColumnDef="name">
-      <th mat-header-cell *matHeaderCellDef>Name</th>
-      <td mat-cell *matCellDef="let element">{{element.name}}</td>
-    </ng-container>
+      <ng-container matColumnDef="name">
+        <th mat-header-cell *matHeaderCellDef>Name</th>
+        <td mat-cell *matCellDef="let element">{{element.name}}</td>
+      </ng-container>
 
-    <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
-    <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
-  </table>
+      <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
+      <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+    </table>
+  </div>
+  <mat-paginator [length]="resultsLength" [pageSize]="5"></mat-paginator>
+
+  <ng-template #loading>
+    <mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
+  </ng-template>
 </div>
-<mat-paginator [length]="resultsLength" [pageSize]="5"></mat-paginator>
-
-<ng-template #loading>
-  <mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
-</ng-template>
diff --git a/Front/skydivelogs-app/src/app/list-of-jump-types/list-of-jump-types.component.html b/Front/skydivelogs-app/src/app/list-of-jump-types/list-of-jump-types.component.html
index ca16415..8941959 100644
--- a/Front/skydivelogs-app/src/app/list-of-jump-types/list-of-jump-types.component.html
+++ b/Front/skydivelogs-app/src/app/list-of-jump-types/list-of-jump-types.component.html
@@ -1,23 +1,25 @@
-<div *ngIf="dataSourceTable != null else loading">
-  <button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a jump type</button>
+<div class="content">
+  <div *ngIf="dataSourceTable != null else loading">
+    <button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a jump type</button>
 
-  <table mat-table [dataSource]="dataSourceTable">
-    <ng-container matColumnDef="id">
-      <th mat-header-cell *matHeaderCellDef>ID</th>
-      <td mat-cell *matCellDef="let element">{{element.id}}</td>
-    </ng-container>
+    <table mat-table [dataSource]="dataSourceTable">
+      <ng-container matColumnDef="id">
+        <th mat-header-cell *matHeaderCellDef>ID</th>
+        <td mat-cell *matCellDef="let element">{{element.id}}</td>
+      </ng-container>
 
-    <ng-container matColumnDef="name">
-      <th mat-header-cell *matHeaderCellDef>Name</th>
-      <td mat-cell *matCellDef="let element">{{element.name}}</td>
-    </ng-container>
+      <ng-container matColumnDef="name">
+        <th mat-header-cell *matHeaderCellDef>Name</th>
+        <td mat-cell *matCellDef="let element">{{element.name}}</td>
+      </ng-container>
 
-    <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
-    <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
-  </table>
+      <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
+      <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+    </table>
+  </div>
+  <mat-paginator [length]="resultsLength" [pageSize]="20"></mat-paginator>
+
+  <ng-template #loading>
+    <mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
+  </ng-template>
 </div>
-<mat-paginator [length]="resultsLength" [pageSize]="20"></mat-paginator>
-
-<ng-template #loading>
-  <mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
-</ng-template>
diff --git a/Front/skydivelogs-app/src/assets/css/styles.css b/Front/skydivelogs-app/src/assets/css/styles.css
index 70990aa..97c60c5 100644
--- a/Front/skydivelogs-app/src/assets/css/styles.css
+++ b/Front/skydivelogs-app/src/assets/css/styles.css
@@ -2,10 +2,10 @@
 
 html,
 body {
-  /* height: 100%; */
-  height: 100vh;
+  min-height: 100vh;
   width: 100vw;
   box-sizing: border-box;
+  overflow: auto;
 }
 
 body {