diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/components/report-layout/report-layout.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/components/report-layout/report-layout.component.html
index 041117f..c127379 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/components/report-layout/report-layout.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/components/report-layout/report-layout.component.html
@@ -21,13 +21,21 @@
         <dd>{{avrop.tjanst}}</dd>
         <ng-container *ngIf="!isPeriodDate; else periodDateRef">
           <dt>Startdatum</dt>
-          <dd>{{avrop.startDate | date:'longDate'}}</dd>
+          <dd>
+            <digi-typography-time [afDateTime]="avrop.startDate"></digi-typography-time>
+          </dd>
           <dt>Slutdatum</dt>
-          <dd>{{avrop.endDate | date:'longDate'}}</dd>
+          <dd>
+            <digi-typography-time [afDateTime]="avrop.endDate"></digi-typography-time>
+          </dd>
         </ng-container>
         <ng-template #periodDateRef>
           <dt>Avser period</dt>
-          <dd>{{avrop.startDate | date:'longDate'}} - {{avrop.endDate | date:'longDate'}}</dd>
+          <dd>
+            <digi-typography-time [afDateTime]="avrop.startDate"></digi-typography-time>
+            -
+            <digi-typography-time [afDateTime]="avrop.endDate"></digi-typography-time>
+          </dd>
         </ng-template>
       </dl>
     </div>
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.html
index b8e74ad..9263183 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.html
@@ -18,21 +18,26 @@
         </thead>
         <tbody>
 
-        <tr *ngFor="let handelse of deltagareHandelser;">
-          <td class="deltagare-list-handelser__table-cell">{{handelse.receivedDate | date}}</td>
-          <td class="deltagare-list-handelser__table-cell" *ngIf="!handelse.isAvbrott; else isAvbrottCell">
-            {{handelse.description}}</td>
-          <td class="deltagare-list-handelser__table-cell">
-            <ng-container *ngIf="handelse.effectDescription && handelse.effectDate">
-              {{handelse.effectDescription}}: {{handelse.effectDate | date }}
-            </ng-container>
-          </td>
-          <ng-template #isAvbrottCell>
-            <td class="deltagare-list-handelser__avbrott-cell">
-              <msfa-icon [icon]="iconType.WARNING" size="l"></msfa-icon>
-              {{handelse.description}}</td>
-          </ng-template>
-        </tr>
+          <tr *ngFor="let handelse of deltagareHandelser;">
+            <td class="deltagare-list-handelser__table-cell">
+              <digi-typography-time [afDateTime]="getHandelseDate(handelse, 'receivedDate')"></digi-typography-time>
+            </td>
+            <td class="deltagare-list-handelser__table-cell" *ngIf="!handelse.isAvbrott; else isAvbrottCell">
+              {{handelse.description}}
+            </td>
+            <td class="deltagare-list-handelser__table-cell">
+              <ng-container *ngIf="handelse.effectDescription && handelse.effectDate">
+                {{handelse.effectDescription}}:
+                <digi-typography-time [afDateTime]="getHandelseDate(handelse)"></digi-typography-time>
+              </ng-container>
+            </td>
+            <ng-template #isAvbrottCell>
+              <td class="deltagare-list-handelser__avbrott-cell">
+                <msfa-icon [icon]="iconType.WARNING" size="l"></msfa-icon>
+                {{handelse.description}}
+              </td>
+            </ng-template>
+          </tr>
 
 
         </tbody>
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.ts
index 005c648..f17a99e 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.ts
@@ -16,7 +16,7 @@ export class DeltagareListHandelserDialogComponent implements OnInit {
   iconType = IconType;
   deltagareHandelser$: Observable<DeltagareHandelse[]>;
 
-  constructor(private deltagareHandelserApiService: DeltagareHandelserApiService) {}
+  constructor(private deltagareHandelserApiService: DeltagareHandelserApiService) { }
 
   ngOnInit(): void {
     if (this.deltagare) {
@@ -25,4 +25,8 @@ export class DeltagareListHandelserDialogComponent implements OnInit {
       );
     }
   }
+
+  getHandelseDate(handelse: DeltagareHandelse, handelseDate?: string): Date {
+    return handelseDate ===  'receivedDate' ? new Date(handelse.receivedDate) : new Date(handelse.effectDate);
+  }
 }
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.html
index 7eaac65..8dd8d9c 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.html
@@ -40,9 +40,14 @@
           </th>
           <td>{{ singleDeltagare.tjanst }}</td>
           <td>{{ singleDeltagare.utforandeVerksamhet }}</td>
-          <td>{{ singleDeltagare.startdatumAvrop | date }}</td>
           <td>
-            {{ singleDeltagare.slutdatumAvrop | date }}
+            <digi-typography-time
+              [afDateTime]="getAvropDate(singleDeltagare, 'startdatumAvrop')"
+            ></digi-typography-time>
+          </td>
+
+          <td>
+            <digi-typography-time [afDateTime]="getAvropDate(singleDeltagare)"></digi-typography-time>
             <div class="deltagare-list__avbrott-alert" *ngIf="singleDeltagare.hasAvbrott">
               <msfa-icon [icon]="iconType.WARNING" size="l"></msfa-icon>
               Avbrott
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.ts
index f9cbfaa..042dfab 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.ts
@@ -75,6 +75,10 @@ export class DeltagareListTableComponent {
     return end < this.count ? end : this.count;
   }
 
+  getAvropDate(deltagare: DeltagareCompact, avropDate?: string): Date {
+    return avropDate === 'startdatumAvrop' ? new Date(deltagare.startdatumAvrop) : new Date(deltagare.slutdatumAvrop)
+  }
+
   handleSort(key: keyof DeltagareCompact): void {
     this.sorted.emit(key);
   }