[AC-217] Migrate to Banner Component (#8899)

* convert premium card to banner component

- create VaultBanners component that will handle all banner logic

* move upgrade browser notice to banner component

* refactor verify email component to use the banner component

* add email banner to VaultBanners component

* move low KDF message to banner component

* remove unused KDF component

* allow multiple banners to be displayed at once

* use vault service to consolidate premium banner logic
- Implement prompt thresholds for premium banner
- Update dismiss logic to re-run visibility logic

* update variable name

* move all dismiss/show logic to vault banner service

* rename tense of methods for readability

* apply underline to send email button to match other banner actions

* fix dark mode styling across banners

* remove unused variable

* use bitLink directive for styling rather than tailwind

* move premium banner to a standalone observable

* update bootstrap styles to tailwind

* use new KDF service for vault banners

* move the VerifyEmailComponent to a standalone component

* convert premium banner to a singular observable

* remove unneeded import

* AC-2589 add unique id for each vault banner

* AC-2588 poll sync service to only show premium banner after a sync

* close subscription to syncCompleted$ after one emit

* remove unneeded ReplaySubject

apps/web/src/app/settings/low-kdf.component.html

@@ -1,17 +0,0 @@
-<div class="tw-rounded tw-border tw-border-solid tw-border-warning-600 tw-bg-background">
-  <div class="tw-bg-warning-600 tw-px-5 tw-py-2.5 tw-font-bold tw-uppercase tw-text-contrast">
-    <i class="bwi bwi-exclamation-triangle bwi-fw" aria-hidden="true"></i>
-    {{ "lowKdfIterations" | i18n }}
-  </div>
-  <div class="tw-p-5">
-    <p>{{ "updateLowKdfIterationsDesc" | i18n }}</p>
-    <a
-      bitButton
-      buttonType="secondary"
-      [block]="true"
-      routerLink="/settings/security/security-keys"
-    >
-      {{ "updateKdfSettings" | i18n }}
-    </a>
-  </div>
-</div>

apps/web/src/app/settings/low-kdf.component.ts

@@ -1,7 +0,0 @@
-import { Component } from "@angular/core";
-
-@Component({
-  selector: "app-low-kdf",
-  templateUrl: "low-kdf.component.html",
-})
-export class LowKdfComponent {}