@if (notifications().length > 0) {
  <aside class="floating-notifications" aria-live="polite" aria-atomic="true">
    @for (note of notifications(); track note.id) {
      <article
        class="floating-note"
        [class]="'floating-note floating-note-' + note.type"
        [class.floating-note-clickable]="!!note.route"
        (click)="note.route && navigate(note)"
      >
        <p>{{ note.message }}</p>
        <button type="button" (click)="$event.stopPropagation(); dismiss(note.id)" [attr.aria-label]="'common.dismiss' | translate">×</button>
      </article>
    }
  </aside>
}