diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index f5050b6..e0bcc82 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -93,6 +93,7 @@ import { ImportSheet } from './shared/import-sheet/import-sheet';
 import { EventButtonsComponent } from './shared/event-buttons/event-buttons';
 import { ContentMusicComponent } from './shared/content-music/content-music';
 import { MediaPlayerComponent } from './shared/media-player/media-player';
+import { DateComponent } from './shared/date/date';
 
 @NgModule({
   declarations: [
@@ -143,6 +144,7 @@ import { MediaPlayerComponent } from './shared/media-player/media-player';
     EventButtonsComponent,
     ContentMusicComponent,
     MediaPlayerComponent,
+    DateComponent
   ],
   imports: [
     HttpClientModule,
diff --git a/src/app/note/note.html b/src/app/note/note.html
index 4e21a31..7933bfd 100644
--- a/src/app/note/note.html
+++ b/src/app/note/note.html
@@ -42,7 +42,7 @@
 
   <div class="events above-event clickable" (click)="navigation.openEvent($event, event)" *ngIf="thread.above$ | async as event">
     <div class="events-header">
-      <app-event-header [pubkey]="event.pubkey"><span class="event-date" [matTooltip]="event.created_at.toString()">{{ event.created_at | ago }}</span> <app-directory-icon [pubkey]="event.pubkey"></app-directory-icon></app-event-header>
+      <app-event-header [pubkey]="event.pubkey"> <app-date [date]="event.created_at"> </app-date> <app-directory-icon [pubkey]="event.pubkey"></app-directory-icon></app-event-header>
       <app-event-actions [event]="event" [pubkey]="event.pubkey"></app-event-actions>
     </div>
     <app-content class="thread-content" [ngClass]="{ 'no-lines': !optionsService.options.showLines, 'lines': optionsService.options.showLines }" [event]="event"></app-content>
@@ -52,7 +52,7 @@
 
   <div class="current-event events noclick" *ngIf="thread.event$ | async as event">
     <div class="events-header">
-      <app-event-header [pubkey]="event.pubkey"><span class="event-date" [matTooltip]="event.created_at.toString()">{{ event.created_at | ago }}</span> <app-directory-icon [pubkey]="event.pubkey"></app-directory-icon></app-event-header>
+      <app-event-header [pubkey]="event.pubkey"><app-date [date]="event.created_at"> </app-date> <app-directory-icon [pubkey]="event.pubkey"></app-directory-icon></app-event-header>
       <app-event-actions [event]="event" [pubkey]="event.pubkey"></app-event-actions>
     </div>
     <app-content class="thread-content" [ngClass]="{ 'no-lines': !optionsService.options.showLines, 'lines': optionsService.options.showLines }" [event]="event"></app-content>
diff --git a/src/app/shared/date/date.css b/src/app/shared/date/date.css
new file mode 100644
index 0000000..d41740e
--- /dev/null
+++ b/src/app/shared/date/date.css
@@ -0,0 +1,3 @@
+.event-date {
+  margin-right: 0.1em;
+}
diff --git a/src/app/shared/date/date.html b/src/app/shared/date/date.html
new file mode 100644
index 0000000..8adc6ba
--- /dev/null
+++ b/src/app/shared/date/date.html
@@ -0,0 +1 @@
+<span class="event-date" (click)="toggle()" *ngIf="!isoDate">{{ date | ago }}</span> <span class="event-date" (click)="toggle()" *ngIf="isoDate">{{ date*1000 | date: 'yyyy-MM-dd HH:mm:ss' }}</span>
diff --git a/src/app/shared/date/date.ts b/src/app/shared/date/date.ts
new file mode 100644
index 0000000..6710d94
--- /dev/null
+++ b/src/app/shared/date/date.ts
@@ -0,0 +1,14 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'app-date',
+  templateUrl: 'date.html',
+  styleUrls: ['date.css'],
+})
+export class DateComponent {
+  @Input() date!: number;
+  isoDate?: boolean;
+  toggle() {
+    this.isoDate = !this.isoDate;
+  }
+}
diff --git a/src/styles.scss b/src/styles.scss
index 6d40f0c..0e95df7 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -623,10 +623,6 @@ mat-sidenav-content mat-toolbar {
   text-align: center;
 }
 
-.event-date {
-  margin-right: 0.1em;
-}
-
 .options-slider {
   margin-right: 1em;
 }