chore(web): show corresponding ffmpeg argument (#1217)

web/src/lib/components/admin-page/settings/ffmpeg/ffmpeg-settings.svelte

@@ -77,7 +77,7 @@
 				<div class="flex flex-col gap-4 ml-4 mt-4">
 					<SettingInputField
 						inputType={SettingInputFieldType.NUMBER}
-						label="CRF"
+						label="CONSTANT RATE FACTOR (-crf)"
 						bind:value={ffmpegConfig.crf}
 						required={true}
 						isEdited={!(ffmpegConfig.crf == savedConfig.crf)}
@@ -85,7 +85,7 @@
 
 					<SettingInputField
 						inputType={SettingInputFieldType.TEXT}
-						label="PRESET"
+						label="PRESET (-preset)"
 						bind:value={ffmpegConfig.preset}
 						required={true}
 						isEdited={!(ffmpegConfig.preset == savedConfig.preset)}
@@ -93,7 +93,7 @@
 
 					<SettingInputField
 						inputType={SettingInputFieldType.TEXT}
-						label="AUDIO CODEC"
+						label="AUDIO CODEC (-acodec)"
 						bind:value={ffmpegConfig.targetAudioCodec}
 						required={true}
 						isEdited={!(ffmpegConfig.targetAudioCodec == savedConfig.targetAudioCodec)}
@@ -101,7 +101,7 @@
 
 					<SettingInputField
 						inputType={SettingInputFieldType.TEXT}
-						label="VIDEO CODEC"
+						label="VIDEO CODEC (-vcodec)"
 						bind:value={ffmpegConfig.targetVideoCodec}
 						required={true}
 						isEdited={!(ffmpegConfig.targetVideoCodec == savedConfig.targetVideoCodec)}
@@ -109,7 +109,7 @@
 
 					<SettingInputField
 						inputType={SettingInputFieldType.TEXT}
-						label="SCALING"
+						label="SCALING (-vf scale=)"
 						bind:value={ffmpegConfig.targetScaling}
 						required={true}
 						isEdited={!(ffmpegConfig.targetScaling == savedConfig.targetScaling)}

web/src/lib/components/admin-page/settings/setting-input-field.svelte

@@ -25,7 +25,7 @@
 
 <div class="w-full">
 	<div class={`flex place-items-center gap-1 h-[26px]`}>
-		<label class={`immich-form-label text-xs`} for={label}>{label.toUpperCase()} </label>
+		<label class={`immich-form-label text-xs`} for={label}>{label}</label>
 		{#if required}
 			<div class="text-red-400">*</div>
 		{/if}

web/src/lib/components/admin-page/settings/storate-template/storage-template-settings.svelte

@@ -197,7 +197,7 @@
 					</div>
 					<div class="flex gap-2 align-bottom">
 						<SettingInputField
-							label="template"
+							label="TEMPLATE"
 							required
 							inputType={SettingInputFieldType.TEXT}
 							bind:value={storageConfig.template}
@@ -206,7 +206,7 @@
 
 						<div class="flex-0">
 							<SettingInputField
-								label="Extension"
+								label="EXTENSION"
 								inputType={SettingInputFieldType.TEXT}
 								value={'.jpeg'}
 								disabled

web/src/lib/components/user-settings-page/change-password-settings.svelte

@@ -44,21 +44,21 @@
 			<div class="flex flex-col gap-4 ml-4 mt-4">
 				<SettingInputField
 					inputType={SettingInputFieldType.PASSWORD}
-					label="Password"
+					label="PASSWORD"
 					bind:value={password}
 					required={true}
 				/>
 
 				<SettingInputField
 					inputType={SettingInputFieldType.PASSWORD}
-					label="New password"
+					label="NEW PASSWORD"
 					bind:value={newPassword}
 					required={true}
 				/>
 
 				<SettingInputField
 					inputType={SettingInputFieldType.PASSWORD}
-					label="Confirm password"
+					label="CONFIRM PASSWORD"
 					bind:value={confirmPassword}
 					required={true}
 				/>

web/src/lib/components/user-settings-page/user-profile-settings.svelte

@@ -39,27 +39,27 @@
 			<div class="flex flex-col gap-4 ml-4 mt-4">
 				<SettingInputField
 					inputType={SettingInputFieldType.TEXT}
-					label="User ID"
+					label="USER ID"
 					bind:value={user.id}
 					disabled={true}
 				/>
 
 				<SettingInputField
 					inputType={SettingInputFieldType.EMAIL}
-					label="Email"
+					label="EMAIL"
 					bind:value={user.email}
 				/>
 
 				<SettingInputField
 					inputType={SettingInputFieldType.TEXT}
-					label="First name"
+					label="FIRST NAME"
 					bind:value={user.firstName}
 					required={true}
 				/>
 
 				<SettingInputField
 					inputType={SettingInputFieldType.TEXT}
-					label="Last name"
+					label="LAST NAME"
 					bind:value={user.lastName}
 					required={true}
 				/>