[SI-444]: Total Commit (buttons position fixed on top of detail-page)

Signed-off-by: Dennis Schmitt <dennis.schmitt@pta.de>
diff --git a/projects/grid-failure-information-app/src/app/pages/grid-failure/grid-failure-details/grid-failure-details.component.html b/projects/grid-failure-information-app/src/app/pages/grid-failure/grid-failure-details/grid-failure-details.component.html
index 03c3b01..6f5b9fe 100644
--- a/projects/grid-failure-information-app/src/app/pages/grid-failure/grid-failure-details/grid-failure-details.component.html
+++ b/projects/grid-failure-information-app/src/app/pages/grid-failure/grid-failure-details/grid-failure-details.component.html
@@ -15,40 +15,34 @@
     <div class="header-container">
       <span>{{ 'GridFailure.Title' | translate }}</span>
       <div class="diverse-btn-container">
-        <div class="row justify-content-between">
-          <div>
-            <button
-              *ngIf="gridFailureDetailsSandbox.saveEnabled"
-              type="button"
-              class="btn btn-success button"
-              (click)="gridFailureDetailsSandbox.saveGridFailure()"
-            >
-              {{ 'SaveBtn' | translate }}
-            </button>
-            <button type="button" class="btn btn-primary button" (click)="gridFailureDetailsSandbox.cancel()">
-              {{ 'CancelBtn' | translate }}
-            </button>
-          </div>
-          <div>
-            <!-- State Buttons -->
-            <ng-container *ngIf="gridFailureDetailsSandbox.saveEnabled">
-              <ng-container *ngIf="gridFailureDetailsSandbox.showQualifyButton">
-                <ng-template visibleByRight [acceptedRole]="RolesEnum.QUALIFIER">
-                  <button type="button" class="btn btn-primary button" (click)="gridFailureDetailsSandbox.setState(StateEnum.QUALIFIED)">
-                    {{ 'QualifyBtn' | translate }}
-                  </button>
-                </ng-template>
-              </ng-container>
-
-              <ng-container *ngIf="gridFailureDetailsSandbox.showStornoButton">
-                <ng-template visibleByRight [acceptedRole]="RolesEnum.QUALIFIER">
-                  <button type="button" class="btn btn-primary right-button" (click)="gridFailureDetailsSandbox.setState(StateEnum.CANCELED)">
-                    {{ 'StornoBtn' | translate }}
-                  </button>
-                </ng-template>
-              </ng-container>
-            </ng-container>
-          </div>
+        <div>
+          <button type="button" class="btn btn-primary button" (click)="gridFailureDetailsSandbox.cancel()">
+            {{ 'CancelBtn' | translate }}
+          </button>
+          <ng-container *ngIf="gridFailureDetailsSandbox.showStornoButton && gridFailureDetailsSandbox.saveEnabled">
+            <ng-template visibleByRight [acceptedRole]="RolesEnum.QUALIFIER">
+              <button type="button" class="btn btn-primary right-button" (click)="gridFailureDetailsSandbox.setState(StateEnum.CANCELED)">
+                {{ 'StornoBtn' | translate }}
+              </button>
+            </ng-template>
+          </ng-container>
+        </div>
+        <div>
+          <ng-container *ngIf="gridFailureDetailsSandbox.showQualifyButton && gridFailureDetailsSandbox.saveEnabled">
+            <ng-template visibleByRight [acceptedRole]="RolesEnum.QUALIFIER">
+              <button type="button" class="btn btn-primary button" (click)="gridFailureDetailsSandbox.setState(StateEnum.QUALIFIED)">
+                {{ 'QualifyBtn' | translate }}
+              </button>
+            </ng-template>
+          </ng-container>
+          <button
+            *ngIf="gridFailureDetailsSandbox.saveEnabled"
+            type="button"
+            class="btn btn-success button"
+            (click)="gridFailureDetailsSandbox.saveGridFailure()"
+          >
+            {{ 'SaveBtn' | translate }}
+          </button>
         </div>
       </div>
     </div>
diff --git a/projects/grid-failure-information-app/src/app/pages/grid-failure/grid-failure-details/grid-failure-details.component.scss b/projects/grid-failure-information-app/src/app/pages/grid-failure/grid-failure-details/grid-failure-details.component.scss
index 151a4b8..d2fa2b6 100644
--- a/projects/grid-failure-information-app/src/app/pages/grid-failure/grid-failure-details/grid-failure-details.component.scss
+++ b/projects/grid-failure-information-app/src/app/pages/grid-failure/grid-failure-details/grid-failure-details.component.scss
@@ -66,9 +66,13 @@
 }
 .header-container {
   display: flex;
+  flex-direction: column;
   justify-content: space-between;
 }
 .diverse-btn-container {
   display: flex;
-  justify-content: flex-end;
+  justify-content: space-between;
+}
+.card {
+  height: calc(100vh - 180px);
 }
diff --git a/projects/grid-failure-information-app/src/app/shared/containers/card-layout/card-layout.component.scss b/projects/grid-failure-information-app/src/app/shared/containers/card-layout/card-layout.component.scss
index 08aa06f..7373249 100644
--- a/projects/grid-failure-information-app/src/app/shared/containers/card-layout/card-layout.component.scss
+++ b/projects/grid-failure-information-app/src/app/shared/containers/card-layout/card-layout.component.scss
@@ -11,11 +11,12 @@
  * SPDX-License-Identifier: EPL-2.0
  ********************************************************************************/
 .card {
-  height: calc(100vh - 142px);
+  height: calc(100vh - 180px);
   overflow: auto;
   border: none;
 }
 .card-title {
   font-size: 30px;
   margin-bottom: 8px;
+  background-color: #f8fafd;
 }