<div class="placard">
  <div class="placard-title">Archives</div>
  <div class="placard-text">Here you can find all the blog posts.</div>
</div>

<div class="text-center">
  <input type="text" placeholder="Search by title" (keyup)="searchArchive($event.target!.value)">
  &nbsp;
  <button class="btn-action" type="button" (click)="searchArchive('', true);">Clear</button>
</div>

<div class="list-group" *ngIf="filteredArchives.length > 0">
  <ng-container *ngFor="let archive of filteredArchives">
    <a href="./?post={{archive.filename}}">
      <div class="list-item mouse-hover title">
        {{archive.postTitle}}
        <div class="timestamp" *ngIf="!!archive.timestamp">{{parseTimestamp(archive.timestamp)}}</div>
      </div>
    </a>
  </ng-container>
</div>

<div class="margin-y text-center" *ngIf="!!settings.username">
  <a href="./">
    <button type="button" class="margins-sides btn-secondary btn-fat">.HOME.</button>
  </a>
</div>