<bit-section disableMargin>
  <bit-section-header>
    <h2 bitTypography="h6">{{ "itemHistory" | i18n }}</h2>
  </bit-section-header>
  <bit-card>
    <p class="tw-mb-1 tw-text-xs tw-text-muted tw-select-all">
      <span class="tw-font-bold">{{ "lastEdited" | i18n }}:</span>
      {{ cipher.revisionDate | date: "medium" }}
    </p>
    <p
      class="tw-text-xs tw-text-muted tw-select-all"
      [ngClass]="{
        'tw-mb-1 ': cipher.hasPasswordHistory,
        'tw-mb-0': !cipher.hasPasswordHistory,
      }"
    >
      <span class="tw-font-bold">{{ "dateCreated" | i18n }}:</span>
      {{ cipher.creationDate | date: "medium" }}
    </p>
    <p
      *ngIf="cipher.passwordRevisionDisplayDate"
      class="tw-text-xs tw-text-muted tw-select-all"
      [ngClass]="{ 'tw-mb-3': cipher.hasPasswordHistory }"
    >
      <span class="tw-font-bold">{{ "datePasswordUpdated" | i18n }}:</span>
      {{ cipher.passwordRevisionDisplayDate | date: "medium" }}
    </p>
    <button
      *ngIf="cipher.hasPasswordHistory"
      (click)="viewPasswordHistory()"
      bitTypography="body2"
      bitLink
      type="button"
    >
      {{ "passwordHistory" | i18n }}
    </button>
  </bit-card>
</bit-section>
