[PM-1024] feat: add content to login settings component

apps/web/src/app/settings/change-password.component.html

@@ -16,7 +16,7 @@
   [appApiAction]="formPromise"
   ngNativeValidate
   autocomplete="off"
-  class="tw-mb-3"
+  class="tw-mb-14"
 >
   <div class="row">
     <div class="col-6">

apps/web/src/app/settings/fido2-login-settings/fido2-login-settings.component.html

@@ -1 +1,7 @@
-Passkey login settings
+<h2 bitTypography="h2">{{ "loginWithPasskey" | i18n }}</h2>
+<p bitTypography="body1">
+  {{ "loginWithPasskeyInfo" | i18n }}
+  <a bitLink href="???">{{ "learnMoreAboutPasswordless" | i18n }}</a>
+</p>
+
+<button type="button" bitButton>{{ "enable" | i18n }}</button>

apps/web/src/app/settings/fido2-login-settings/fido2-login-settings.module.ts

@@ -1,9 +1,11 @@
 import { NgModule } from "@angular/core";
 
+import { SharedModule } from "../../shared";
+
 import { Fido2LoginSettingsComponent } from "./fido2-login-settings.component";
 
 @NgModule({
-  imports: [],
+  imports: [SharedModule],
   declarations: [Fido2LoginSettingsComponent],
   exports: [Fido2LoginSettingsComponent],
 })

apps/web/src/locales/en/messages.json

@@ -625,6 +625,15 @@
   "loginWithMasterPassword": {
     "message": "Log in with master password"
   },
+  "loginWithPasskey": {
+    "message": "Log in with passkey"
+  },
+  "loginWithPasskeyInfo": {
+    "message": "Use facial recognition, a fingerprint, or other FIDO2 security key to log in instead of your email and password."
+  },
+  "learnMoreAboutPasswordless": {
+    "message": "Learn more about passwordless"
+  },
   "createAccount": {
     "message": "Create account"
   },