styled plan-detail component toolbar

Author: NisanurBulut

Pilanes/src/app/plan/plan-detail/plan-detail.component.html

@@ -1,16 +1,21 @@
 <div class="dialog-content-wrapper">
-  <mat-progress-bar
-  class="example-margin"
-  [color]="color"
-  [mode]="mode"
-  [value]="this.counter"
-  [bufferValue]="bufferValue">
-</mat-progress-bar>
-            <button mat-icon-button (click)="this.dialogRef.close(false)"  fxFlex
-            fxLayout="row"
-            fxLayoutAlign="end center">
-                <mat-icon>close</mat-icon>
-            </button>
+ <mat-toolbar>
+   <mat-toolbar-row>
+
+      <mat-progress-bar
+      class="example-margin"
+      [color]="color"
+      [mode]="mode"
+      [value]="this.counter"
+      [bufferValue]="bufferValue">
+    </mat-progress-bar>
+                <button mat-icon-button (click)="this.dialogRef.close(false)"  fxFlex
+                fxLayout="row"
+                fxLayoutAlign="end center">
+                    <mat-icon>close</mat-icon>
+                </button>
+   </mat-toolbar-row>
+ </mat-toolbar>
             <mat-carousel
             timings="250ms ease-in"
             [autoplay]="true"

Pilanes/src/app/plan/plan-detail/plan-detail.component.scss

@@ -10,3 +10,6 @@
 ::ng-deep button.mat-focus-indicator.mat-icon-button.mat-button-base{
     float: right!important;
 }
+button {
+    margin-left: 10px;
+}

Pilanes/src/database/db.json

@@ -1,25 +1,19 @@
 {
   "plans": [
     {
-      "name": "2021 01 29T08 30 46 831Z Plan",
+      "name": "2021 01 29T11 37 04 152Z Plan",
       "exercises": [
         {
-          "gifPath": "../assets/exercises/exercise_25.gif",
-          "name": "exercise_25",
+          "gifPath": "../assets/exercises/exercise_27.gif",
+          "name": "exercise_27",
           "checked": false,
-          "id": 25
+          "id": 27
         },
         {
           "gifPath": "../assets/exercises/exercise_26.gif",
           "name": "exercise_26",
           "checked": false,
           "id": 26
-        },
-        {
-          "gifPath": "../assets/exercises/exercise_27.gif",
-          "name": "exercise_27",
-          "checked": false,
-          "id": 27
         }
       ],
       "id": 1