[PM-10651] Use bitLink instead of icon button and add a11y title (#10483)

apps/browser/src/_locales/en/messages.json

@@ -690,6 +690,9 @@
   "totpHelperWithCapture": {
     "message": "Bitwarden can store and fill 2-step verification codes. Select the camera icon to take a screenshot of this website's authenticator QR code, or copy and paste the key into this field."
   },
+  "learnMoreAboutAuthenticators": {
+    "message": "Learn more about authenticators"
+  },
   "copyTOTP": {
     "message": "Copy Authenticator key (TOTP)"
   },

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

@@ -212,6 +212,9 @@
   "totpHelperWithCapture": {
     "message": "Bitwarden can store and fill 2-step verification codes. Select the camera icon to take a screenshot of this website's authenticator QR code, or copy and paste the key into this field."
   },
+  "learnMoreAboutAuthenticators": {
+    "message": "Learn more about authenticators"
+  },
   "folder": {
     "message": "Folder"
   },

libs/vault/src/cipher-form/components/login-details-section/login-details-section.component.html

@@ -88,11 +88,13 @@
       <bit-label>
         {{ "authenticatorKey" | i18n }}
         <button
-          bitIconButton="bwi-question-circle"
+          bitLink
           type="button"
-          size="small"
           [bitPopoverTriggerFor]="totpPopover"
-        ></button>
+          [appA11yTitle]="'learnMoreAboutAuthenticators' | i18n"
+        >
+          <i class="bwi bwi-sm bwi-question-circle" aria-hidden="true"></i>
+        </button>
         <bit-popover #totpPopover [title]="'totpHelperTitle' | i18n">
           <p>{{ (canCaptureTotp ? "totpHelperWithCapture" : "totpHelper") | i18n }}</p>
         </bit-popover>

libs/vault/src/cipher-form/components/login-details-section/login-details-section.component.ts

@@ -14,6 +14,7 @@ import {
   CardComponent,
   FormFieldModule,
   IconButtonModule,
+  LinkModule,
   PopoverModule,
   SectionComponent,
   SectionHeaderComponent,
@@ -43,6 +44,7 @@ import { AutofillOptionsComponent } from "../autofill-options/autofill-options.c
     NgIf,
     PopoverModule,
     AutofillOptionsComponent,
+    LinkModule,
   ],
 })
 export class LoginDetailsSectionComponent implements OnInit {