Index: trip-planner-front/src/app/planner/edit-planner/edit-planner.component.html
===================================================================
--- trip-planner-front/src/app/planner/edit-planner/edit-planner.component.html	(revision 1ad8e64a349fcc7c996155279b16efc2cfe001dd)
+++ trip-planner-front/src/app/planner/edit-planner/edit-planner.component.html	(revision bdd64917749115bbdd228a9569a675d590c112e3)
@@ -1,18 +1,20 @@
-<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"
+    integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
 
 <h3>Here you can edit your planner</h3>
 
-<form [formGroup] = "form" (ngSubmit)="onSubmit()">
+<form [formGroup]="form" (ngSubmit)="onSubmit()">
     <div class="form-gorup">
         <p>Planner name</p>
         <mat-form-field appearance="fill">
-          <input matInput required type="text" formControlName="name"  placeholder="Planner name">
+            <input matInput required type="text" formControlName="name" placeholder="Planner name">
         </mat-form-field>
         <p>Planner description</p>
         <mat-form-field appearance="fill">
-          <textarea matInput required formControlName="description"  type="text" placeholder="Planner description"></textarea>
+            <textarea matInput required formControlName="description" type="text"
+                placeholder="Planner description"></textarea>
         </mat-form-field>
     </div>
-    <div class="container mb-4" >
+    <div class="container mb-4">
         <div class="row">
             <div class="col-12">
@@ -20,20 +22,23 @@
                     <table class="table table-striped">
                         <thead>
-                        <tr>
-                            <th scope="col">Location name</th>
-                        </tr>
+                            <tr>
+                                <th scope="col">Location name</th>
+                            </tr>
                         </thead>
                         <tbody>
-                        <tr>                           
-                            <td> <button mat-raised-button color="primary" (click)="onClickAddLocation()">
-                                 Add locations
-                                 </button>
-                            </td>
-                        </tr>
-                        <tr *ngFor ="let location of locations">
-                            <td>
-                                {{location.name}}
-                            </td>
-                        </tr>
+                            <tr>
+                                <td> <button mat-raised-button color="primary" (click)="onClickAddLocation()">
+                                        Add locations
+                                    </button>
+                                </td>
+                            </tr>
+                            <tr *ngFor="let location of locations">
+                                <td>
+                                    {{location.name}}
+                                </td>
+                                <td>
+                                    <button pButton pRipple type="button" icon="pi pi-times" class="p-button-rounded p-button-danger p-button-text"></button>
+                                </td>
+                            </tr>
                         </tbody>
                     </table>
@@ -44,3 +49,4 @@
     <button pButton pRipplelabel label="Save" class="p-button-help"></button>
 </form>
-<button pButton pRipple label="Back" class="p-button-info" (click)="onClickBack()" [style]="{'margin-left': '.11em'}"></button>
+<button pButton pRipple label="Back" class="p-button-info" (click)="onClickBack()"
+    [style]="{'margin-left': '.11em'}"></button>
