PM-15894: Update text fields to new designs (#1215)

bitwarden · Dec 20, 2024 · e836062 · e836062
1 parent b33e785
commit e836062
Show file tree

Hide file tree

Showing 272 changed files with 293 additions and 180 deletions.
diff --git a/...istration/__Snapshots__/CompleteRegistrationViewTests/test_snapshot_empty.1.png b/...istration/__Snapshots__/CompleteRegistrationViewTests/test_snapshot_empty.1.png
diff --git a/...istration/__Snapshots__/CompleteRegistrationViewTests/test_snapshot_empty.2.png b/...istration/__Snapshots__/CompleteRegistrationViewTests/test_snapshot_empty.2.png
diff --git a/...istration/__Snapshots__/CompleteRegistrationViewTests/test_snapshot_empty.3.png b/...istration/__Snapshots__/CompleteRegistrationViewTests/test_snapshot_empty.3.png
diff --git a/...CompleteRegistrationViewTests/test_snapshot_empty_nativeCreateAccountFlow.1.png b/...CompleteRegistrationViewTests/test_snapshot_empty_nativeCreateAccountFlow.1.png
diff --git a/...CompleteRegistrationViewTests/test_snapshot_empty_nativeCreateAccountFlow.2.png b/...CompleteRegistrationViewTests/test_snapshot_empty_nativeCreateAccountFlow.2.png
diff --git a/...CompleteRegistrationViewTests/test_snapshot_empty_nativeCreateAccountFlow.3.png b/...CompleteRegistrationViewTests/test_snapshot_empty_nativeCreateAccountFlow.3.png
diff --git a/...Snapshots__/CompleteRegistrationViewTests/test_snapshot_textFields_hidden.1.png b/...Snapshots__/CompleteRegistrationViewTests/test_snapshot_textFields_hidden.1.png
diff --git a/...strationViewTests/test_snapshot_textFields_hidden_nativeCreateAccountFlow.1.png b/...strationViewTests/test_snapshot_textFields_hidden_nativeCreateAccountFlow.1.png
diff --git a/...pshots__/CompleteRegistrationViewTests/test_snapshot_textFields_populated.1.png b/...pshots__/CompleteRegistrationViewTests/test_snapshot_textFields_populated.1.png
diff --git a/...pshots__/CompleteRegistrationViewTests/test_snapshot_textFields_populated.2.png b/...pshots__/CompleteRegistrationViewTests/test_snapshot_textFields_populated.2.png
diff --git a/...pshots__/CompleteRegistrationViewTests/test_snapshot_textFields_populated.3.png b/...pshots__/CompleteRegistrationViewTests/test_snapshot_textFields_populated.3.png
diff --git a/...ationViewTests/test_snapshot_textFields_populated_nativeCreateAccountFlow.1.png b/...ationViewTests/test_snapshot_textFields_populated_nativeCreateAccountFlow.1.png
diff --git a/...ationViewTests/test_snapshot_textFields_populated_nativeCreateAccountFlow.2.png b/...ationViewTests/test_snapshot_textFields_populated_nativeCreateAccountFlow.2.png
diff --git a/...tion/__Snapshots__/CompleteRegistrationViewTests/test_snapshot_toggles_on.1.png b/...tion/__Snapshots__/CompleteRegistrationViewTests/test_snapshot_toggles_on.1.png
diff --git a/...eteRegistrationViewTests/test_snapshot_toggles_on_nativeCreateAccountFlow.1.png b/...eteRegistrationViewTests/test_snapshot_toggles_on_nativeCreateAccountFlow.1.png
diff --git a/...th/CreateAccount/__Snapshots__/CreateAccountViewTests/test_snapshot_empty.1.png b/...th/CreateAccount/__Snapshots__/CreateAccountViewTests/test_snapshot_empty.1.png
diff --git a/...ount/__Snapshots__/CreateAccountViewTests/test_snapshot_textFields_hidden.1.png b/...ount/__Snapshots__/CreateAccountViewTests/test_snapshot_textFields_hidden.1.png
diff --git a/...t/__Snapshots__/CreateAccountViewTests/test_snapshot_textFields_populated.1.png b/...t/__Snapshots__/CreateAccountViewTests/test_snapshot_textFields_populated.1.png
diff --git a/...eateAccount/__Snapshots__/CreateAccountViewTests/test_snapshot_toggles_on.1.png b/...eateAccount/__Snapshots__/CreateAccountViewTests/test_snapshot_toggles_on.1.png
diff --git a/BitwardenShared/UI/Auth/Landing/SelfHosted/SelfHostedView.swift b/BitwardenShared/UI/Auth/Landing/SelfHosted/SelfHostedView.swift
@@ -91,8 +91,7 @@ struct SelfHostedView: View {
                 text: store.binding(
                     get: \.serverUrl,
                     send: SelfHostedAction.serverUrlChanged
-                ),
-                placeholder: "ex. https://bitwarden.company.com"
+                )
             )
             .accessibilityIdentifier("ServerUrlEntry")
             .autocorrectionDisabled()

diff --git a/...Auth/Landing/SelfHosted/__Snapshots__/SelfHostedViewTests/test_viewRender.1.png b/...Auth/Landing/SelfHosted/__Snapshots__/SelfHostedViewTests/test_viewRender.1.png
diff --git a/.../UI/Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_email_value.2.png b/.../UI/Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_email_value.2.png
diff --git a/.../UI/Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_email_value.3.png b/.../UI/Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_email_value.3.png
diff --git a/...Shared/UI/Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_empty.2.png b/...Shared/UI/Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_empty.2.png
diff --git a/...Shared/UI/Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_empty.3.png b/...Shared/UI/Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_empty.3.png
diff --git a/.../Landing/__Snapshots__/LandingViewTests/test_snapshot_isRememberMeOn_true.2.png b/.../Landing/__Snapshots__/LandingViewTests/test_snapshot_isRememberMeOn_true.2.png
diff --git a/.../Landing/__Snapshots__/LandingViewTests/test_snapshot_isRememberMeOn_true.3.png b/.../Landing/__Snapshots__/LandingViewTests/test_snapshot_isRememberMeOn_true.3.png
diff --git a/.../Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_profilesClosed.2.png b/.../Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_profilesClosed.2.png
diff --git a/.../Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_profilesClosed.3.png b/.../Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_profilesClosed.3.png
diff --git a/...Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_profilesVisible.2.png b/...Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_profilesVisible.2.png
diff --git a/...Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_profilesVisible.3.png b/...Auth/Landing/__Snapshots__/LandingViewTests/test_snapshot_profilesVisible.3.png
diff --git a/BitwardenShared/UI/Auth/Login/LoginView.swift b/BitwardenShared/UI/Auth/Login/LoginView.swift
@@ -92,7 +92,7 @@ struct LoginView: View {
                 } label: {
                     HStack(spacing: 8) {
                         Image(decorative: Asset.Images.mobile16)
-                            .imageStyle(.accessoryIcon(scaleWithFont: true))
+                            .imageStyle(.accessoryIcon16(scaleWithFont: true))
                         Text(Localizations.logInWithDevice)
                     }
                 }
@@ -105,7 +105,7 @@ struct LoginView: View {
             } label: {
                 HStack(spacing: 8) {
                     Image(decorative: Asset.Images.provider16)
-                        .imageStyle(.accessoryIcon(scaleWithFont: true))
+                        .imageStyle(.accessoryIcon16(scaleWithFont: true))
                     Text(Localizations.logInSso)
                 }
             }

diff --git a/...ogin/SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_empty.1.png b/...ogin/SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_empty.1.png
diff --git a/...ogin/SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_empty.2.png b/...ogin/SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_empty.2.png
diff --git a/...ogin/SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_empty.3.png b/...ogin/SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_empty.3.png
diff --git a/.../SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_populated.1.png b/.../SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_populated.1.png
diff --git a/.../SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_populated.2.png b/.../SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_populated.2.png
diff --git a/.../SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_populated.3.png b/.../SingleSignOn/__Snapshots__/SingleSignOnViewTests/test_snapshot_populated.3.png
diff --git a/...orAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_authApp.2.png b/...orAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_authApp.2.png
diff --git a/...orAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_authApp.3.png b/...orAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_authApp.3.png
diff --git a/...ctorAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email.1.png b/...ctorAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email.1.png
diff --git a/...ctorAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email.2.png b/...ctorAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email.2.png
diff --git a/...ctorAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email.3.png b/...ctorAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email.3.png
diff --git a/...h/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email_filled.1.png b/...h/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email_filled.1.png
diff --git a/...h/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email_filled.2.png b/...h/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email_filled.2.png
diff --git a/...h/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email_filled.3.png b/...h/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_email_filled.3.png
diff --git a/...orAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_yubikey.1.png b/...orAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_yubikey.1.png
diff --git a/...orAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_yubikey.2.png b/...orAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_yubikey.2.png
diff --git a/...orAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_yubikey.3.png b/...orAuth/__Snapshots__/TwoFactorAuthViewTests/test_snapshot_default_yubikey.3.png
diff --git a/...rdenShared/UI/Auth/Login/__Snapshots__/LoginViewTests/test_snapshot_empty.1.png b/...rdenShared/UI/Auth/Login/__Snapshots__/LoginViewTests/test_snapshot_empty.1.png
diff --git a/...d/UI/Auth/Login/__Snapshots__/LoginViewTests/test_snapshot_passwordHidden.1.png b/...d/UI/Auth/Login/__Snapshots__/LoginViewTests/test_snapshot_passwordHidden.1.png
diff --git a/...UI/Auth/Login/__Snapshots__/LoginViewTests/test_snapshot_passwordRevealed.1.png b/...UI/Auth/Login/__Snapshots__/LoginViewTests/test_snapshot_passwordRevealed.1.png
diff --git a/...hared/UI/Auth/Login/__Snapshots__/LoginViewTests/test_snapshot_selfHosted.1.png b/...hared/UI/Auth/Login/__Snapshots__/LoginViewTests/test_snapshot_selfHosted.1.png
diff --git a/...hared/UI/Auth/Login/__Snapshots__/LoginViewTests/test_snapshot_withDevice.1.png b/...hared/UI/Auth/Login/__Snapshots__/LoginViewTests/test_snapshot_withDevice.1.png
diff --git a/...Auth/PasswordHint/__Snapshots__/PasswordHintViewTests/test_snapshot_empty.1.png b/...Auth/PasswordHint/__Snapshots__/PasswordHintViewTests/test_snapshot_empty.1.png
diff --git a/...rdHint/__Snapshots__/PasswordHintViewTests/test_snapshot_withEmailAddress.1.png b/...rdHint/__Snapshots__/PasswordHintViewTests/test_snapshot_withEmailAddress.1.png
diff --git a/...rdHint/__Snapshots__/PasswordHintViewTests/test_snapshot_withEmailAddress.2.png b/...rdHint/__Snapshots__/PasswordHintViewTests/test_snapshot_withEmailAddress.2.png
diff --git a/...rdHint/__Snapshots__/PasswordHintViewTests/test_snapshot_withEmailAddress.3.png b/...rdHint/__Snapshots__/PasswordHintViewTests/test_snapshot_withEmailAddress.3.png
diff --git a/BitwardenShared/UI/Auth/ProfileSwitcher/ProfileSwitcherRow.swift b/BitwardenShared/UI/Auth/ProfileSwitcher/ProfileSwitcherRow.swift
@@ -113,7 +113,7 @@ struct ProfileSwitcherRow: View {
             .accessibilityLabel(Localizations.account)
         case .addAccount:
             Asset.Images.plus16.swiftUIImage
-                .imageStyle(.accessoryIcon(color: Asset.Colors.iconSecondary.swiftUIColor))
+                .imageStyle(.accessoryIcon16(color: Asset.Colors.iconSecondary.swiftUIColor))
                 .padding(4)
         }
     }

diff --git a/...pshots__/RemoveMasterPasswordViewTests/test_snapshot_removeMasterPassword.2.png b/...pshots__/RemoveMasterPasswordViewTests/test_snapshot_removeMasterPassword.2.png
diff --git a/...pshots__/RemoveMasterPasswordViewTests/test_snapshot_removeMasterPassword.3.png b/...pshots__/RemoveMasterPasswordViewTests/test_snapshot_removeMasterPassword.3.png
diff --git a/...hots__/SetMasterPasswordViewTests/test_snapshot_setPassword_filled.portrait.png b/...hots__/SetMasterPasswordViewTests/test_snapshot_setPassword_filled.portrait.png
diff --git a/...__/SetMasterPasswordViewTests/test_snapshot_setPassword_filled.portraitDark.png b/...__/SetMasterPasswordViewTests/test_snapshot_setPassword_filled.portraitDark.png
diff --git a/...SetMasterPasswordViewTests/test_snapshot_setPassword_filled.tallPortraitAX5.png b/...SetMasterPasswordViewTests/test_snapshot_setPassword_filled.tallPortraitAX5.png
diff --git a/...terPasswordViewTests/test_snapshot_setPassword_privilege_elevation.portrait.png b/...terPasswordViewTests/test_snapshot_setPassword_privilege_elevation.portrait.png
diff --git a/...asswordViewTests/test_snapshot_setPassword_privilege_elevation.portraitDark.png b/...asswordViewTests/test_snapshot_setPassword_privilege_elevation.portraitDark.png
diff --git a/...wordViewTests/test_snapshot_setPassword_privilege_elevation.tallPortraitAX5.png b/...wordViewTests/test_snapshot_setPassword_privilege_elevation.tallPortraitAX5.png
diff --git a/...Registration/__Snapshots__/StartRegistrationViewTests/test_snapshot_empty.1.png b/...Registration/__Snapshots__/StartRegistrationViewTests/test_snapshot_empty.1.png
diff --git a/...apshots__/StartRegistrationViewTests/test_snapshot_marketingToggle_hidden.1.png b/...apshots__/StartRegistrationViewTests/test_snapshot_marketingToggle_hidden.1.png
diff --git a/..._/StartRegistrationViewTests/test_snapshot_nativeCreateAccountFeatureFlag.2.png b/..._/StartRegistrationViewTests/test_snapshot_nativeCreateAccountFeatureFlag.2.png
diff --git a/...Snapshots__/StartRegistrationViewTests/test_snapshot_textFields_populated.1.png b/...Snapshots__/StartRegistrationViewTests/test_snapshot_textFields_populated.1.png
diff --git a/...Snapshots__/StartRegistrationViewTests/test_snapshot_textFields_populated.2.png b/...Snapshots__/StartRegistrationViewTests/test_snapshot_textFields_populated.2.png
diff --git a/...Snapshots__/StartRegistrationViewTests/test_snapshot_textFields_populated.3.png b/...Snapshots__/StartRegistrationViewTests/test_snapshot_textFields_populated.3.png
diff --git a/...hots__/StartRegistrationViewTests/test_snapshot_textFields_populated_long.1.png b/...hots__/StartRegistrationViewTests/test_snapshot_textFields_populated_long.1.png
diff --git a/...hots__/StartRegistrationViewTests/test_snapshot_textFields_populated_long.2.png b/...hots__/StartRegistrationViewTests/test_snapshot_textFields_populated_long.2.png
diff --git a/...hots__/StartRegistrationViewTests/test_snapshot_textFields_populated_long.3.png b/...hots__/StartRegistrationViewTests/test_snapshot_textFields_populated_long.3.png
diff --git a/...tration/__Snapshots__/StartRegistrationViewTests/test_snapshot_toggles_on.1.png b/...tration/__Snapshots__/StartRegistrationViewTests/test_snapshot_toggles_on.1.png
diff --git a/...UpdateMasterPasswordViewTests/test_snapshot_resetPassword_withFilled_dark.1.png b/...UpdateMasterPasswordViewTests/test_snapshot_resetPassword_withFilled_dark.1.png
diff --git a/...ateMasterPasswordViewTests/test_snapshot_resetPassword_withFilled_default.1.png b/...ateMasterPasswordViewTests/test_snapshot_resetPassword_withFilled_default.1.png
diff --git a/...pdateMasterPasswordViewTests/test_snapshot_resetPassword_withFilled_large.1.png b/...pdateMasterPasswordViewTests/test_snapshot_resetPassword_withFilled_large.1.png
diff --git a/.../UpdateMasterPasswordViewTests/test_snapshot_weakPassword_withFilled_dark.1.png b/.../UpdateMasterPasswordViewTests/test_snapshot_weakPassword_withFilled_dark.1.png
diff --git a/...dateMasterPasswordViewTests/test_snapshot_weakPassword_withFilled_default.1.png b/...dateMasterPasswordViewTests/test_snapshot_weakPassword_withFilled_default.1.png
diff --git a/...UpdateMasterPasswordViewTests/test_snapshot_weakPassword_withFilled_large.1.png b/...UpdateMasterPasswordViewTests/test_snapshot_weakPassword_withFilled_large.1.png
diff --git a/...ultUnlock/__Snapshots__/VaultUnlockViewTests/test_snapshot_profilesClosed.1.png b/...ultUnlock/__Snapshots__/VaultUnlockViewTests/test_snapshot_profilesClosed.1.png
diff --git a/...ltUnlock/__Snapshots__/VaultUnlockViewTests/test_snapshot_profilesVisible.1.png b/...ltUnlock/__Snapshots__/VaultUnlockViewTests/test_snapshot_profilesVisible.1.png
diff --git a/...VaultUnlockViewTests/test_snapshot_shouldShowPasswordOrPinFields_true_pin.1.png b/...VaultUnlockViewTests/test_snapshot_shouldShowPasswordOrPinFields_true_pin.1.png
diff --git a/...Unlock/__Snapshots__/VaultUnlockViewTests/test_snapshot_vaultUnlock_empty.1.png b/...Unlock/__Snapshots__/VaultUnlockViewTests/test_snapshot_vaultUnlock_empty.1.png
diff --git a/...Snapshots__/VaultUnlockViewTests/test_snapshot_vaultUnlock_passwordHidden.1.png b/...Snapshots__/VaultUnlockViewTests/test_snapshot_vaultUnlock_passwordHidden.1.png
diff --git a/...apshots__/VaultUnlockViewTests/test_snapshot_vaultUnlock_passwordRevealed.1.png b/...apshots__/VaultUnlockViewTests/test_snapshot_vaultUnlock_passwordRevealed.1.png
diff --git a/...ts__/VaultUnlockViewTests/test_snapshot_vaultUnlock_withBiometrics_faceId.1.png b/...ts__/VaultUnlockViewTests/test_snapshot_vaultUnlock_withBiometrics_faceId.1.png
diff --git a/...aultUnlockViewTests/test_snapshot_vaultUnlock_withBiometrics_notAvailable.1.png b/...aultUnlockViewTests/test_snapshot_vaultUnlock_withBiometrics_notAvailable.1.png
diff --git a/...s__/VaultUnlockViewTests/test_snapshot_vaultUnlock_withBiometrics_touchId.1.png b/...s__/VaultUnlockViewTests/test_snapshot_vaultUnlock_withBiometrics_touchId.1.png
diff --git a/BitwardenShared/UI/Platform/Application/Appearance/Modifiers/ImageStyle.swift b/BitwardenShared/UI/Platform/Application/Appearance/Modifiers/ImageStyle.swift
@@ -26,9 +26,16 @@ extension ImageStyle {
     /// An `ImageStyle` for applying common properties to a circular accessory icon.
     ///
     /// - Size: 16x16pt
-    /// - Color: `Asset.Colors.iconSecondary`
+    /// - Color: `Asset.Colors.iconPrimary`
+    ///
+    static let accessoryIcon16 = accessoryIcon16()
+
+    /// An `ImageStyle` for applying common properties to a circular accessory icon.
+    ///
+    /// - Size: 24x24pt
+    /// - Color: `Asset.Colors.iconPrimary`
     ///
-    static let accessoryIcon = accessoryIcon()
+    static let accessoryIcon24 = accessoryIcon24()
 
     /// An `ImageStyle` for applying common properties for icons within a row.
     ///
@@ -55,16 +62,32 @@ extension ImageStyle {
     /// - Color: Defaults to `Asset.Colors.iconSecondary`
     ///
     /// - Parameters:
-    ///   - color: The foreground color of the image. Defaults to `Asset.Colors.iconSecondary`.
+    ///   - color: The foreground color of the image. Defaults to `Asset.Colors.iconPrimary`.
     ///   - scaleWithFont: Whether the image should scale with font size changes.
     ///
-    static func accessoryIcon(
-        color: Color = Asset.Colors.iconSecondary.swiftUIColor,
+    static func accessoryIcon16(
+        color: Color = Asset.Colors.iconPrimary.swiftUIColor,
         scaleWithFont: Bool = false
     ) -> ImageStyle {
         ImageStyle(color: color, scaleWithFont: scaleWithFont, width: 16, height: 16)
     }
 
+    /// An `ImageStyle` for applying common properties to a circular accessory icon.
+    ///
+    /// - Size: 24x24pt
+    /// - Color: Defaults to `Asset.Colors.iconSecondary`
+    ///
+    /// - Parameters:
+    ///   - color: The foreground color of the image. Defaults to `Asset.Colors.iconPrimary`.
+    ///   - scaleWithFont: Whether the image should scale with font size changes.
+    ///
+    static func accessoryIcon24(
+        color: Color = Asset.Colors.iconPrimary.swiftUIColor,
+        scaleWithFont: Bool = false
+    ) -> ImageStyle {
+        ImageStyle(color: color, scaleWithFont: scaleWithFont, width: 24, height: 24)
+    }
+
     /// An `ImageStyle` for applying common properties for icons within a row.
     ///
     /// - Size: 22x22pt

diff --git a/BitwardenShared/UI/Platform/Application/Appearance/Styles/AccessoryButtonStyle.swift b/BitwardenShared/UI/Platform/Application/Appearance/Styles/AccessoryButtonStyle.swift
@@ -7,12 +7,10 @@ import SwiftUI
 struct AccessoryButtonStyle: ButtonStyle {
     func makeBody(configuration: Configuration) -> some View {
         configuration.label
-            .frame(width: 14, height: 14)
-            .padding(10)
-            .foregroundColor(Asset.Colors.iconSecondary.swiftUIColor)
-            .background(Asset.Colors.Legacy.fillTertiary.swiftUIColor)
-            .clipShape(Circle())
+            .frame(width: 24, height: 24)
+            .foregroundColor(Asset.Colors.iconPrimary.swiftUIColor)
             .opacity(configuration.isPressed ? 0.5 : 1)
+            .contentShape(Rectangle())
     }
 }
 
@@ -31,14 +29,14 @@ extension ButtonStyle where Self == AccessoryButtonStyle {
 #if DEBUG
 #Preview("Enabled") {
     Button {} label: {
-        Asset.Images.copy16.swiftUIImage
+        Asset.Images.copy24.swiftUIImage
     }
     .buttonStyle(.accessory)
 }
 
 #Preview("Disabled") {
     Button {} label: {
-        Asset.Images.copy16.swiftUIImage
+        Asset.Images.copy24.swiftUIImage
     }
     .buttonStyle(.accessory)
     .disabled(true)

diff --git a/...ssets/Icons/copy16.imageset/Contents.json → ...ets/Icons/camera24.imageset/Contents.json b/...ssets/Icons/copy16.imageset/Contents.json → ...ets/Icons/camera24.imageset/Contents.json
@@ -1,7 +1,7 @@
 {
   "images" : [
     {
-      "filename" : "copy16.pdf",
+      "filename" : "camera24.pdf",
       "idiom" : "universal"
     }
   ],

diff --git a/.../check-circle16.imageset/check-circle.pdf → ...sets/Icons/camera24.imageset/camera24.pdf b/.../check-circle16.imageset/check-circle.pdf → ...sets/Icons/camera24.imageset/camera24.pdf
diff --git a/BitwardenShared/UI/Platform/Application/Support/Images.xcassets/Icons/cog16.imageset/cog.pdf b/BitwardenShared/UI/Platform/Application/Support/Images.xcassets/Icons/cog16.imageset/cog.pdf
diff --git a/...assets/Icons/eye16.imageset/Contents.json → ...assets/Icons/cog24.imageset/Contents.json b/...assets/Icons/eye16.imageset/Contents.json → ...assets/Icons/cog24.imageset/Contents.json
@@ -1,7 +1,7 @@
 {
   "images" : [
     {
-      "filename" : "eye16.pdf",
+      "filename" : "cog24.pdf",
       "idiom" : "universal"
     }
   ],

diff --git a/...rdenShared/UI/Platform/Application/Support/Images.xcassets/Icons/cog24.imageset/cog24.pdf b/...rdenShared/UI/Platform/Application/Support/Images.xcassets/Icons/cog24.imageset/cog24.pdf
diff --git a/.../Icons/eye-slash16.imageset/Contents.json → .../Icons/eye-slash24.imageset/Contents.json b/.../Icons/eye-slash16.imageset/Contents.json → .../Icons/eye-slash24.imageset/Contents.json
@@ -1,7 +1,7 @@
 {
   "images" : [
     {
-      "filename" : "eye-slash16.pdf",
+      "filename" : "eye-slash24.pdf",
       "idiom" : "universal"
     }
   ],

diff --git a/...cons/eye-slash16.imageset/eye-slash16.pdf → ...cons/eye-slash24.imageset/eye-slash24.pdf b/...cons/eye-slash16.imageset/eye-slash16.pdf → ...cons/eye-slash24.imageset/eye-slash24.pdf
diff --git a/...rdenShared/UI/Platform/Application/Support/Images.xcassets/Icons/eye16.imageset/eye16.pdf b/...rdenShared/UI/Platform/Application/Support/Images.xcassets/Icons/eye16.imageset/eye16.pdf
diff --git a/...assets/Icons/cog16.imageset/Contents.json → ...assets/Icons/eye24.imageset/Contents.json b/...assets/Icons/cog16.imageset/Contents.json → ...assets/Icons/eye24.imageset/Contents.json
@@ -1,7 +1,7 @@
 {
   "images" : [
     {
-      "filename" : "cog.pdf",
+      "filename" : "eye24.pdf",
       "idiom" : "universal"
     }
   ],

diff --git a/...xcassets/Icons/copy16.imageset/copy16.pdf → ...s.xcassets/Icons/eye24.imageset/eye24.pdf b/...xcassets/Icons/copy16.imageset/copy16.pdf → ...s.xcassets/Icons/eye24.imageset/eye24.pdf
diff --git a/.../Platform/Application/Support/Images.xcassets/Icons/minus-circle16.imageset/Contents.json b/.../Platform/Application/Support/Images.xcassets/Icons/minus-circle16.imageset/Contents.json
diff --git a/...ons/check-circle16.imageset/Contents.json → ...ons/minus-circle24.imageset/Contents.json b/...ons/check-circle16.imageset/Contents.json → ...ons/minus-circle24.imageset/Contents.json
@@ -1,7 +1,7 @@
 {
   "images" : [
     {
-      "filename" : "check-circle.pdf",
+      "filename" : "minus-circle24.pdf",
       "idiom" : "universal"
     }
   ],

diff --git a/.../minus-circle16.imageset/minus-circle.pdf → ...inus-circle24.imageset/minus-circle24.pdf b/.../minus-circle16.imageset/minus-circle.pdf → ...inus-circle24.imageset/minus-circle24.pdf
diff --git a/BitwardenShared/UI/Platform/Application/Views/AccessoryButton.swift b/BitwardenShared/UI/Platform/Application/Views/AccessoryButton.swift
@@ -35,7 +35,7 @@ struct AccessoryButton: View {
             AsyncButton(action: action) {
                 asset.swiftUIImage
                     .resizable()
-                    .frame(width: 16, height: 16)
+                    .frame(width: 24, height: 24)
             }
             .buttonStyle(.accessory)
             .accessibilityLabel(Text(accessibilityLabel))
@@ -44,7 +44,7 @@ struct AccessoryButton: View {
             Button(action: action) {
                 asset.swiftUIImage
                     .resizable()
-                    .frame(width: 16, height: 16)
+                    .frame(width: 24, height: 24)
             }
             .buttonStyle(.accessory)
             .accessibilityLabel(Text(accessibilityLabel))
@@ -95,5 +95,5 @@ struct AccessoryButton: View {
 // MARK: Previews
 
 #Preview {
-    AccessoryButton(asset: Asset.Images.copy16, accessibilityLabel: Localizations.copy) {}
+    AccessoryButton(asset: Asset.Images.copy24, accessibilityLabel: Localizations.copy) {}
 }
diff --git a/BitwardenShared/UI/Platform/Application/Views/ActionCard.swift b/BitwardenShared/UI/Platform/Application/Views/ActionCard.swift
@@ -73,7 +73,7 @@ struct ActionCard<LeadingContent: View>: View {
                 if let dismissButtonState {
                     AsyncButton(action: dismissButtonState.action) {
                         Image(asset: Asset.Images.close16, label: Text(dismissButtonState.title))
-                            .imageStyle(.accessoryIcon(color: Asset.Colors.iconPrimary.swiftUIColor))
+                            .imageStyle(.accessoryIcon16(color: Asset.Colors.iconPrimary.swiftUIColor))
                             .padding(16) // Add padding to increase tappable area...
                     }
                     .padding(-16) // ...but remove it to not affect layout.

diff --git a/BitwardenShared/UI/Platform/Application/Views/BitwardenField.swift b/BitwardenShared/UI/Platform/Application/Views/BitwardenField.swift
@@ -16,7 +16,7 @@ struct BitwardenField<Content, AccessoryContent>: View where Content: View, Acce
     /// The (optional) footer to display underneath the field.
     var footer: String?
 
-    /// The (optional) accessibility identifier to apply to the fooder of the field (if it exists).
+    /// The (optional) accessibility identifier to apply to the footer of the field (if it exists).
     var footerAccessibilityIdentifier: String?
 
     /// The vertical padding to apply around `content`. Defaults to `8`.
@@ -32,35 +32,14 @@ struct BitwardenField<Content, AccessoryContent>: View where Content: View, Acce
     // MARK: View
 
     var body: some View {
-        VStack(alignment: .leading, spacing: 8) {
-            if let title {
-                Text(title)
-                    .styleGuide(.subheadline, weight: .semibold)
-                    .foregroundColor(Asset.Colors.textSecondary.swiftUIColor)
-                    .accessibilityIdentifier(titleAccessibilityIdentifier ?? title)
-            }
-
-            HStack(spacing: 8) {
-                content
-                    .frame(maxWidth: .infinity, minHeight: 28, alignment: .leading)
-                    .padding(.horizontal, 16)
-                    .padding(.vertical, verticalPadding)
-                    .background(Asset.Colors.backgroundSecondary.swiftUIColor)
-                    .clipShape(RoundedRectangle(cornerRadius: 10))
-
-                if let accessoryContent {
-                    accessoryContent
-                        .buttonStyle(.accessory)
-                }
-            }
+        VStack(alignment: .leading, spacing: 0) {
+            contentView()
 
-            if let footer {
-                Text(footer)
-                    .styleGuide(.footnote)
-                    .foregroundColor(Asset.Colors.textSecondary.swiftUIColor)
-                    .accessibilityIdentifier(footerAccessibilityIdentifier ?? footer)
-            }
+            footerView()
         }
+        .padding(.horizontal, 16)
+        .background(Asset.Colors.backgroundSecondary.swiftUIColor)
+        .clipShape(RoundedRectangle(cornerRadius: 8))
     }
 
     // MARK: Initialization
@@ -73,7 +52,7 @@ struct BitwardenField<Content, AccessoryContent>: View where Content: View, Acce
     ///     to the title of the field (if it exists)
     ///   - footer: The (optional) footer to display underneath the field.
     ///   - footerAccessibilityIdentifier: The (optional) accessibility identifier to apply
-    ///     to the fooder of the field (if it exists)
+    ///     to the footer of the field (if it exists)
     ///   - verticalPadding: The vertical padding to apply around `content`. Defaults to `8`.
     ///   - content: The content that should be displayed in the field.
     ///   - accessoryContent: Any accessory content that should be displayed on the trailing edge of
@@ -96,6 +75,56 @@ struct BitwardenField<Content, AccessoryContent>: View where Content: View, Acce
         self.content = content()
         self.accessoryContent = accessoryContent()
     }
+
+    // MARK: Private
+
+    /// The main content for the view, containing the title and value.
+    @ViewBuilder
+    private func contentView() -> some View {
+        HStack(spacing: 8) {
+            VStack(alignment: .leading, spacing: 2) {
+                if let title {
+                    Text(title)
+                        .styleGuide(
+                            .subheadline,
+                            weight: .semibold,
+                            includeLinePadding: false,
+                            includeLineSpacing: false
+                        )
+                        .foregroundColor(Asset.Colors.textSecondary.swiftUIColor)
+                        .accessibilityIdentifier(titleAccessibilityIdentifier ?? title)
+                }
+
+                content
+                    .frame(maxWidth: .infinity, alignment: .leading)
+            }
+
+            if let accessoryContent {
+                HStack(spacing: 16) {
+                    accessoryContent
+                        .buttonStyle(.accessory)
+                }
+            }
+        }
+        .padding(.vertical, 12)
+        .frame(minHeight: 64)
+    }
+
+    /// The view to display at the footer below the main content.
+    @ViewBuilder
+    private func footerView() -> some View {
+        if let footer {
+            VStack(alignment: .leading, spacing: 0) {
+                Divider()
+
+                Text(footer)
+                    .styleGuide(.footnote, includeLinePadding: false, includeLineSpacing: false)
+                    .foregroundColor(Asset.Colors.textSecondary.swiftUIColor)
+                    .accessibilityIdentifier(footerAccessibilityIdentifier ?? footer)
+                    .padding(.vertical, 12)
+            }
+        }
+    }
 }
 
 extension BitwardenField where AccessoryContent == EmptyView {
@@ -107,7 +136,7 @@ extension BitwardenField where AccessoryContent == EmptyView {
     ///     to the title of the field (if it exists)
     ///   - footer: The (optional) footer to display underneath the field.
     ///   - footerAccessibilityIdentifier: The (optional) accessibility identifier to apply
-    ///     to the fooder of the field (if it exists)
+    ///     to the footer of the field (if it exists)
     ///   - verticalPadding: The vertical padding to apply around `content`. Defaults to `8`.
     ///   - content: The content that should be displayed in the field.
     ///
@@ -128,3 +157,23 @@ extension BitwardenField where AccessoryContent == EmptyView {
         accessoryContent = nil
     }
 }
+
+// MARK: Previews
+
+#if DEBUG
+#Preview {
+    VStack {
+        BitwardenField(title: "Title") {
+            Text("Value")
+                .styleGuide(.body)
+                .foregroundStyle(Asset.Colors.textPrimary.swiftUIColor)
+        }
+
+        BitwardenField(title: "Title", footer: "Footer") {
+            Text("Value")
+        }
+    }
+    .padding()
+    .background(Asset.Colors.backgroundPrimary.swiftUIColor)
+}
+#endif