From 211451d234edc08944adfe8d459d79fec7a19267 Mon Sep 17 00:00:00 2001
From: Ben <45583362+ben-basten@users.noreply.github.com>
Date: Fri, 14 Jun 2024 07:32:41 +0000
Subject: [PATCH] chore(web): standardize settings labels (#10303)

* chore(web): standardize settings labels

- spelling out "max" and "min" in full
- accordions use title case
- labels for settings all use sentence case
- remove the "Enable"/"Enabled"/"ENABLED" titles for toggles, in favor
  of just using the description
- change any gray labels to be immich blue, to match the look and feel
  of the other settings

* chore: update user settings toggle, remove unused "enable" strings
---
 .../settings/auth/auth-settings.svelte        |  6 +-
 .../settings/ffmpeg/ffmpeg-settings.svelte    | 38 ++++++------
 .../settings/image/image-settings.svelte      | 14 ++---
 .../library-settings/library-settings.svelte  | 13 +++--
 .../logging-settings/logging-settings.svelte  |  5 +-
 .../machine-learning-settings.svelte          | 22 +++----
 .../settings/map-settings/map-settings.svelte | 10 +---
 .../new-version-check-settings.svelte         |  3 +-
 .../notification-settings.svelte              |  3 +-
 .../settings/server/server-settings.svelte    |  4 +-
 .../storage-template-settings.svelte          | 11 ++--
 .../trash-settings/trash-settings.svelte      |  7 +--
 .../user-settings/user-settings.svelte        |  2 +-
 .../settings/setting-checkboxes.svelte        |  4 +-
 .../settings/setting-textarea.svelte          |  2 +-
 .../change-password-settings.svelte           |  6 +-
 .../notifications-settings.svelte             |  3 +-
 .../user-profile-settings.svelte              | 12 ++--
 web/src/lib/i18n/en.json                      | 58 ++++++++++---------
 19 files changed, 105 insertions(+), 118 deletions(-)

diff --git a/web/src/lib/components/admin-page/settings/auth/auth-settings.svelte b/web/src/lib/components/admin-page/settings/auth/auth-settings.svelte
index 7b3cb72977..6eb1ab2200 100644
--- a/web/src/lib/components/admin-page/settings/auth/auth-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/auth/auth-settings.svelte
@@ -88,8 +88,7 @@
 
             <SettingSwitch
               {disabled}
-              title={$t('enable').toUpperCase()}
-              subtitle={$t('admin.oauth_enable_description')}
+              title={$t('admin.oauth_enable_description')}
               bind:checked={config.oauth.enabled}
             />
 
@@ -223,9 +222,8 @@
           <div class="ml-4 mt-4 flex flex-col gap-4">
             <div class="ml-4 mt-4 flex flex-col">
               <SettingSwitch
-                title={$t('enabled')}
+                title={$t('admin.password_enable_description')}
                 {disabled}
-                subtitle={$t('admin.password_enable_description')}
                 bind:checked={config.passwordLogin.enabled}
               />
             </div>
diff --git a/web/src/lib/components/admin-page/settings/ffmpeg/ffmpeg-settings.svelte b/web/src/lib/components/admin-page/settings/ffmpeg/ffmpeg-settings.svelte
index ac2d354523..2573b01b8a 100644
--- a/web/src/lib/components/admin-page/settings/ffmpeg/ffmpeg-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/ffmpeg/ffmpeg-settings.svelte
@@ -82,7 +82,7 @@
         />
 
         <SettingSelect
-          label={$t('admin.transcoding_audio_codec').toUpperCase()}
+          label={$t('admin.transcoding_audio_codec')}
           {disabled}
           desc={$t('admin.transcoding_audio_codec_description')}
           bind:value={config.ffmpeg.targetAudioCodec}
@@ -100,7 +100,7 @@
         />
 
         <SettingCheckboxes
-          label={$t('admin.transcoding_accepted_audio_codecs').toUpperCase()}
+          label={$t('admin.transcoding_accepted_audio_codecs')}
           {disabled}
           desc={$t('admin.transcoding_accepted_audio_codecs_description')}
           bind:value={config.ffmpeg.acceptedAudioCodecs}
@@ -114,7 +114,7 @@
         />
 
         <SettingSelect
-          label={$t('admin.transcoding_video_codec').toUpperCase()}
+          label={$t('admin.transcoding_video_codec')}
           {disabled}
           desc={$t('admin.transcoding_video_codec_description')}
           bind:value={config.ffmpeg.targetVideoCodec}
@@ -130,7 +130,7 @@
         />
 
         <SettingCheckboxes
-          label={$t('admin.transcoding_accepted_video_codecs').toUpperCase()}
+          label={$t('admin.transcoding_accepted_video_codecs')}
           {disabled}
           desc={$t('admin.transcoding_accepted_video_codecs_description')}
           bind:value={config.ffmpeg.acceptedVideoCodecs}
@@ -145,7 +145,7 @@
         />
 
         <SettingSelect
-          label={$t('admin.transcoding_target_resolution').toUpperCase()}
+          label={$t('admin.transcoding_target_resolution')}
           {disabled}
           desc={$t('admin.transcoding_target_resolution_description')}
           bind:value={config.ffmpeg.targetResolution}
@@ -164,7 +164,7 @@
         <SettingInputField
           inputType={SettingInputFieldType.TEXT}
           {disabled}
-          label={$t('admin.transcoding_max_bitrate').toUpperCase()}
+          label={$t('admin.transcoding_max_bitrate')}
           desc={$t('admin.transcoding_max_bitrate_description')}
           bind:value={config.ffmpeg.maxBitrate}
           isEdited={config.ffmpeg.maxBitrate !== savedConfig.ffmpeg.maxBitrate}
@@ -173,14 +173,14 @@
         <SettingInputField
           inputType={SettingInputFieldType.NUMBER}
           {disabled}
-          label={$t('admin.transcoding_threads').toUpperCase()}
+          label={$t('admin.transcoding_threads')}
           desc={$t('admin.transcoding_threads_description')}
           bind:value={config.ffmpeg.threads}
           isEdited={config.ffmpeg.threads !== savedConfig.ffmpeg.threads}
         />
 
         <SettingSelect
-          label={$t('admin.transcoding_transcode_policy').toUpperCase()}
+          label={$t('admin.transcoding_transcode_policy')}
           {disabled}
           desc={$t('admin.transcoding_transcode_policy_description')}
           bind:value={config.ffmpeg.transcode}
@@ -208,7 +208,7 @@
         />
 
         <SettingSelect
-          label={$t('admin.transcoding_tone_mapping').toUpperCase()}
+          label={$t('admin.transcoding_tone_mapping')}
           {disabled}
           desc={$t('admin.transcoding_tone_mapping_description')}
           bind:value={config.ffmpeg.tonemap}
@@ -235,7 +235,7 @@
         />
 
         <SettingSwitch
-          title={$t('admin.transcoding_two_pass_encoding').toUpperCase()}
+          title={$t('admin.transcoding_two_pass_encoding')}
           {disabled}
           subtitle={$t('admin.transcoding_two_pass_encoding_setting_description')}
           bind:checked={config.ffmpeg.twoPass}
@@ -249,7 +249,7 @@
         >
           <div class="ml-4 mt-4 flex flex-col gap-4">
             <SettingSelect
-              label={$t('admin.transcoding_acceleration_api').toUpperCase()}
+              label={$t('admin.transcoding_acceleration_api')}
               {disabled}
               desc={$t('admin.transcoding_acceleration_api_description')}
               bind:value={config.ffmpeg.accel}
@@ -277,7 +277,7 @@
             />
 
             <SettingSwitch
-              title={$t('admin.transcoding_hardware_decoding').toUpperCase()}
+              title={$t('admin.transcoding_hardware_decoding')}
               {disabled}
               subtitle={$t('admin.transcoding_hardware_decoding_setting_description')}
               bind:checked={config.ffmpeg.accelDecode}
@@ -285,7 +285,7 @@
             />
 
             <SettingSelect
-              label={$t('admin.transcoding_constant_quality_mode').toUpperCase()}
+              label={$t('admin.transcoding_constant_quality_mode')}
               desc={$t('admin.transcoding_constant_quality_mode_description')}
               bind:value={config.ffmpeg.cqMode}
               options={[
@@ -298,7 +298,7 @@
             />
 
             <SettingSwitch
-              title={$t('admin.transcoding_temporal_aq').toUpperCase()}
+              title={$t('admin.transcoding_temporal_aq')}
               {disabled}
               subtitle={$t('admin.transcoding_temporal_aq_description')}
               bind:checked={config.ffmpeg.temporalAQ}
@@ -307,7 +307,7 @@
 
             <SettingInputField
               inputType={SettingInputFieldType.TEXT}
-              label={$t('admin.transcoding_preferred_hardware_device').toUpperCase()}
+              label={$t('admin.transcoding_preferred_hardware_device')}
               desc={$t('admin.transcoding_preferred_hardware_device_description')}
               bind:value={config.ffmpeg.preferredHwDevice}
               isEdited={config.ffmpeg.preferredHwDevice !== savedConfig.ffmpeg.preferredHwDevice}
@@ -324,7 +324,7 @@
           <div class="ml-4 mt-4 flex flex-col gap-4">
             <SettingInputField
               inputType={SettingInputFieldType.NUMBER}
-              label={$t('admin.transcoding_tone_mapping_npl').toUpperCase()}
+              label={$t('admin.transcoding_tone_mapping_npl')}
               desc={$t('admin.transcoding_tone_mapping_npl_description')}
               bind:value={config.ffmpeg.npl}
               isEdited={config.ffmpeg.npl !== savedConfig.ffmpeg.npl}
@@ -333,7 +333,7 @@
 
             <SettingInputField
               inputType={SettingInputFieldType.NUMBER}
-              label={$t('admin.transcoding_max_b_frames').toUpperCase()}
+              label={$t('admin.transcoding_max_b_frames')}
               desc={$t('admin.transcoding_max_b_frames_description')}
               bind:value={config.ffmpeg.bframes}
               isEdited={config.ffmpeg.bframes !== savedConfig.ffmpeg.bframes}
@@ -342,7 +342,7 @@
 
             <SettingInputField
               inputType={SettingInputFieldType.NUMBER}
-              label={$t('admin.transcoding_reference_frames').toUpperCase()}
+              label={$t('admin.transcoding_reference_frames')}
               desc={$t('admin.transcoding_reference_frames_description')}
               bind:value={config.ffmpeg.refs}
               isEdited={config.ffmpeg.refs !== savedConfig.ffmpeg.refs}
@@ -351,7 +351,7 @@
 
             <SettingInputField
               inputType={SettingInputFieldType.NUMBER}
-              label={$t('admin.transcoding_max_keyframe_interval').toUpperCase()}
+              label={$t('admin.transcoding_max_keyframe_interval')}
               desc={$t('admin.transcoding_max_keyframe_interval_description')}
               bind:value={config.ffmpeg.gopSize}
               isEdited={config.ffmpeg.gopSize !== savedConfig.ffmpeg.gopSize}
diff --git a/web/src/lib/components/admin-page/settings/image/image-settings.svelte b/web/src/lib/components/admin-page/settings/image/image-settings.svelte
index d6d4bbb2f0..edf0d42896 100644
--- a/web/src/lib/components/admin-page/settings/image/image-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/image/image-settings.svelte
@@ -26,7 +26,7 @@
     <form autocomplete="off" on:submit|preventDefault>
       <div class="ml-4 mt-4 flex flex-col gap-4">
         <SettingSelect
-          label={$t('admin.image_thumbnail_format').toUpperCase()}
+          label={$t('admin.image_thumbnail_format')}
           desc={$t('admin.image_format_description')}
           bind:value={config.image.thumbnailFormat}
           options={[
@@ -39,7 +39,7 @@
         />
 
         <SettingSelect
-          label={$t('admin.image_thumbnail_resolution').toUpperCase()}
+          label={$t('admin.image_thumbnail_resolution')}
           desc={$t('admin.image_thumbnail_resolution_description')}
           number
           bind:value={config.image.thumbnailSize}
@@ -56,7 +56,7 @@
         />
 
         <SettingSelect
-          label={$t('admin.image_preview_format').toUpperCase()}
+          label={$t('admin.image_preview_format')}
           desc={$t('admin.image_format_description')}
           bind:value={config.image.previewFormat}
           options={[
@@ -69,7 +69,7 @@
         />
 
         <SettingSelect
-          label={$t('admin.image_preview_resolution').toUpperCase()}
+          label={$t('admin.image_preview_resolution')}
           desc={$t('admin.image_preview_resolution_description')}
           number
           bind:value={config.image.previewSize}
@@ -86,7 +86,7 @@
 
         <SettingInputField
           inputType={SettingInputFieldType.NUMBER}
-          label={$t('admin.image_quality').toUpperCase()}
+          label={$t('admin.image_quality')}
           desc={$t('admin.image_quality_description')}
           bind:value={config.image.quality}
           isEdited={config.image.quality !== savedConfig.image.quality}
@@ -94,7 +94,7 @@
         />
 
         <SettingSwitch
-          title={$t('admin.image_prefer_wide_gamut').toUpperCase()}
+          title={$t('admin.image_prefer_wide_gamut')}
           subtitle={$t('admin.image_prefer_wide_gamut_setting_description')}
           checked={config.image.colorspace === Colorspace.P3}
           on:toggle={(e) => (config.image.colorspace = e.detail ? Colorspace.P3 : Colorspace.Srgb)}
@@ -103,7 +103,7 @@
         />
 
         <SettingSwitch
-          title={$t('admin.image_prefer_embedded_preview').toUpperCase()}
+          title={$t('admin.image_prefer_embedded_preview')}
           subtitle={$t('admin.image_prefer_embedded_preview_setting_description')}
           checked={config.image.extractEmbedded}
           on:toggle={() => (config.image.extractEmbedded = !config.image.extractEmbedded)}
diff --git a/web/src/lib/components/admin-page/settings/library-settings/library-settings.svelte b/web/src/lib/components/admin-page/settings/library-settings/library-settings.svelte
index 751440baf4..1389de1dd4 100644
--- a/web/src/lib/components/admin-page/settings/library-settings/library-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/library-settings/library-settings.svelte
@@ -38,9 +38,8 @@
       <form autocomplete="off" on:submit|preventDefault>
         <div class="ml-4 mt-4 flex flex-col gap-4">
           <SettingSwitch
-            title={$t('enable')}
+            title={$t('admin.library_watching_enable_description')}
             {disabled}
-            subtitle={$t('admin.library_watching_enable_description')}
             bind:checked={config.library.watch.enabled}
           />
         </div>
@@ -65,14 +64,18 @@
       <form autocomplete="off" on:submit|preventDefault>
         <div class="ml-4 mt-4 flex flex-col gap-4">
           <SettingSwitch
-            title={$t('enabled').toUpperCase()}
+            title={$t('admin.library_scanning_enable_description')}
             {disabled}
-            subtitle={$t('admin.library_scanning_enable_description')}
             bind:checked={config.library.scan.enabled}
           />
 
           <div class="flex flex-col my-2 dark:text-immich-dark-fg">
-            <label class="text-sm" for="expression-select">{$t('admin.library_cron_expression_presets')}</label>
+            <label
+              class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm"
+              for="expression-select"
+            >
+              {$t('admin.library_cron_expression_presets')}
+            </label>
             <select
               class="p-2 mt-2 text-sm rounded-lg bg-slate-200 hover:cursor-pointer dark:bg-gray-600"
               disabled={disabled || !config.library.scan.enabled}
diff --git a/web/src/lib/components/admin-page/settings/logging-settings/logging-settings.svelte b/web/src/lib/components/admin-page/settings/logging-settings/logging-settings.svelte
index 3bf3d3709f..8f0de67f8e 100644
--- a/web/src/lib/components/admin-page/settings/logging-settings/logging-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/logging-settings/logging-settings.svelte
@@ -22,13 +22,12 @@
     <form autocomplete="off" on:submit|preventDefault>
       <div class="ml-4 mt-4 flex flex-col gap-4">
         <SettingSwitch
-          title={$t('enabled').toUpperCase()}
+          title={$t('admin.logging_enable_description')}
           {disabled}
-          subtitle={$t('admin.logging_enable_description')}
           bind:checked={config.logging.enabled}
         />
         <SettingSelect
-          label={$t('level').toUpperCase()}
+          label={$t('level')}
           desc={$t('admin.logging_level_description')}
           bind:value={config.logging.level}
           options={[
diff --git a/web/src/lib/components/admin-page/settings/machine-learning-settings/machine-learning-settings.svelte b/web/src/lib/components/admin-page/settings/machine-learning-settings/machine-learning-settings.svelte
index 9f4071a9df..60f8241a41 100644
--- a/web/src/lib/components/admin-page/settings/machine-learning-settings/machine-learning-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/machine-learning-settings/machine-learning-settings.svelte
@@ -27,7 +27,7 @@
     <form autocomplete="off" on:submit|preventDefault class="mx-4 mt-4">
       <div class="flex flex-col gap-4">
         <SettingSwitch
-          title={$t('enabled').toUpperCase()}
+          title={$t('admin.machine_learning_enabled')}
           subtitle={$t('admin.machine_learning_enabled_description')}
           {disabled}
           bind:checked={config.machineLearning.enabled}
@@ -37,7 +37,7 @@
 
         <SettingInputField
           inputType={SettingInputFieldType.TEXT}
-          label={$t('url').toUpperCase()}
+          label={$t('url')}
           desc={$t('admin.machine_learning_url_description')}
           bind:value={config.machineLearning.url}
           required={true}
@@ -53,7 +53,7 @@
       >
         <div class="ml-4 mt-4 flex flex-col gap-4">
           <SettingSwitch
-            title={$t('enabled').toUpperCase()}
+            title={$t('admin.machine_learning_smart_search_enabled')}
             subtitle={$t('admin.machine_learning_smart_search_enabled_description')}
             bind:checked={config.machineLearning.clip.enabled}
             disabled={disabled || !config.machineLearning.enabled}
@@ -63,7 +63,7 @@
 
           <SettingInputField
             inputType={SettingInputFieldType.TEXT}
-            label={$t('admin.machine_learning_clip_model').toUpperCase()}
+            label={$t('admin.machine_learning_clip_model')}
             bind:value={config.machineLearning.clip.modelName}
             required={true}
             disabled={disabled || !config.machineLearning.enabled || !config.machineLearning.clip.enabled}
@@ -84,7 +84,7 @@
       >
         <div class="ml-4 mt-4 flex flex-col gap-4">
           <SettingSwitch
-            title={$t('enabled').toUpperCase()}
+            title={$t('admin.machine_learning_duplicate_detection_enabled')}
             subtitle={$t('admin.machine_learning_duplicate_detection_enabled_description')}
             bind:checked={config.machineLearning.duplicateDetection.enabled}
             disabled={disabled || !config.machineLearning.enabled || !config.machineLearning.clip.enabled}
@@ -94,7 +94,7 @@
 
           <SettingInputField
             inputType={SettingInputFieldType.NUMBER}
-            label={$t('admin.machine_learning_max_detection_distance').toUpperCase()}
+            label={$t('admin.machine_learning_max_detection_distance')}
             bind:value={config.machineLearning.duplicateDetection.maxDistance}
             step="0.0005"
             min={0.001}
@@ -114,7 +114,7 @@
       >
         <div class="ml-4 mt-4 flex flex-col gap-4">
           <SettingSwitch
-            title={$t('enabled').toUpperCase()}
+            title={$t('admin.machine_learning_facial_recognition_setting')}
             subtitle={$t('admin.machine_learning_facial_recognition_setting_description')}
             bind:checked={config.machineLearning.facialRecognition.enabled}
             disabled={disabled || !config.machineLearning.enabled}
@@ -123,7 +123,7 @@
           <hr />
 
           <SettingSelect
-            label={$t('admin.machine_learning_facial_recognition_model').toUpperCase()}
+            label={$t('admin.machine_learning_facial_recognition_model')}
             desc={$t('admin.machine_learning_facial_recognition_model_description')}
             name="facial-recognition-model"
             bind:value={config.machineLearning.facialRecognition.modelName}
@@ -140,7 +140,7 @@
 
           <SettingInputField
             inputType={SettingInputFieldType.NUMBER}
-            label={$t('admin.machine_learning_min_detection_score').toUpperCase()}
+            label={$t('admin.machine_learning_min_detection_score')}
             desc={$t('admin.machine_learning_min_detection_score_description')}
             bind:value={config.machineLearning.facialRecognition.minScore}
             step="0.1"
@@ -153,7 +153,7 @@
 
           <SettingInputField
             inputType={SettingInputFieldType.NUMBER}
-            label={$t('admin.machine_learning_max_recognition_distance').toUpperCase()}
+            label={$t('admin.machine_learning_max_recognition_distance')}
             desc={$t('admin.machine_learning_max_recognition_distance_description')}
             bind:value={config.machineLearning.facialRecognition.maxDistance}
             step="0.1"
@@ -166,7 +166,7 @@
 
           <SettingInputField
             inputType={SettingInputFieldType.NUMBER}
-            label={$t('admin.machine_learning_min_recognized_faces').toUpperCase()}
+            label={$t('admin.machine_learning_min_recognized_faces')}
             desc={$t('admin.machine_learning_min_recognized_faces_description')}
             bind:value={config.machineLearning.facialRecognition.minFaces}
             step="1"
diff --git a/web/src/lib/components/admin-page/settings/map-settings/map-settings.svelte b/web/src/lib/components/admin-page/settings/map-settings/map-settings.svelte
index 1926eb6d02..e86ce50736 100644
--- a/web/src/lib/components/admin-page/settings/map-settings/map-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/map-settings/map-settings.svelte
@@ -26,12 +26,7 @@
       <div class="flex flex-col gap-4">
         <SettingAccordion key="map" title={$t('admin.map_settings')} subtitle={$t('admin.map_settings_description')}>
           <div class="ml-4 mt-4 flex flex-col gap-4">
-            <SettingSwitch
-              title={$t('enabled').toUpperCase()}
-              {disabled}
-              subtitle={$t('admin.map_enable_description')}
-              bind:checked={config.map.enabled}
-            />
+            <SettingSwitch title={$t('admin.map_enable_description')} {disabled} bind:checked={config.map.enabled} />
 
             <hr />
 
@@ -67,9 +62,8 @@
           </svelte:fragment>
           <div class="ml-4 mt-4 flex flex-col gap-4">
             <SettingSwitch
-              title={$t('enabled').toUpperCase()}
+              title={$t('admin.map_reverse_geocoding_enable_description')}
               {disabled}
-              subtitle={$t('admin.map_reverse_geocoding_enable_description')}
               bind:checked={config.reverseGeocoding.enabled}
             />
           </div></SettingAccordion
diff --git a/web/src/lib/components/admin-page/settings/new-version-check-settings/new-version-check-settings.svelte b/web/src/lib/components/admin-page/settings/new-version-check-settings/new-version-check-settings.svelte
index 6838e60b4e..8e25c12142 100644
--- a/web/src/lib/components/admin-page/settings/new-version-check-settings/new-version-check-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/new-version-check-settings/new-version-check-settings.svelte
@@ -21,8 +21,7 @@
     <form autocomplete="off" on:submit|preventDefault>
       <div class="ml-4 mt-4">
         <SettingSwitch
-          title={$t('enabled').toUpperCase()}
-          subtitle={$t('admin.version_check_enabled_description')}
+          title={$t('admin.version_check_enabled_description')}
           bind:checked={config.newVersionCheck.enabled}
           {disabled}
         />
diff --git a/web/src/lib/components/admin-page/settings/notification-settings/notification-settings.svelte b/web/src/lib/components/admin-page/settings/notification-settings/notification-settings.svelte
index bf7e336e52..d4dec560a1 100644
--- a/web/src/lib/components/admin-page/settings/notification-settings/notification-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/notification-settings/notification-settings.svelte
@@ -71,8 +71,7 @@
         <SettingAccordion key="email" title={$t('email')} subtitle={$t('admin.notification_email_setting_description')}>
           <div class="ml-4 mt-4 flex flex-col gap-4">
             <SettingSwitch
-              title={$t('enabled')}
-              subtitle={$t('admin.notification_enable_email_notifications')}
+              title={$t('admin.notification_enable_email_notifications')}
               {disabled}
               bind:checked={config.notifications.smtp.enabled}
             />
diff --git a/web/src/lib/components/admin-page/settings/server/server-settings.svelte b/web/src/lib/components/admin-page/settings/server/server-settings.svelte
index 53a45d1704..d80246f964 100644
--- a/web/src/lib/components/admin-page/settings/server/server-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/server/server-settings.svelte
@@ -24,7 +24,7 @@
       <div class="mt-4 ml-4">
         <SettingInputField
           inputType={SettingInputFieldType.TEXT}
-          label={$t('admin.server_external_domain_settings').toUpperCase()}
+          label={$t('admin.server_external_domain_settings')}
           desc={$t('admin.server_external_domain_settings_description')}
           bind:value={config.server.externalDomain}
           isEdited={config.server.externalDomain !== savedConfig.server.externalDomain}
@@ -32,7 +32,7 @@
 
         <SettingInputField
           inputType={SettingInputFieldType.TEXT}
-          label={$t('admin.server_welcome_message').toUpperCase()}
+          label={$t('admin.server_welcome_message')}
           desc={$t('admin.server_welcome_message_description')}
           bind:value={config.server.loginPageMessage}
           isEdited={config.server.loginPageMessage !== savedConfig.server.loginPageMessage}
diff --git a/web/src/lib/components/admin-page/settings/storage-template/storage-template-settings.svelte b/web/src/lib/components/admin-page/settings/storage-template/storage-template-settings.svelte
index fbbf6b7b68..246bf8fd6c 100644
--- a/web/src/lib/components/admin-page/settings/storage-template/storage-template-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/storage-template/storage-template-settings.svelte
@@ -108,16 +108,15 @@
   {#await getTemplateOptions() then}
     <div id="directory-path-builder" class="flex flex-col gap-4 {minified ? '' : 'ml-4 mt-4'}">
       <SettingSwitch
-        title={$t('enabled').toUpperCase()}
+        title={$t('admin.storage_template_enable_description')}
         {disabled}
-        subtitle={$t('admin.storage_template_enable_description')}
         bind:checked={config.storageTemplate.enabled}
         isEdited={!(config.storageTemplate.enabled === savedConfig.storageTemplate.enabled)}
       />
 
       {#if !minified}
         <SettingSwitch
-          title={$t('admin.storage_template_hash_verification_enabled').toUpperCase()}
+          title={$t('admin.storage_template_hash_verification_enabled')}
           {disabled}
           subtitle={$t('admin.storage_template_hash_verification_enabled_description')}
           bind:checked={config.storageTemplate.hashVerificationEnabled}
@@ -173,7 +172,9 @@
 
           <form autocomplete="off" class="flex flex-col" on:submit|preventDefault>
             <div class="flex flex-col my-2">
-              <label class="text-sm" for="preset-select">{$t('preset').toUpperCase()}</label>
+              <label class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm" for="preset-select">
+                {$t('preset')}
+              </label>
               <select
                 class="immich-form-input p-2 mt-2 text-sm rounded-lg bg-slate-200 hover:cursor-pointer dark:bg-gray-600"
                 disabled={disabled || !config.storageTemplate.enabled}
@@ -189,7 +190,7 @@
             </div>
             <div class="flex gap-2 align-bottom">
               <SettingInputField
-                label={$t('template').toUpperCase()}
+                label={$t('template')}
                 disabled={disabled || !config.storageTemplate.enabled}
                 required
                 inputType={SettingInputFieldType.TEXT}
diff --git a/web/src/lib/components/admin-page/settings/trash-settings/trash-settings.svelte b/web/src/lib/components/admin-page/settings/trash-settings/trash-settings.svelte
index d0c52e53f4..bf3b71ff26 100644
--- a/web/src/lib/components/admin-page/settings/trash-settings/trash-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/trash-settings/trash-settings.svelte
@@ -23,12 +23,7 @@
   <div in:fade={{ duration: 500 }}>
     <form autocomplete="off" on:submit|preventDefault>
       <div class="ml-4 mt-4 flex flex-col gap-4">
-        <SettingSwitch
-          title={$t('enabled').toUpperCase()}
-          {disabled}
-          subtitle={$t('admin.trash_enabled_description')}
-          bind:checked={config.trash.enabled}
-        />
+        <SettingSwitch title={$t('admin.trash_enabled_description')} {disabled} bind:checked={config.trash.enabled} />
 
         <hr />
 
diff --git a/web/src/lib/components/admin-page/settings/user-settings/user-settings.svelte b/web/src/lib/components/admin-page/settings/user-settings/user-settings.svelte
index cf20425a59..6d9df7a34c 100644
--- a/web/src/lib/components/admin-page/settings/user-settings/user-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/user-settings/user-settings.svelte
@@ -26,7 +26,7 @@
         <SettingInputField
           inputType={SettingInputFieldType.NUMBER}
           min={1}
-          label={$t('admin.user_delete_delay_settings').toUpperCase()}
+          label={$t('admin.user_delete_delay_settings')}
           desc={$t('admin.user_delete_delay_settings_description')}
           bind:value={config.user.deleteDelay}
           isEdited={config.user.deleteDelay !== savedConfig.user.deleteDelay}
diff --git a/web/src/lib/components/shared-components/settings/setting-checkboxes.svelte b/web/src/lib/components/shared-components/settings/setting-checkboxes.svelte
index 6d60133051..4e33efd571 100644
--- a/web/src/lib/components/shared-components/settings/setting-checkboxes.svelte
+++ b/web/src/lib/components/shared-components/settings/setting-checkboxes.svelte
@@ -18,7 +18,9 @@
 
 <div class="mb-4 w-full">
   <div class={`flex h-[26px] place-items-center gap-1`}>
-    <label class={`immich-form-label text-sm`} for="{name}-select">{label}</label>
+    <label class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm" for="{name}-select">
+      {label}
+    </label>
 
     {#if isEdited}
       <div
diff --git a/web/src/lib/components/shared-components/settings/setting-textarea.svelte b/web/src/lib/components/shared-components/settings/setting-textarea.svelte
index 99a672c472..038c7e81a1 100644
--- a/web/src/lib/components/shared-components/settings/setting-textarea.svelte
+++ b/web/src/lib/components/shared-components/settings/setting-textarea.svelte
@@ -16,7 +16,7 @@
 
 <div class="mb-4 w-full">
   <div class={`flex h-[26px] place-items-center gap-1`}>
-    <label class={`immich-form-label text-sm`} for={label}>{label}</label>
+    <label class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm" for={label}>{label}</label>
     {#if required}
       <div class="text-red-400">*</div>
     {/if}
diff --git a/web/src/lib/components/user-settings-page/change-password-settings.svelte b/web/src/lib/components/user-settings-page/change-password-settings.svelte
index cf7bc0a022..39fd78e037 100644
--- a/web/src/lib/components/user-settings-page/change-password-settings.svelte
+++ b/web/src/lib/components/user-settings-page/change-password-settings.svelte
@@ -45,7 +45,7 @@
       <div class="ml-4 mt-4 flex flex-col gap-4">
         <SettingInputField
           inputType={SettingInputFieldType.PASSWORD}
-          label={$t('password').toUpperCase()}
+          label={$t('password')}
           bind:value={password}
           required={true}
           passwordAutocomplete="current-password"
@@ -53,7 +53,7 @@
 
         <SettingInputField
           inputType={SettingInputFieldType.PASSWORD}
-          label={$t('new_password').toUpperCase()}
+          label={$t('new_password')}
           bind:value={newPassword}
           required={true}
           passwordAutocomplete="new-password"
@@ -61,7 +61,7 @@
 
         <SettingInputField
           inputType={SettingInputFieldType.PASSWORD}
-          label={$t('confirm_password').toUpperCase()}
+          label={$t('confirm_password')}
           bind:value={confirmPassword}
           required={true}
           passwordAutocomplete="new-password"
diff --git a/web/src/lib/components/user-settings-page/notifications-settings.svelte b/web/src/lib/components/user-settings-page/notifications-settings.svelte
index 6112f3efd6..ee6026c52b 100644
--- a/web/src/lib/components/user-settings-page/notifications-settings.svelte
+++ b/web/src/lib/components/user-settings-page/notifications-settings.svelte
@@ -45,8 +45,7 @@
       <div class="ml-4 mt-4 flex flex-col gap-4">
         <div class="ml-4">
           <SettingSwitch
-            title={$t('enable')}
-            subtitle={$t('notification_toggle_setting_description')}
+            title={$t('notification_toggle_setting_description')}
             bind:checked={emailNotificationsEnabled}
           />
         </div>
diff --git a/web/src/lib/components/user-settings-page/user-profile-settings.svelte b/web/src/lib/components/user-settings-page/user-profile-settings.svelte
index 95a2d0d590..1f3b59bfdd 100644
--- a/web/src/lib/components/user-settings-page/user-profile-settings.svelte
+++ b/web/src/lib/components/user-settings-page/user-profile-settings.svelte
@@ -44,27 +44,23 @@
       <div class="ml-4 mt-4 flex flex-col gap-4">
         <SettingInputField
           inputType={SettingInputFieldType.TEXT}
-          label={$t('user_id').toUpperCase()}
+          label={$t('user_id')}
           bind:value={editedUser.id}
           disabled={true}
         />
 
-        <SettingInputField
-          inputType={SettingInputFieldType.EMAIL}
-          label={$t('email').toUpperCase()}
-          bind:value={editedUser.email}
-        />
+        <SettingInputField inputType={SettingInputFieldType.EMAIL} label={$t('email')} bind:value={editedUser.email} />
 
         <SettingInputField
           inputType={SettingInputFieldType.TEXT}
-          label={$t('name').toUpperCase()}
+          label={$t('name')}
           bind:value={editedUser.name}
           required={true}
         />
 
         <SettingInputField
           inputType={SettingInputFieldType.TEXT}
-          label={$t('storage_label').toUpperCase()}
+          label={$t('storage_label')}
           disabled={true}
           value={editedUser.storageLabel || ''}
           required={false}
diff --git a/web/src/lib/i18n/en.json b/web/src/lib/i18n/en.json
index 1f948fe143..8120ab0eed 100644
--- a/web/src/lib/i18n/en.json
+++ b/web/src/lib/i18n/en.json
@@ -39,7 +39,7 @@
     "exclusion_pattern_description": "Exclusion patterns lets you ignore files and folders when scanning your library. This is useful if you have folders that contain files you don't want to import, such as RAW files.",
     "external_library_created_at": "External library (created on {date})",
     "external_library_management": "External Library Management",
-    "face_detection": "Face Detection",
+    "face_detection": "Face detection",
     "face_detection_description": "Detect the faces in assets using machine learning. For videos, only the thumbnail is considered. \"All\" (re-)processes all assets. \"Missing\" queues assets that haven't been processed yet. Detected faces will be queued for Facial Recognition after Face Detection is complete, grouping them into existing or new people.",
     "facial_recognition_job_description": "Group detected faces into people. This step runs after Face Detection is complete. \"All\" (re-)clusters all faces. \"Missing\" queues faces that don't have a person assigned.",
     "force_delete_user_warning": "WARNING: This will immediately remove the user and all assets. This cannot be undone and the files cannot be recovered.",
@@ -59,7 +59,7 @@
     "image_thumbnail_format": "Thumbnail format",
     "image_thumbnail_resolution": "Thumbnail resolution",
     "image_thumbnail_resolution_description": "Used when viewing groups of photos (main timeline, album view, etc.). Higher resolutions can preserve more detail but take longer to encode, have larger file sizes, and can reduce app responsiveness.",
-    "job_concurrency": "{job} Concurrency",
+    "job_concurrency": "{job} concurrency",
     "job_not_concurrency_safe": "This job is not concurrency-safe.",
     "job_settings": "Job Settings",
     "job_settings_description": "Manage job concurrency",
@@ -67,8 +67,8 @@
     "jobs_delayed": "{jobCount} delayed",
     "jobs_failed": "{jobCount} failed",
     "library_created": "Created library: {library}",
-    "library_cron_expression": "Cron Expression",
-    "library_cron_expression_presets": "Cron Expression Presets",
+    "library_cron_expression": "Cron expression",
+    "library_cron_expression_presets": "Cron expression presets",
     "library_deleted": "Library deleted",
     "library_import_path_description": "Specify a folder to import. This folder, including subfolders, will be scanned for images and videos.",
     "library_scanning": "Periodic Scanning",
@@ -83,28 +83,32 @@
     "logging_enable_description": "Enable logging",
     "logging_level_description": "When enabled, what log level to use.",
     "logging_settings": "Logging",
-    "machine_learning_clip_model": "Clip Model",
+    "machine_learning_clip_model": "CLIP model",
     "machine_learning_duplicate_detection": "Duplicate Detection",
+    "machine_learning_duplicate_detection_enabled": "Enable duplicate detection",
     "machine_learning_duplicate_detection_enabled_description": "If disabled, exactly identical assets will still be de-duplicated.",
     "machine_learning_duplicate_detection_setting_description": "Use CLIP embeddings to find likely duplicates",
+    "machine_learning_enabled": "Enable machine learning",
     "machine_learning_enabled_description": "If disabled, all ML features will be disabled regardless of the below settings.",
     "machine_learning_facial_recognition": "Facial Recognition",
     "machine_learning_facial_recognition_description": "Detect, recognize and group faces in images",
     "machine_learning_facial_recognition_model": "Facial recognition model",
     "machine_learning_facial_recognition_model_description": "Models are listed in descending order of size. Larger models are slower and use more memory, but produce better results. Note that you must re-run the Face Detection job for all images upon changing a model.",
+    "machine_learning_facial_recognition_setting": "Enable facial recognition",
     "machine_learning_facial_recognition_setting_description": "If disabled, images will not be encoded for facial recognition and will not populate the People section in the Explore page.",
-    "machine_learning_max_detection_distance": "Max detection distance",
+    "machine_learning_max_detection_distance": "Maximum detection distance",
     "machine_learning_max_detection_distance_description": "Maximum distance between two images to consider them duplicates, ranging from 0.001-0.1. Higher values will detect more duplicates, but may result in false positives.",
-    "machine_learning_max_recognition_distance": "Max recognition distance",
+    "machine_learning_max_recognition_distance": "Maximum recognition distance",
     "machine_learning_max_recognition_distance_description": "Maximum distance between two faces to be considered the same person, ranging from 0-2. Lowering this can prevent labeling two people as the same person, while raising it can prevent labeling the same person as two different people. Note that it is easier to merge two people than to split one person in two, so err on the side of a lower threshold when possible.",
-    "machine_learning_min_detection_score": "Min detection score",
+    "machine_learning_min_detection_score": "Minimum detection score",
     "machine_learning_min_detection_score_description": "Minimum confidence score for a face to be detected from 0-1. Lower values will detect more faces but may result in false positives.",
-    "machine_learning_min_recognized_faces": "Min recognized faces",
+    "machine_learning_min_recognized_faces": "Minimum recognized faces",
     "machine_learning_min_recognized_faces_description": "The minimum number of recognized faces for a person to be created. Increasing this makes Facial Recognition more precise at the cost of increasing the chance that a face is not assigned to a person.",
     "machine_learning_settings": "Machine Learning Settings",
     "machine_learning_settings_description": "Manage machine learning features and settings",
     "machine_learning_smart_search": "Smart Search",
     "machine_learning_smart_search_description": "Search for images semantically using CLIP embeddings",
+    "machine_learning_smart_search_enabled": "Enable smart search",
     "machine_learning_smart_search_enabled_description": "If disabled, images will not be encoded for smart search.",
     "machine_learning_url_description": "URL of the machine learning server",
     "manage_concurrency": "Manage Concurrency",
@@ -118,7 +122,7 @@
     "map_settings": "Map & GPS Settings",
     "map_settings_description": "Manage map settings",
     "map_style_description": "URL to a style.json map theme",
-    "metadata_extraction_job": "Extract Metadata",
+    "metadata_extraction_job": "Extract metadata",
     "metadata_extraction_job_description": "Extract metadata information from each asset, such as GPS and resolution",
     "migration_job": "Migration",
     "migration_job_description": "Migrate thumbnails for assets and faces to the latest folder structure",
@@ -186,18 +190,18 @@
     "server_external_domain_settings_description": "Domain for public shared links, including http(s)://",
     "server_settings": "Server Settings",
     "server_settings_description": "Manage server settings",
-    "server_welcome_message": "Welcome Message",
+    "server_welcome_message": "Welcome message",
     "server_welcome_message_description": "A message that is displayed on the login page.",
-    "sidecar_job": "Sidecar Metadata",
+    "sidecar_job": "Sidecar metadata",
     "sidecar_job_description": "Discover or synchronize sidecar metadata from the filesystem",
     "slideshow_duration_description": "Number of seconds to display each image",
     "smart_search_job_description": "Run machine learning on assets to support smart search",
     "storage_template_enable_description": "Enable storage template engine",
     "storage_template_hash_verification_enabled": "Hash verification failed",
     "storage_template_hash_verification_enabled_description": "Enables hash verification, don't disable this unless you're certain of the implications",
-    "storage_template_migration": "Storage Template Migration",
+    "storage_template_migration": "Storage template migration",
     "storage_template_migration_job": "Storage Migration Job",
-    "storage_template_settings": "Storage template",
+    "storage_template_settings": "Storage Template",
     "storage_template_settings_description": "Manage the folder structure and file name of the upload asset",
     "system_settings": "System Settings",
     "theme_custom_css_settings": "Custom CSS",
@@ -231,16 +235,16 @@
     "transcoding_hardware_decoding": "Hardware decoding",
     "transcoding_hardware_decoding_setting_description": "Applies only to NVENC and RKMPP. Enables end-to-end acceleration instead of only accelerating encoding. May not work on all videos.",
     "transcoding_hevc_codec": "HEVC codec",
-    "transcoding_max_b_frames": "Max B-Frames",
+    "transcoding_max_b_frames": "Maximum B-frames",
     "transcoding_max_b_frames_description": "Higher values improve compression efficiency, but slow down encoding. May not be compatible with hardware acceleration on older devices. 0 disables B-frames, while -1 sets this value automatically.",
-    "transcoding_max_bitrate": "Max bitrate",
+    "transcoding_max_bitrate": "Maximum bitrate",
     "transcoding_max_bitrate_description": "Setting a max bitrate can make file sizes more predictable at a minor cost to quality. At 720p, typical values are 2600k for VP9 or HEVC, or 4500k for H.264. Disabled if set to 0.",
-    "transcoding_max_keyframe_interval": "Max keyframe interval",
+    "transcoding_max_keyframe_interval": "Maximum keyframe interval",
     "transcoding_max_keyframe_interval_description": "Sets the maximum frame distance between keyframes. Lower values worsen compression efficiency, but improve seek times and may improve quality in scenes with fast movement. 0 sets this value automatically.",
     "transcoding_optimal_description": "Videos higher than target resolution or not in an accepted format",
     "transcoding_preferred_hardware_device": "Preferred hardware device",
     "transcoding_preferred_hardware_device_description": "Applies only to VAAPI and QSV. Sets the dri node used for hardware transcoding.",
-    "transcoding_preset_preset": "PRESET (-preset)",
+    "transcoding_preset_preset": "Preset (-preset)",
     "transcoding_preset_preset_description": "Compression speed. Slower presets produce smaller files, and increase quality when targeting a certain bitrate. VP9 ignores speeds above `faster`.",
     "transcoding_reference_frames": "Reference frames",
     "transcoding_reference_frames_description": "The number of frames to reference when compressing a given frame. Higher values improve compression efficiency, but slow down encoding. 0 sets this value automatically.",
@@ -253,13 +257,13 @@
     "transcoding_temporal_aq_description": "Applies only to NVENC. Increases quality of high-detail, low-motion scenes. May not be compatible with older devices.",
     "transcoding_threads": "Threads",
     "transcoding_threads_description": "Higher values lead to faster encoding, but leave less room for the server to process other tasks while active. This value should not be more than the number of CPU cores. Maximizes utilization if set to 0.",
-    "transcoding_tone_mapping": "TONE-MAPPING",
+    "transcoding_tone_mapping": "Tone-mapping",
     "transcoding_tone_mapping_description": "Attempts to preserve the appearance of HDR videos when converted to SDR. Each algorithm makes different tradeoffs for color, detail and brightness. Hable preserves detail, Mobius preserves color, and Reinhard preserves brightness.",
-    "transcoding_tone_mapping_npl": "TONE-MAPPING NPL",
+    "transcoding_tone_mapping_npl": "Tone-mapping NPL",
     "transcoding_tone_mapping_npl_description": "Colors will be adjusted to look normal for a display of this brightness. Counter-intuitively, lower values increase the brightness of the video and vice versa since it compensates for the brightness of the display. 0 sets this value automatically.",
     "transcoding_transcode_policy": "Transcode policy",
     "transcoding_transcode_policy_description": "Policy for when a video should be transcoded. HDR videos will always be transcoded (except if transcoding is disabled).",
-    "transcoding_two_pass_encoding": "TWO-PASS ENCODING",
+    "transcoding_two_pass_encoding": "Two-pass encoding",
     "transcoding_two_pass_encoding_setting_description": "Transcode in two passes to produce better encoded videos. When max bitrate is enabled (required for it to work with H.264 and HEVC), this mode uses a bitrate range based on the max bitrate and ignores CRF. For VP9, CRF can be used if max bitrate is disabled.",
     "transcoding_video_codec": "Video Codec",
     "transcoding_video_codec_description": "VP9 has high efficiency and web compatibility, but takes longer to transcode. HEVC performs similarly, but has lower web compatibility. H.264 is widely compatible and quick to transcode, but produces much larger files. AV1 is the most efficient codec but lacks support on older devices.",
@@ -281,7 +285,7 @@
     "version_check_enabled_description": "Enable periodic requests to GitHub to check for new releases",
     "version_check_settings": "Version Check",
     "version_check_settings_description": "Enable/disable the new version notification",
-    "video_conversion_job": "Transcode Videos",
+    "video_conversion_job": "Transcode videos",
     "video_conversion_job_description": "Transcode videos for wider compatibility with browsers and devices"
   },
   "admin_email": "Admin Email",
@@ -350,7 +354,7 @@
   "confirm": "Confirm",
   "confirm_admin_password": "Confirm Admin Password",
   "confirm_delete_shared_link": "Are you sure you want to delete this shared link?",
-  "confirm_password": "Confirm Password",
+  "confirm_password": "Confirm password",
   "contain": "Contain",
   "context": "Context",
   "continue": "Continue",
@@ -439,8 +443,6 @@
   "email": "Email",
   "empty_album": "Empty Album",
   "empty_trash": "Empty trash",
-  "enable": "Enable",
-  "enabled": "Enabled",
   "end_date": "End date",
   "error": "Error",
   "error_loading_image": "Error loading image",
@@ -624,7 +626,7 @@
   "name_or_nickname": "Name or nickname",
   "never": "Never",
   "new_api_key": "New API Key",
-  "new_password": "New Password",
+  "new_password": "New password",
   "new_person": "New person",
   "new_user_created": "New user created",
   "newest_first": "Newest first",
@@ -647,7 +649,7 @@
   "note_apply_storage_label_to_previously_uploaded assets": "Note: To apply the Storage Label to previously uploaded assets, run the",
   "note_unlimited_quota": "Note: Enter 0 for unlimited quota",
   "notes": "Notes",
-  "notification_toggle_setting_description": "Toggle email notifications",
+  "notification_toggle_setting_description": "Enable email notifications",
   "notifications": "Notifications",
   "notifications_setting_description": "Manage notifications",
   "oauth": "OAuth",
@@ -833,7 +835,7 @@
   "stop_photo_sharing_description": "{partner} will no longer be able to access your photos.",
   "stop_sharing_photos_with_user": "Stop sharing your photos with this user",
   "storage": "Storage",
-  "storage_label": "Storage Label",
+  "storage_label": "Storage label",
   "storage_usage": "{used} of {available} used",
   "submit": "Submit",
   "suggestions": "Suggestions",