Apply consistent spacing to objective detail view

frontend/src/app/components/keyresult-detail/keyresult-detail.component.scss

@@ -82,10 +82,6 @@
   text-indent: -1.3rem;
 }
 
-.mb-2-rem {
-  margin-bottom: 2rem !important;
-}
-
 .all-checkins-button {
   height: 25px;
 }

frontend/src/app/components/objective-detail/objective-detail.component.html

@@ -1,7 +1,7 @@
 <div class="w-100" [cdkTrapFocus]="true" [cdkTrapFocusAutoCapture]="true">
   <ng-container *ngIf="(objective$ | async)?.id && (objective$ | async) as objective; else spinner">
     <div *ngIf="objective" class="d-flex flex-column">
-      <section class="w-100 d-flex justify-content-between align-items-center mb-3">
+      <section class="w-100 d-flex justify-content-between align-items-center mb-2-rem">
         <h2 class="title" [attr.data-testId]="'objective-title'">{{ objective.title }}</h2>
         <button
           class="d-flex align-items-center justify-content-center"
@@ -16,12 +16,12 @@ <h2 class="title" [attr.data-testId]="'objective-title'">{{ objective.title }}</
       <section class="me-3">
         <h3 class="mb-1">Beschrieb</h3>
         <div class="linebreak" *ngIf="objective.description === ''"><p>-</p></div>
-        <div *ngIf="objective.description !== ''" [attr.data-testId]="'description'" class="linebreak">
+        <div *ngIf="objective.description !== ''" [attr.data-testId]="'description'" class="linebreak mb-2-rem">
           <p>{{ objective.description }}</p>
         </div>
 
         <div
-          class="d-flex align-items-center flex-row justify-content-start mt-4"
+          class="d-flex align-items-center flex-row justify-content-start"
           *ngIf="objective.state.toUpperCase() != 'SUCCESSFUL' && objective.state.toUpperCase() != 'NOTSUCCESSFUL'"
         >
           <button

frontend/src/style/styles.scss

@@ -284,6 +284,10 @@ img.add-cross-button {
   word-break: break-all;
 }
 
+.mb-2-rem {
+  margin-bottom: 2rem !important;
+}
+
 #okrBanner {
   position: fixed;
   width: 100%;