From 8724eaf9147af3682ed43ba26eca996f4d75f2c7 Mon Sep 17 00:00:00 2001
From: Marcel Schwarz <marcel@icaotix.de>
Date: Sun, 3 Jan 2021 04:33:31 +0100
Subject: [PATCH] Remove some more weird fxFlex and fxLayout directives

---
 .../rent-duration-chart.component.html        | 17 ++++++-----------
 .../rent-time-chart.component.html            | 19 +++++++------------
 2 files changed, 13 insertions(+), 23 deletions(-)

diff --git a/projects/project-3/frontend/src/app/dashboard/rent-duration-chart/rent-duration-chart.component.html b/projects/project-3/frontend/src/app/dashboard/rent-duration-chart/rent-duration-chart.component.html
index f282e7a..5bcf33b 100644
--- a/projects/project-3/frontend/src/app/dashboard/rent-duration-chart/rent-duration-chart.component.html
+++ b/projects/project-3/frontend/src/app/dashboard/rent-duration-chart/rent-duration-chart.component.html
@@ -1,4 +1,4 @@
-<mat-card fxFlex fxLayout="column">
+<mat-card>
   <mat-card-header>
     <mat-card-title>Rental Duration</mat-card-title>
     <mat-card-subtitle>
@@ -6,8 +6,8 @@
       The time it takes for a rent which has the current station as origin is displayed here.
     </mat-card-subtitle>
   </mat-card-header>
-  <mat-card-content *ngIf="!isLoading" fxFlex fxLayout="row" fxLayoutAlign="center">
-    <div class="station-dashboard-borrow-duration" fxFlex>
+  <mat-card-content>
+    <div *ngIf="!isLoading" class="station-dashboard-borrow-duration">
       <apx-chart
         [chart]="chartOptions.chart"
         [colors]="chartOptions.colors"
@@ -20,13 +20,8 @@
         [xaxis]="chartOptions.xaxis"
         [yaxis]="chartOptions.yaxis"></apx-chart>
     </div>
+    <div *ngIf="isLoading" class="col d-flex align-items-center justify-content-center">
+      <mat-progress-spinner color="primary" mode="indeterminate" [diameter]="300"></mat-progress-spinner>
+    </div>
   </mat-card-content>
-  <div *ngIf="isLoading"
-       style="display: flex; justify-content: center; align-items: center; background: white; padding: 10px; height: 400px;">
-    <mat-progress-spinner
-      color="primary"
-      mode="indeterminate"
-    [diameter]="300">
-    </mat-progress-spinner>
-  </div>
 </mat-card>
diff --git a/projects/project-3/frontend/src/app/dashboard/rent-time-chart/rent-time-chart.component.html b/projects/project-3/frontend/src/app/dashboard/rent-time-chart/rent-time-chart.component.html
index 07037d5..c579ad8 100644
--- a/projects/project-3/frontend/src/app/dashboard/rent-time-chart/rent-time-chart.component.html
+++ b/projects/project-3/frontend/src/app/dashboard/rent-time-chart/rent-time-chart.component.html
@@ -1,5 +1,5 @@
-<mat-card fxFlex fxLayout="column">
-  <mat-card-header class="chart-header">
+<mat-card>
+  <mat-card-header>
     <mat-card-title>Rental Time</mat-card-title>
     <mat-card-subtitle>
       This chart shows the workload of the currently selected station in relation
@@ -8,8 +8,8 @@
     </mat-card-subtitle>
   </mat-card-header>
 
-  <mat-card-content *ngIf="!isLoading" fxFlex fxLayout="row" fxLayoutAlign="center">
-    <div class="station-dashboard-borrow-time" fxFlex>
+  <mat-card-content>
+    <div *ngIf="!isLoading" class="station-dashboard-borrow-time">
       <apx-chart
         [chart]="chartOptions.chart"
         [colors]="chartOptions.colors"
@@ -22,13 +22,8 @@
         [xaxis]="chartOptions.xaxis"
         [yaxis]="chartOptions.yaxis"></apx-chart>
     </div>
+    <div *ngIf="isLoading" class="col d-flex align-items-center justify-content-center">
+      <mat-progress-spinner color="primary" mode="indeterminate" [diameter]="300"></mat-progress-spinner>
+    </div>
   </mat-card-content>
-  <div *ngIf="isLoading"
-       style="display: flex; justify-content: center; align-items: center; background: white; padding: 10px; height: 400px;">
-    <mat-progress-spinner
-      color="primary"
-      mode="indeterminate"
-      [diameter]="300">
-    </mat-progress-spinner>
-  </div>
 </mat-card>