Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 | 26x 78x 14x 28x 14x 14x 28x 14x 14x 14x 28x 14x 14x 1x 14x 14x 14x 14x 26x | <div class="fixed top-12 right-4 z-[100] w-[calc(100%-2rem)] max-w-sm space-y-3">
@for (toast of toasts(); track toast.id) {
<div
id="toast-success"
class="flex items-center w-full max-w-sm p-4 text-body bg-gray-800 rounded-base shadow-xs border border-gray-700 animate-bounce"
role="alert"
>
<div [class]="iconContainerClasses(toast)">
<svg
class="w-5 h-5"
aria-hidden="true"
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
fill="none"
viewBox="0 0 24 24"
>
<path
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
[attr.d]="iconPath(toast)"
/>
</svg>
<span class="sr-only">Check icon</span>
</div>
<div class="ms-3 text-sm font-normal text-white">
{{ toast.message }}
</div>
<button
type="button"
class="ms-auto flex items-center justify-center text-body hover:text-heading bg-transparent box-border border border-transparent hover:bg-neutral-secondary-medium focus:ring-4 focus:ring-neutral-tertiary font-medium leading-5 rounded text-sm h-8 w-8 focus:outline-none"
(click)="dismiss(toast.id)"
aria-label="Close"
>
<span class="sr-only">Close</span>
<svg
class="w-5 h-5"
aria-hidden="true"
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
fill="none"
viewBox="0 0 24 24"
>
<path
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M6 18 17.94 6M18 18 6.06 6"
/>
</svg>
</button>
</div>
}
</div>
|