[SG-997] Add warning for low kdf iterations (#4570)

* Created low kdf component

* added low kdf transalation message

* Registered commponent

* Referenced low kdf child compoenent to vault

* Added showLowKdf variable to determine if card should be shown

* Removed test flag

* Updated renamed enum

* Capitalized kdf text

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

@@ -0,0 +1,17 @@
+<div class="tw-rounded tw-border tw-border-solid tw-border-warning-500 tw-bg-background">
+  <div class="tw-bg-warning-500 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>{{ "lowKdfIterationsDesc" | i18n }}</p>
+    <a
+      bitButton
+      buttonType="secondary"
+      [block]="true"
+      routerLink="/settings/security/security-keys"
+    >
+      {{ "changeKdfSettings" | i18n }}
+    </a>
+  </div>
+</div>

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

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