Improve css

frontend/src/app/Views/dashboard/dashboard.component.html

@@ -6,7 +6,7 @@
         <div class="vertical-center">Aktienübersicht</div>
       </div>
       <mat-card class="placeholder">
-        <div class="stockTable">
+        <div class="stockTableLHS">
           <table mat-table [dataSource]="dataSourceStocks">
             <!--- Note that these columns can be defined in any order.
                 The actual rendered columns are set as a property on the row definition" -->
@@ -53,12 +53,12 @@
       <div class="heading fix-right-side">
         <div class="vertical-center">Depotübersicht</div>
       </div>
-      <mat-card class="placeholder"></mat-card>
+      <mat-card class="placeholderRHS"></mat-card>
     </div>
   </mat-grid-tile>
   <!-- Transaktions -->
   <mat-grid-tile colspan="1" rowspan="1" class="right-side">
-    <div class="depotOverview">
+    <div class="depotOverviewDown">
       <div class="heading fix-right-side">
         <div class="vertical-center">Transaktionen</div>
         <span class="spacer"></span>
@@ -72,7 +72,7 @@
           <mat-icon>add</mat-icon>
         </button>
       </div>
-      <mat-card class="placeholder"
+      <mat-card class="placeholderRHS"
         ><div class="stockTable">
           <table mat-table [dataSource]="dataSourceTransactions">
             <!--- Note that these columns can be defined in any order.

frontend/src/app/Views/dashboard/dashboard.component.scss

@@ -15,12 +15,25 @@
   margin-right: 10%;
 }
 
+.depotOverviewDown {
+  height: 100%;
+  width: 100%;
+  margin-left: 5%;
+  margin-right: 10%;
+}
+
 .stockTable {
   overflow: auto;
   height: 100%;
   width: 100%;
 }
 
+.stockTableLHS {
+  overflow: auto;
+  height: 83%;
+  width: 100%;
+}
+
 .heading {
   font-size: xx-large;
   height: 10%;
@@ -63,6 +76,10 @@ table {
   height: 100%;
 }
 
+.placeholderRHS {
+  height: 80%;
+}
+
 side-heading {
   display: inline;
 }

frontend/src/app/Views/dashboard/dashboard.component.ts

@@ -87,7 +87,6 @@ export class DashboardComponent implements OnInit {
   openDialog(): void {
     const dialogRef = this.dialog.open(UserDialogComponent, {
       width: '50vw',
-      height: '55vh',
       data: {
         symbol: this.symbol,
         time: this.time,

frontend/src/app/app.component.scss

@@ -1 +0,0 @@
-